tengo un problema que nose si es mi backend(Django
) o mi frontend(React
), estoy utilizando un csrftoken como medida de seguridad, el backend y el frontend estan en dominios diferentes, Django
en pythonanywhere y React en netlifly. Al entrar a mi frontend hace una peticion GET a django para que por medio las cookies
django envie el csrftoken y despues acceder a el para enviarlo en la cabecera de alguna peticion POST, el problema es que no puedo acceder a el token aunque el httpOnly esta en false
REACT:
function getTokenCSRF(name){
let cookieValue = null;
if (document.cookie && document.cookie !== '') {
const cookies = document.cookie.split(';');
for (let i = 0; i < cookies.length; i++) {
const cookie = cookies[i].trim();
if (cookie.substring(0, name.length + 1) === (name + '=')) {
cookieValue = decodeURIComponent(cookie.substring(name.length + 1));
break;
}
}
}
return cookieValue;
}
DJANGO:
INSTALLED_APPS = [
'django.contrib.admin',
'django.contrib.auth',
'django.contrib.contenttypes',
'django.contrib.sessions',
'django.contrib.messages',
'django.contrib.staticfiles',
'corsheaders',
]
MIDDLEWARE = [
'corsheaders.middleware.CorsMiddleware',
'django.middleware.security.SecurityMiddleware',
'django.contrib.sessions.middleware.SessionMiddleware',
'django.middleware.csrf.CsrfViewMiddleware',
'django.middleware.common.CommonMiddleware',
'django.contrib.auth.middleware.AuthenticationMiddleware',
'django.contrib.messages.middleware.MessageMiddleware',
'django.middleware.clickjacking.XFrameOptionsMiddleware',
]
CORS_ALLOW_CREDENTIALS = True
CORS_ALLOW_HEADERS = [
'content-type',
'X-CSRFToken',
]
CORS_ALLOWED_ORIGINS = [
'Url de mi frontend',
]
CSRF_COOKIE_NAME = 'csrftoken'
CSRF_COOKIE_HTTPONLY = False
CSRF_COOKIE_SECURE = True
CSRF_USE_SESSIONS = False
CSRF_COOKIE_SAMESITE = 'None'
CSRF_TRUSTED_ORIGINS = ["Url de mi frontend"]
CSRF_COOKIE_DOMAIN = "Url de mi frontend"
SESSION_COOKIE_SAMESITE = 'None'
SESSION_COOKIE_SECURE = True
Tambien para añadir ya configure el navegador para que acepte cookies de terceros, en la cabecera de mi peticion GET y POST tiene el crendentials: 'include', el problema es que no puedo acceder al token con el codigo anterior de javascript; despues copie el token manualmente de las cookies del navegador y lo pegue como valor en la cabecera de X-CSFRToken en mi solicitud POST y salio todo perfecto.