FARM Stack 注销API调用时无法设置SameSite="none"; Secure属性问题

后端（FastAPI）配置 #

删除Cookie时指定的所有属性必须和设置该Cookie时的属性完全匹配，否则浏览器会判定为两个不同的Cookie，无法成功删除。
你在登录接口设置Cookie时已经配置了SameSite=None、Secure=True，注销接口的delete_cookie方法也必须传入完全相同的参数，示例代码如下：

from fastapi import Response

@app.post("/logout")
async def logout(response: Response):
    # 所有参数要和/login接口set_cookie时的参数完全一致
    response.delete_cookie(
        key="your_jwt_cookie_name", # 替换为你实际使用的JWT Cookie名称
        path="/",
        httponly=True,
        secure=True, # 和登录时配置保持一致，跨域场景必须为True
        samesite="none", # 不要用默认的lax，和登录时配置保持一致
        # 如果你登录时设置了domain参数，此处也要添加完全相同的domain值
    )
    return {"message": "注销成功"}

delete_cookie的本质是返回一个Set-Cookie头，将Cookie值置空同时设置过期时间，属性不匹配时浏览器会直接拒绝执行这个Cookie修改操作。

前端（React）配置 #

确保调用logout接口的配置和login接口一致，必须开启凭证携带：
如果使用fetch请求：

fetch("你的后端服务地址/logout", {
  method: "POST",
  credentials: "include", // 必须配置，否则请求不会携带Cookie，也不会处理响应返回的Set-Cookie
  // 其余Header配置和login接口保持一致即可
})

如果使用axios请求：

axios.post("/logout", {}, {
  withCredentials: true // 必须配置
})

补充说明 #

本地开发使用HTTP环境时，可以临时将secure设为False，samesite设为lax，上线部署到HTTPS环境后再切回secure=True和samesite="none"即可。

内容的提问来源于stack exchange，提问作者Mindaugas Jukna