Http Apollo链接中间件未向请求添加自定义头

我试图通过Apollo中间件将身份验证令牌添加到所有http请求中。我的中间件似乎从未被解雇过。我正在从localhost:8080上的客户端访问localhost:8081上的服务器。我是阿波罗的新手，所以我可能对阿波罗林克有误解

const httpLink = new HttpLink({ uri: 'http://localhost:8081/graphql' });

const getTokenMiddleware = new ApolloLink((operation, forward) => {
  operation.setContext(({ headers }) => ({
    headers: {
      ...headers,
      'x-token': localStorage.getItem('token') || null,
      'x-refresh-token': localStorage.getItem('refreshToken') || null,
    },
  }));

  return forward(operation);
});

const client = new ApolloClient({
  cache: new InMemoryCache(),
  link: from([
    getTokenMiddleware,
    httpLink
  ]),
  uri: 'http://localhost:8081/graphql',
});

这是我在服务器上得到的标题

headers: { 
     host: 'localhost:8081',
     connection: 'keep-alive',
     'content-length': '351',
     accept: '*/*',
     origin: 'http://localhost:8080',
     'user-agent': 'Mozilla/5.0 (Macintosh; Intel Mac OS X 10_12_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/65.0.3325.181 Safari/537.36',
     'content-type': 'application/json',
     dnt: '1',
     referer: 'http://localhost:8080/register',
     'accept-encoding': 'gzip, deflate, br',
     'accept-language': 'en-US,en;q=0.9' 
}

---

以下是所需的不同步骤。我希望这能解决你的问题

//1个HttpLink，用于将Apollo客户端实例与GraphQL API连接（如果您有多个URL）
常量httpLink=split(
operation=>operation.getContext（）.type=='public'，
新的HttpLink（{uri:`${GraphQLURLPublic}/query`}），
新的HttpLink（{uri:`${GraphQLURLPrivate}/query`}），
);
//2添加中间件以插入授权标头（如果需要）
//将URL拆分到两个不同的端点如果类型是私有的，它将在标头中标记，否则不会
const authLink=setContext（（操作，前一个上下文）=>{
const{headers，type}=previousContext；
如果（类型=='public'）{
返回先前的上下文；
}
//您可以访问令牌来拨打电话
const accessToken='xtz'
if（accessToken）{
返回{
…以前的背景，
标题：{
…标题，
授权：accessToken
},
};
}
返回{…previousContext}；
});
//3增加了错误处理
const ErrorLink=onError（{graphQLErrors，networkError}）=>{
如果（图形错误）
graphQLErrors.map（{message，locations，path}）=>
console.log(
`[GraphQL错误]：消息：${Message}，位置：${locations}，路径：${Path}`，
),
);
if（networkError）console.log（`[networkError]：${networkError}`）；
});
//4连接所有链接，注意：httpLink必须是最后一个
const-link=ApolloLink.from（[authLink，ErrorLink，httpLink]）；
//5通过传入组合链接和InMemoryCache的新实例来实例化Apollo客户端。
const graphqlConfig=new ApolloClient（{link，cache:new-InMemoryCache（），querydeplication:false}）

添加

凭证是否有帮助：'包括'

到您的链接选项中，请看这里：在我的头撞在桌子上几天后，我尝试将导入apollo客户端从“apollo boost”切换到导入{apollo client}从“apollo client”，现在它可以正常工作了。我觉得apollo boost是apollo客户端的替代品，但我认为api有点不同。@JordanHensley是的。你说得对

apollo boost

糟透了。三个小时后，我在一个有两张赞成票的问题的评论中找到了答案……在这种情况下，不抛出任何错误或至少一个警告的实现真的很糟糕。Http链接完全不可配置，更不用说我遵循一个来自官方来源的逐步教程…谢谢您的帮助：）