Graphene-Django не отправляет HTTPOnly JWT Cookie в React-Apollo

Привет, я делаю приложение, использующее Django и Graphene для GraphQL сервера, к которому будет обращаться React клиент, использующий Apollo. Я использую graphql_jwt для аутентификации.

Я настроил свой сервер GraphQL и клиентский код для чтения JWT, но я узнал, что localStorage недостаточно безопасен и не является файлом cookie. Мне удалось найти способ установить файл cookie HTTPOnly при выполнении запроса tokenAuth, и файл cookie сохраняется и работает в GraphiQL (localhost: 8000).

JWT HHTPOnly Cookies Set

Мне удалось это сделать с jwt_cookie декоратором от graphql_jwt.decorators

from django.contrib import admin
from django.urls import path
from graphene_django.views import GraphQLView
from django.views.decorators.csrf import csrf_exempt
from graphql_jwt.decorators import jwt_cookie

urlpatterns = [
    path('admin/', admin.site.urls),
    path('graphql/', jwt_cookie(csrf_exempt(GraphQLView.as_view(graphiql=True))))
]

К сожалению, когда я вызываю конечную точку tokenAuth из Apollo (localhost: 3000), она не устанавливает файл cookie и не могу получить к нему доступ из своего Afterware (теперь это имеет смысл, когда я думаю об этом). Ни same-origin, ни include учетные данные не работают ни на сервере HttpLink, ни в самом ApolloClient.

import { 
  ApolloClient, 
  gql, 
  ApolloProvider, 
  HttpLink, 
  from,
  useQuery,
  ApolloLink
} from '@apollo/client';
import { onError } from '@apollo/client/link/error';
import { setContext } from 'apollo-link-context';

const errorLink = onError(({ graphQLErrors, networkError }) => {
  if (graphQLErrors) {
    graphQLErrors.forEach(({ message }) => {
      console.log(message);
    });
  }
  if (networkError) {
    console.log(networkError.message)
  }
});
const afterwareLink = new ApolloLink((operation, forward) => {
  return forward(operation).map(response => {
    const context = operation.getContext();
    const { response: { headers } } = context;
    console.log(headers);
    return response;
  });
});


const link = from([
  errorLink,
  setContext((operation) => {
    console.log("HITTING SET CONTEXT");
    // const token = localStorage.getItem('authToken');
    const token = Cookies.get('authToken');
    console.log(token);
    return {
      headers: {
        Authorization: token ? `JWT ${token}` : ''
      }
    }
  }),
  afterwareLink,
  new HttpLink({ uri: 'http://localhost:8000/graphql/' })
]);

const client = new ApolloClient({
  link,
  cache,
  typeDefs,
  credentials: 'include'
});

Не обращайте внимания на значения refreshToken и authToken. Я их установил пакетом js-cookie. Но, как вы можете видеть, заголовки пусты и не были установлены при входе в систему на клиенте, а были на сервере.

введите описание изображения здесь

ВОПРОС:

Как передать заголовки ответа jwt веб-интерфейсу?


person Justin Cox    schedule 04.06.2021    source источник


Ответы (1)


ТАК, я смог решить это. Я выложил свою резолюцию на Github

https://github.com/flavors/django-graphql-jwt/issues/191

person Justin Cox    schedule 10.06.2021