Apollo resetStore无法在Angular客户端中运行

时间:2017-09-13 22:30:37

标签: angular graphql apollo apollo-client apollo-server

我正在尝试在客户端集成授权令牌。我在中间件中传递此令牌。用户注销时重置商店,然后获取新令牌。现在,当我发送新请求时,它仍然发送旧令牌(缓存)

这是我的代码app.module.ts

const networkInterface = createNetworkInterface({
  uri: "http://localhost:3000/graphql"
});

networkInterface.use([
  {
    applyMiddleware(req, next) {
      if (!req.options.headers) {
        req.options.headers = {}; // Create the header object if needed.
      }

      req.options.headers.authorization = localStorage.getItem(AUTH_TOKEN);
      next();
    }
  }
]);

export function provideClient(): ApolloClient {
  return new ApolloClient({
    networkInterface,
    dataIdFromObject: (o: any) => `${o.__typename}-${o.id},`
  });
}

当我退出时,我有这个代码

localStorage.removeItem(AUTH_TOKEN);
this._apollo.getClient().resetStore(); 

然后,当我发出另一个请求时,它仍然在请求标头中使用旧标记。

如何使用新令牌更新此内容?

1 个答案:

答案 0 :(得分:0)

我可能会将中间件更改为:

networkInterface.use([{
    applyMiddleware(req, next) {
        if (!req.options.headers) req.options.headers = {}
        const token = localStorage.getItem('token')
        req.options.headers.authorization = token ? token : null
        next()
    }
}])

注意那里的三元运算符token ? token : null。这将确保除非应用知道令牌,否则无法发送auth标头。如果您的客户端仍在发送它,则该令牌未被正确删除。

您也可以尝试快速测试:注销后,按F12键入浏览器控制台:localStorage并查看令牌是否仍然在那里。

我的代码无法分辨,但看起来你有一个名为AUTH_TOKEN的变量,它返回一个类似'token'或你使用的任何键的字符串。我只想明确提到您是按键删除令牌,而不是按值删除。

添加令牌:localStorage.setItem('token', 'e47nes45nysde5nue5nu')

删除令牌:localStorage.removeItem('token')

如果您的代码是这样的:

const AUTH_TOKEN = 'e47nes45nysde5nue5nu'
localStorage.removeItem(AUTH_TOKEN)

然后,这就是为什么它仍然使用auth令牌进行查询。如果它找不到从localStorage中删除的匹配键,我认为它不会在控制台中生成错误。