Session Nuxt Apollo，具有用于基于会话的身份验证的动态头

Apollo没有动态存储查询中的头

方法：{
取车（）{
const token=Cookies.get（'XSRF-token'）
console.log（token）/为了实现这一点，我们需要访问每次
获取
时运行的代码。此代码位于Apollo客户端的HttpLink中。虽然
@nuxtjs/Apollo
模块为我们提供了许多选项，但我们无法在如此高的级别上对其进行配置

步骤1：创建客户端插件
正如Apollo模块文档中提到的，我们可以提供一个插件的路径，该插件将定义
clientConfig
：

//nuxt.config.js
{
阿波罗：{
客户端配置：{
默认值：“~/plugins/apollo client.js”
}
}
}

此插件应导出一个接收的函数。它应返回要传递给的配置。您不必担心该文件，但这是
@nuxtjs/apollo
在内部创建客户端的方式

步骤2：创建自定义
httpLink
在
createApolloClient
的选项中，我们可以禁用
defaultHttpLink
，而是提供我们自己的
link
，
link
需要是Apollo官方
createHttpLink
实用程序的输出，可以找到文档。我们最感兴趣的选项是
fetch
选项正如文档所述，是

用于发出请求的
fetch
兼容API

这归结为一个函数，它接受
uri
和
options
参数，并返回表示网络交互的
Promise

步骤3：创建自定义
fetch
方法
如上所述，我们需要一个函数，它接受
uri
和
options
并返回一个承诺。此函数将是标准
fetch
方法的简单传递（您可能需要将
同构fetch
添加到依赖项中，并根据您的设置将其导入此处）

我们将像您在问题中所做的那样提取您的cookie，然后将其设置为标头。fetch函数应如下所示：

（uri，选项）=>{
const token=Cookies.get（'XSRF-token'）
options.headers['X-XSRF-TOKEN']=TOKEN
返回获取（uri、选项）
}

把它们放在一起
最后，您的
~/plugins/apollo client.js
文件应该如下所示：

从'apollo link http'导入{createHttpLink}
从“同构提取”导入提取
导出默认函数（上下文）{
返回{
defaultHttpLink:false，
链接：createHttpLink({
uri:“/graphql”，
凭据：“包括”，
获取：（uri，选项）=>{
const token=Cookies.get（'XSRF-token'）
options.headers['X-XSRF-TOKEN']=TOKEN
返回获取（uri、选项）
}
})
}
}