Apollo resetStore 在 Angular 客户端中不起作用
Posted
技术标签:
【中文标题】Apollo resetStore 在 Angular 客户端中不起作用【英文标题】:Apollo resetStore is not working in Angular client 【发布时间】:2018-02-22 18:25:53 【问题描述】:我正在尝试在客户端集成授权令牌。我在中间件中传递这个令牌。当用户注销时重置存储然后获取新令牌。现在,当我发送新请求时,它仍在发送旧令牌(缓存)
这是我的代码 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】:我可能会将中间件更改为:
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 的变量,它返回一个类似于“令牌”或您使用的任何键的字符串。我只想明确指出,您是按键而不是按值删除令牌。
添加令牌:localStorage.setItem('token', 'e47nes45nysde5nue5nu')
移除令牌:localStorage.removeItem('token')
如果你的代码是这样的:
const AUTH_TOKEN = 'e47nes45nysde5nue5nu'
localStorage.removeItem(AUTH_TOKEN)
然后,这就是它仍在使用身份验证令牌进行查询的原因。如果找不到要从 localStorage 中删除的匹配键,我认为它不会在控制台中生成错误。
【讨论】:
以上是关于Apollo resetStore 在 Angular 客户端中不起作用的主要内容,如果未能解决你的问题,请参考以下文章