Cookie 未在前端设置,即使它存在于网络选项卡中

Cookie is not being set in the frontend even if it is present in the network tab

我在后端使用 Go 和 mux,在前端使用简单的 html。 响应中设置cookie的代码(未满):

import  "github.com/gorilla/sessions" // this is where sessions come from

var store = sessions.NewCookieStore([]byte("secret"))
store.Options = &sessions.Options{
        MaxAge:   3600 * 24,
        HttpOnly: true,
        Path: "/",
        Secure: true,
    }
session, _ := store.Get(request, "uid")
session.Values["uid"] = token
err = session.Save(request, writer)
if err != nil {
    log.Fatalln(err)
    return
}

这就是我获取的方式:

fetch("http://localhost:8000/user/register", {
          method: "POST",
          headers: {
            "Content-Type": "application/json",
          },
          credentials: 'include',
          body: JSON.stringify(user),
        })

我还在后端启用了 cors:

c := cors.New(cors.Options{
        AllowedOrigins: []string{"http://127.0.0.1:3000"},
        AllowCredentials: true,
    })

内容 set-cookie header:

Set-Cookie: uid=jwt_token; Path=/; Expires=Tue, 20 Jul 2021 08:42:37 GMT; Max-Age=86400; HttpOnly; Secure

未设置 cookie,但在网络选项卡中存在 'set-cookie' header。如果您需要有关我的代码的更多详细信息,请在评论中提问,我会 post 一个 link 到一个 pastebin。

编辑:在找到更好的解决方案之前,我从前端设置 cookie,现在后端发送 json 数据。考虑到我的“初始设计”有点老套,但现在可以用了。

我认为这与 SameSite cookie 属性有关。检查您的回复的 header Set-Cookie 字段末尾是否有黄色三角形,表示出现问题(我正在使用 chrome 开发工具)。如果是这样,您应该对服务器使用相同的 domainPOST。例如;

  • 假设您从 http://127.0.0.1:3000 访问 front-end,并且您的服务器正在侦听端口 8000 那么对服务器的请求应该是这样的;
fetch("http://127.0.0.1:8000/user/register", {
          method: "POST",
          headers: {
            "Content-Type": "application/json",
          },
          credentials: 'include',
          body: JSON.stringify(user),
        })

这是因为 localhost127.0.0.1 被视为不同的主机。 有关 SameSite 属性的更多信息,您可以查看 MDN docs.