gatsby-source-graphql好像没有传cookieheader,怎么解决?
gatsby-source-graphql does not seem to pass cookie header, how to solve?
如何从 gatsby-source-graphql 传递 Cookie header?
我正在使用 gatsby-source-graphql (https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby-source-graphql),最近不得不实施 AWS Cloudfront 签名 Cookie 来授权用户访问私有暂存环境,因此对 graphql 端点的请求,由插件处理,需要在请求中包含 cookie header,我通过:
{
resolve: 'gatsby-source-graphql',
options: {
cookie: 'var1=val1; var2=val2; '
}
}
以上失败,
ServerParseError: Unexpected token < in JSON at position 0
如果禁用签名 Cookie 并使端点 public,它会起作用。
而且,如果我再次将其保密并使用 curl 进行测试,则有效:
curl --cookie 'var1=val1; var2=val2; ' graphql_endpoint.com
我试图弄清楚为什么 Cookie header 没有通过,但问题似乎出在上面插件使用的另一个名为 'apollo-link-http' (https://github.com/gatsbyjs/gatsby/blob/master/packages/gatsby-source-graphql/src/gatsby-node.js) 的插件中
与此同时,查看 apollo-http-link (https://www.apollographql.com/docs/link/links/http/) and a issue reported here (https://github.com/apollographql/apollo-client/issues/4455),我尝试了:
{
resolve: 'gatsby-source-graphql',
options: {
typeName: 'FOOBAR',
fieldName: 'foobar',
createLink: (pluginOptions) => {
return createHttpLink({
uri: process.env.GATSBY_GRAPHQL_API_URL,
credentials: 'include',
headers: {
cookie: "CloudFront-Policy=xxxxx_; CloudFront-Key-Pair-Id=xxxxx; CloudFront-Signature=xxxxxxxxxx; path=/;",
},
fetch,
})
},
}
},
没有成功,和之前一样的错误。
还尝试使用 node-fetch、
的获取选项
{
resolve: 'gatsby-source-graphql',
options: {
typeName: 'FOOBAR',
fieldName: 'foobar',
url: process.env.GATSBY_GRAPHQL_API_URL,
fetchOptions: {
credentials: 'include',
headers: {
cookie: "CloudFront-Policy=xxxxx_; CloudFront-Key-Pair-Id=xxxxx; CloudFront-Signature=xxxxxxxxxx; path=/;",
},
},
}
},
你可以在这里看到 fetchOptions (https://github.com/gatsbyjs/gatsby/blob/master/packages/gatsby-source-graphql/src/gatsby-node.js)
没有成功!这可能是一个错误。
在花了很多时间查看文档和其他报告后,我根据我最初发布的尝试找到了解决方案。
我首先查看浏览器版本,然后检查 cookie header 属性 名称以避免任何拼写错误。我确定它应该是 "Cookie",因为我发现的大多数示例都提到了“.cookie”等
话虽如此,我已经检查了所有相关包和源代码的文档:
https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby-source-graphql
https://github.com/gatsbyjs/gatsby/blob/master/packages/gatsby-source-graphql/src/gatsby-node.js
https://www.apollographql.com/docs/link/links/http/
https://github.com/apollographql/apollo-client/issues/4455
最后,我在单独的 属性 中声明了 headers cookie 参数,node-fetch 包的选项:
https://github.com/bitinn/node-fetch
结果:
{
resolve: 'gatsby-source-graphql',
options: {
typeName: 'FOOBAR',
fieldName: 'foobar',
url: process.env.GATSBY_GRAPHQL_API_URL,
headers: {
Cookie: 'CloudFront-Policy=xxxxx_; CloudFront-Key-Pair-Id=xxxxx; CloudFront-Signature=xxxxxxxxxx; path=/;'
},
credentials: 'include',
}
},
上面发生的事情是 "credentials include" 允许 cross-browser 源请求并启用 cookies (https://www.apollographql.com/docs/react/networking/authentication/#cookie)
希望这对以后的其他人有所帮助,因为它不是微不足道的。
如何从 gatsby-source-graphql 传递 Cookie header?
我正在使用 gatsby-source-graphql (https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby-source-graphql),最近不得不实施 AWS Cloudfront 签名 Cookie 来授权用户访问私有暂存环境,因此对 graphql 端点的请求,由插件处理,需要在请求中包含 cookie header,我通过:
{
resolve: 'gatsby-source-graphql',
options: {
cookie: 'var1=val1; var2=val2; '
}
}
以上失败,
ServerParseError: Unexpected token < in JSON at position 0
如果禁用签名 Cookie 并使端点 public,它会起作用。
而且,如果我再次将其保密并使用 curl 进行测试,则有效:
curl --cookie 'var1=val1; var2=val2; ' graphql_endpoint.com
我试图弄清楚为什么 Cookie header 没有通过,但问题似乎出在上面插件使用的另一个名为 'apollo-link-http' (https://github.com/gatsbyjs/gatsby/blob/master/packages/gatsby-source-graphql/src/gatsby-node.js) 的插件中
与此同时,查看 apollo-http-link (https://www.apollographql.com/docs/link/links/http/) and a issue reported here (https://github.com/apollographql/apollo-client/issues/4455),我尝试了:
{
resolve: 'gatsby-source-graphql',
options: {
typeName: 'FOOBAR',
fieldName: 'foobar',
createLink: (pluginOptions) => {
return createHttpLink({
uri: process.env.GATSBY_GRAPHQL_API_URL,
credentials: 'include',
headers: {
cookie: "CloudFront-Policy=xxxxx_; CloudFront-Key-Pair-Id=xxxxx; CloudFront-Signature=xxxxxxxxxx; path=/;",
},
fetch,
})
},
}
},
没有成功,和之前一样的错误。
还尝试使用 node-fetch、
的获取选项{
resolve: 'gatsby-source-graphql',
options: {
typeName: 'FOOBAR',
fieldName: 'foobar',
url: process.env.GATSBY_GRAPHQL_API_URL,
fetchOptions: {
credentials: 'include',
headers: {
cookie: "CloudFront-Policy=xxxxx_; CloudFront-Key-Pair-Id=xxxxx; CloudFront-Signature=xxxxxxxxxx; path=/;",
},
},
}
},
你可以在这里看到 fetchOptions (https://github.com/gatsbyjs/gatsby/blob/master/packages/gatsby-source-graphql/src/gatsby-node.js)
没有成功!这可能是一个错误。
在花了很多时间查看文档和其他报告后,我根据我最初发布的尝试找到了解决方案。
我首先查看浏览器版本,然后检查 cookie header 属性 名称以避免任何拼写错误。我确定它应该是 "Cookie",因为我发现的大多数示例都提到了“.cookie”等
话虽如此,我已经检查了所有相关包和源代码的文档:
https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby-source-graphql
https://github.com/gatsbyjs/gatsby/blob/master/packages/gatsby-source-graphql/src/gatsby-node.js
https://www.apollographql.com/docs/link/links/http/
https://github.com/apollographql/apollo-client/issues/4455
最后,我在单独的 属性 中声明了 headers cookie 参数,node-fetch 包的选项:
https://github.com/bitinn/node-fetch
结果:
{
resolve: 'gatsby-source-graphql',
options: {
typeName: 'FOOBAR',
fieldName: 'foobar',
url: process.env.GATSBY_GRAPHQL_API_URL,
headers: {
Cookie: 'CloudFront-Policy=xxxxx_; CloudFront-Key-Pair-Id=xxxxx; CloudFront-Signature=xxxxxxxxxx; path=/;'
},
credentials: 'include',
}
},
上面发生的事情是 "credentials include" 允许 cross-browser 源请求并启用 cookies (https://www.apollographql.com/docs/react/networking/authentication/#cookie)
希望这对以后的其他人有所帮助,因为它不是微不足道的。