javascript - 使用来自 apollo-boots 的 Context 进行身份验证的问题

Question

我正在进行用户身份验证。随着反应和阿波罗。它有效，但它一直在运行。

在控制台中，我只收到“未定义”，但是当我从输入表单发送数据时，令牌被正确发送，然后是“未定义”。

服务器/index.js

import { ApolloServer } from 'apollo-server-express';

import { typeDefs } from './data/schema.js';
import { resolvers } from './data/resolvers.js'

const app = express();

const server = new ApolloServer({ 
    typeDefs, 
    resolvers,
    context: async({req}) => {
        // obtener token desde el cliente 
        const token = req.headers['authorization']
        console.log(token)
    },
    introspection: true, 
    playground: true,
});
server.applyMiddleware({app});

app.listen(process.env.PORT || 4000, 
    () => console.log("Server is running on"))

在 React 客户端我有这个。

hoc/ApolloConnect

import ApolloClient, { InMemoryCache } from 'apollo-boost';

export const client = new ApolloClient({
  uri: "http://localhost:4000/graphql",

  // enviar token al servidor 
  fetchOptions: {
    credentials: 'include'
  },
  request: operation =>{
    const token = localStorage.getItem('token')

    operation.setContext({
      headers: {
        authorization : token
      }
    })

    return(operation)
  },

  cache: new InMemoryCache({
    addTypename: false
  }),
  onError: ({ networkError, graphQLErrors}) =>{
    console.log('graphQLError', graphQLErrors);
    console.log('networkError', networkError)
  }
})

index.js

import React from 'react';
import ReactDOM from 'react-dom';
import App from './App';
import {client} from './hoc/ApolloConnect'
import { ApolloProvider } from 'react-apollo'; 

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