Невозможно пройти аутентификацию с помощью аутентификации на основе cookie в Django React

Я пытаюсь запустить сервер Django и приложение React с аутентификацией на основе cookie. Аутентификация выполняется с помощью django-graphql-jwt и Apollo Client. Процесс аутентификации работает правильно, и я получаю JWT-токен, но cookies не устанавливаются.

Вот мои файлы настроек:

basic.py

# Application definition
INSTALLED_APPS = [
    'django.contrib.admin',
    'django.contrib.auth',
    'django.contrib.contenttypes',
    'django.contrib.sessions',
    'django.contrib.messages',
    'django.contrib.staticfiles',

    'users',
    'todolist',

    # Pip packages
    'stripe',
    'corsheaders',
    "graphene_django",
    'graphql_jwt',
    'graphql_jwt.refresh_token.apps.RefreshTokenConfig',

]

MIDDLEWARE = [
    'corsheaders.middleware.CorsMiddleware', # Corsheaders
    'django.middleware.security.SecurityMiddleware',
    'django.contrib.sessions.middleware.SessionMiddleware',
    'django.middleware.common.CommonMiddleware',
    #'django.middleware.csrf.CsrfViewMiddleware',
    'django.contrib.auth.middleware.AuthenticationMiddleware',
    'django.contrib.messages.middleware.MessageMiddleware',
    'django.middleware.clickjacking.XFrameOptionsMiddleware',

    'whitenoise.middleware.WhiteNoiseMiddleware', # Whitenoise
    #"django_graphql_ratelimit.middleware.ParseClientIpMiddleware", # Django graphql ratelimit
]

# Password validation
AUTH_PASSWORD_VALIDATORS = [
    {
        'NAME': 'django.contrib.auth.password_validation.UserAttributeSimilarityValidator',
    },
    {
        'NAME': 'django.contrib.auth.password_validation.MinimumLengthValidator',
    },
    {
        'NAME': 'django.contrib.auth.password_validation.CommonPasswordValidator',
    },
    {
        'NAME': 'django.contrib.auth.password_validation.NumericPasswordValidator',
    },
]

development.py

import os

DEBUG_VALUE = os.getenv('DEBUG')
SECRET_KEY = os.getenv('SECRET_KEY') 

# Server is running in production
if DEBUG_VALUE == False or DEBUG_VALUE == 'False':
    # HTTPS settings
    CSRF_COOKIE_HTTPONLY = False
    CSRF_COOKIE_SECURE = True
    SESSION_COOKIE_SECURE = True
    SECURE_SSL_REDIRECT = True

    # HSTS settings
    SECURE_HSTS_SECONDS = 31536000 # 1 year
    SECURE_HSTS_PRELOAD = True
    SECURE_HSTS_INCLUDE_SUBDOMAINS = True

# Corsheaders
CORS_ALLOW_CREDENTIALS = True
CORS_ALLOWED_ORIGINS = [
    'http://127.0.0.1:8000',
    'http://localhost:3000',
    'https://my-todo-app-frontend-site.netlify.app'
]

ALLOWED_HOSTS = [
    '127.0.0.1',
    '.vercel.app',
    'www.my-todo-app-frontend-site.netlify.app'
]

# Whitenoise
STATICFILES_STORAGE = 'whitenoise.storage.CompressedManifestStaticFilesStorage'

ROOT_URLCONF = 'backend.urls'
WSGI_APPLICATION = 'backend.wsgi.application'

# Internationalization
LANGUAGE_CODE = 'en-us'
TIME_ZONE = 'UTC'
USE_I18N = True

USE_L10N = True
USE_TZ = True

graphene.py

import os
from datetime import timedelta

HOST_URL = os.getenv('HOST_URL')

GRAPHENE = {
    "SCHEMA": "backend.schema.schema",
    'MIDDLEWARE': [
        'graphql_jwt.middleware.JSONWebTokenMiddleware',
    ],
}

GRAPHQL_JWT = {
    'JWT_COOKIE_DOMAIN': HOST_URL,
    'JWT_VERIFY_EXPIRATION': False,
    'JWT_LONG_RUNNING_REFRESH_TOKEN': True,
    'JWT_EXPIRATION_DELTA': timedelta(minutes=15),
    'JWT_REFRESH_EXPIRATION_DELTA': timedelta(days=7),
    
    # Rename JWT cookie tokens
    'JWT_COOKIE_NAME': 'accessToken',
    'JWT_REFRESH_TOKEN_COOKIE_NAME': 'refreshToken',
}

Вот файл urls.py:

import os
from django.contrib import admin
from django.urls import path, include
from graphene_django.views import GraphQLView
from graphql_jwt.decorators import jwt_cookie
from django.views.decorators.csrf import csrf_exempt
from django.views.generic import TemplateView
from django.http import HttpResponse
from django.middleware.csrf import get_token
from django.conf import settings
from django.conf.urls.static import static

ADMIN_PATH = os.getenv('ADMIN_PATH')
DEBUG = os.getenv('DEBUG')

urlpatterns = [
    path("", include("todolist.urls")),
    path(f'{ADMIN_PATH}/', admin.site.urls),
    path('graphql/', jwt_cookie(GraphQLView.as_view(graphiql=DEBUG))),
    path('robots.txt', TemplateView.as_view(template_name='static/text/robots.txt')),
    #re_path('.*', TemplateView.as_view(template_name='index.html')),
] 

Наконец, вот файл index.js:

import React from "react";
import ReactDOM from "react-dom";
import App from "./App";
import { BrowserRouter as Router } from "react-router-dom";
import Cookies from "js-cookie";
import { setContext } from "@apollo/client/link/context";
import {
  ApolloProvider,
  ApolloClient,
  InMemoryCache,
  createHttpLink,
} from "@apollo/client";
import {
  refreshTokenSilently,
  verifyAccessToken,
} from "./components/Api/axios";

const BASE_URL = process.env.REACT_APP_BASE_URL;

// Verify if access token expired
const customFetch = async (uri, options) => {
  const tokenExpired = await verifyAccessToken();

  if (tokenExpired === "true") {
    await refreshTokenSilently();
  }

  return fetch(uri, options);
};

const httpLink = createHttpLink({
  uri: `${BASE_URL}/graphql/`,
  credentials: "include",
  fetch: customFetch,
});

// Access token is send through httponly cookie
const authLink = setContext((_, { headers }) => {
  // Get csrftoken from Cookies
  const csrftoken = Cookies.get("csrftoken");

  // Return the headers to the context so httpLink can read them
  return {
    headers: {
      ...headers,
      "X-CSRFToken": csrftoken,
    },
  };
});

const client = new ApolloClient({
  link: authLink.concat(httpLink),
  cache: new InMemoryCache(),
  credentials: "include",
});

ReactDOM.render(
  <React.StrictMode>
    <ApolloProvider client={client}>
      <Router>
        <App />
      </Router>
    </ApolloProvider>
  </React.StrictMode>,
  document.getElementById("root")
);

Обратите внимание, что это мой старый проект, который я пытаюсь запустить. Некоторые вещи и функции могут быть устаревшими

Вернуться на верх