在组件外部访问 cookie 数据

Question

我正在构建一个 Next.js 应用程序，使用 Strapi 作为 CMS 和身份验证服务器。我已经设法从 auth 端点获取 JWT，并将其存储在 cookie 中。要从 strapi 检索受保护的内容，我需要 send this JWT in the header

我正在使用 Apollo 向 strapi 发送 graphQL 查询，根据他们的 documentation，我可以通过将其添加到 utils/apollo.js

来轻松设置身份验证 headers

const authLink = setContext((_, { headers }) => {
  // get the authentication token from local storage if it exists
  const token = cookies.get('jwt') <-- This is what I'd like to do, but I can't figure out how to access cookies at this point.
  // return the headers to the context so httpLink can read them
  return {
    headers: {
      ...headers,
      authorization: token ? `Bearer ${token}` : "",
    }
  }
});

如何访问上述应用程序中的 cookie。它不是组件的一部分，但它用于构建 HOC?

虽然可以选择使用 localstorage，但我了解到 cookie 是一种更安全的数据存储方式。安全使用 cookie 不是一种选择 - 我不确定 strapi 是否允许它，而且因为有多个前端来源 vercel 为所有分支构建预览

Answer 1

设置 cookie 后，它将在 Cookie header 中传递，因此您需要从那里检索它，而不是 cookies object在浏览器中可用，但在 server-side 请求中不可用。此外，如果您在客户端和服务器中都使用 CORS you will need to enable 凭据，特别是在客户端中，您需要设置 credentials: 'include'。这是 cookie 工作所必需的设置。

在组件外部访问 cookie 数据

Access cookie data outside a component

node.js

jwt

reactjs

next.js

apollo-client