Question

我在ReactJS项目中使用的是Apollo Graphql，它使用的是“ Json Web令牌”，每个查询或突变都需要使用它来进行身份验证。

我面临的问题是，不是将授权添加为Key：Value对，而是将其添加到后端（Java / Spring Boot）找不到的Access-Control-Request-Headers中。当我从React项目进行呼叫时，我得到500响应，但是当使用Postman时，我得到“ 200 OK”

关于如何管理我的过帐方法以正确进行呼叫的任何建议？

import React from 'react';
import './App.css';
import AppRouter from './AppRouter';
import {ApolloProvider} from 'react-apollo';

import ApolloClient from 'apollo-client';
import { InMemoryCache } from 'apollo-cache-inmemory';
import { HttpLink } from 'apollo-link-http';
import { setContext } from 'apollo-link-context';

const authLink = setContext((_, { headers }) => {

  const token = localStorage.getItem('token')
  return {
    headers: {
      ...headers,
      Authorization: token ? `Bearer ${token}` : "",
    }
  }
});
console.log(authLink)
const httpLink = new HttpLink({
  uri: 'http://localhost:8080/graphql',
  credentials: 'same-origin' 
})

const client = new ApolloClient({
  cache: new InMemoryCache(),
  ssrMode: true,
  connectToDevTools: true,
  link: authLink.concat(httpLink)
});


function App() { 

  return (
    <div className="App">
      <ApolloProvider client={client}>
        <AppRouter/>
      </ApolloProvider>
    </div>
  );
}

export default App;

这是标题的样子

Provisional headers are shown
Access-Control-Request-Headers: authorization,content-type
Access-Control-Request-Method: POST
Origin: http://localhost:3000
Referer: http://localhost:3000/Runners
Sec-Fetch-Mode: no-cors
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/76.0.3809.132 Safari/537.36

这就是他们的样子

Provisional headers are shown
Access-Control-Request-Headers: content-type
Access-Control-Request-Method: POST
Origin: http://localhost:3000
Authorization: Bearer ...............
Referer: http://localhost:3000/Runners
Sec-Fetch-Mode: no-cors
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/76.0.3809.132 Safari/537.36

无法在Apollo graphql

0 个答案: