关键词：
【中文标题】如何将 cookie 用于 HTML 和 API 调用具有不同域的站点？【英文标题】：How can I use cookies with a site where the HTML and the API calls have different domains? 【发布时间】：2020-07-17 02:15:29 【问题描述】：我在静态服务器（恰好是 Amazon S3）上托管一个单页应用程序网站，因此它是从我的应用程序的 URL 提供的，比如说“example.com”。所以该网站位于“https://example.com”。该站点使用使用 JavaScript 的 fetch() 调用进行的 API 调用来执行站点的功能。因为 example.com 指向一个静态服务器，API 调用转到不同的域，我们称之为“xyz.execute-api.cloudhost.com”（它恰好位于亚马逊的 API 网关后面）。
我想使用 cookie 来管理用户会话。也就是说，我希望一个 API 调用在响应中返回一个 Set-Cookie 标头，该标头将在浏览器上存储一个 cookie，并且我希望某些其他 API 调用在请求上传递一个 Cookie 标头，然后可以在 API 中对其进行验证。 cookie 将始终来自 API 并返回到 API（不是页面站点，因为页面本身托管在静态服务器上）。我希望在会话之间保存 cookie（具有一些到期生命周期，并且了解浏览器可能会由于空间限制或用户操作而清除它）。
但这很难做到。首先，我的 API 调用都是到一个单独的域，所以我必须使用 CORS 来授权调用。当我使用 CORS 时，服务器必须在 Access-Control-Allow-Headers 列表中包含“Cookie”，否则将不会返回。此外，当我使用 Javascript 的 fetch() API 进行调用时，我需要指定包含这样的凭据：
fetch(url, method: "POST", credentials: "include")
...否则 cookie 将不会被发送。返回 cookie 的 API 调用不需要接收 cookie，但我也必须为此指定 credentials: "include"，否则浏览器将忽略该 Set-Cookie 响应标头。
我还需要正确配置 cookie 本身。各种 API 调用有不同的路径，所以我需要在我的 Set-Cookie 标头中指定Path=/。我更喜欢设置SameSite=Strict、Secure、HttpOnly 和Max-Age 的值，但如果需要我愿意灵活处理。
这就是我所知道的。我仍然无法让我的 cookie 被放置（使用 Set-Cookie）并以跨平台的方式返回到服务器（在 Cookie 中）。因为页面域与 API 域不同，我可能需要指定 SameSite=None，但如果这样做，recent standards changes 可能还需要我设置 Secure（这很好）。即便如此，我也无法让所有主流浏览器都返回 cookie。我还希望用相同的密钥设置一个新的 cookie 会替换现有的，但我也无法让它工作——当它返回时，我看到了两个 cookie。
在这种情况下使用 cookie 的正确方法是什么？
【问题讨论】：
【参考方案1】：正如您特别提到的，您希望从单独的站点向 API 站点发起这些请求，这意味着它们本质上是跨站点或第三方请求，因此 cookie必须 标记为SameSite=None; Secure。
如果您想使用 SameSite=Strict 或 SameSite=Lax 之类的内容，则需要改为在 SPA 中管理 cookie。这可能更可取，因为它允许您将会话标识符或令牌存储在那里，然后将其作为单独的字段或标头传递给您的 API。这样您的 API 不依赖于 cookie，这可能是可取的。
【讨论】：
React + Laravel + Sanctum 用于 api 令牌认证（不是 cookie）
】React+Laravel+Sanctum用于api令牌认证（不是cookie）【英文标题】：React+Laravel+Sanctumforapitokenauthentication(NOTcookie)【发布时间】：2021-02-0510:16:56【问题描述】：我正在尝试使用中间件Sanctum让React和Laravel一起工作。我可以阅读许多尝试... 查看详情
Web API 将 JWT 保存在 cookie 中，但无法删除
...发布时间】：2022-01-0421:12:49【问题描述】：我编写了一个用于登录和注销的C#webapi端点。当有人登录时，我会在他们的浏览器cookie中保存一个jwt令牌。但是当用户注销时我无法删除cookie。cookie仅在POSTMAN中被删除。这是我的登录和... 查看详情
如何将 Laravel 护照用于 Auth 和 Lumen 作为 api
】如何将Laravel护照用于Auth和Lumen作为api【英文标题】：HowtouseLaravelpassportforAuthandLumenasapi【发布时间】：2017-10-0717:37:13【问题描述】：我正在研究使用laravel、laravelpassport、lumen和AngularJS开发一个使用API的应用程序我有3个域如下aut... 查看详情
如何将 BOM Api 用于天气、潮汐和膨胀
】如何将BOMApi用于天气、潮汐和膨胀【英文标题】：HowtouseBOMApiforweather,tideandswell【发布时间】：2017-01-2419:58:20【问题描述】：我在澳大利亚的BOMapi上有很多搜索。没有简单的方法可以获取风、温度、湿度等天气详细信息。它们... 查看详情
如何将 OpenWeatherMap API 用于 Javascript？
】如何将OpenWeatherMapAPI用于Javascript？【英文标题】：HowtouseOpenWeatherMapAPIforJavascript?【发布时间】：2015-11-0810:56:13【问题描述】：我正在尝试使用OpenWeatherMapAPIforjavascript创建一个天气应用程序。我的网络应用程序的代码是：<!DOCT... 查看详情
如何将 cookie 发布到不同的链接？
】如何将cookie发布到不同的链接？【英文标题】：howcanIPOSTcookiestoadifferentlink?【发布时间】：2011-10-3118:45:26【问题描述】：有没有办法使用javascript发布可用于特定域（例如.example.com）的所有cookie（cookie名称、值和过期时间）？.... 查看详情
如何将 AWS CloudFront 和 API Gateway 并排用于同一个域？
】如何将AWSCloudFront和APIGateway并排用于同一个域？【英文标题】：HowcanIuseAWSCloudFrontandAPIGatewaysidebysideforthesamedomain?【发布时间】：2017-08-1008:13:26【问题描述】：我将我网站的静态资产放在S3上，并设置CloudFront来分发它们。这些基... 查看详情
将单独的 Dyno 用于反应前端和 Django 后端时的 Cookie
】将单独的Dyno用于反应前端和Django后端时的Cookie【英文标题】：CookieswhenusingseparateDynoforreactfrontendandDjangobackend【发布时间】：2019-09-2918:07:57【问题描述】：我正在构建一个简单的Web应用程序，前端使用React.js，服务器端使用Django... 查看详情
如何使用 Axios 将 JWT 存储在 cookie 中？
】如何使用Axios将JWT存储在cookie中？【英文标题】：HowcanIstoreaJWTincookiesusingAxios?【发布时间】：2019-07-0606:05:01【问题描述】：我在我的React应用程序和Axios中使用JWT来处理API调用。我正在寻找一种将令牌存储在cookie中的方法，这样... 查看详情
如何使用.Net Core cookie中间件ticketdataformat将Jwt令牌从Api保存到c#中的cookie
】如何使用.NetCorecookie中间件ticketdataformat将Jwt令牌从Api保存到c#中的cookie【英文标题】：HowtosaveJwttokenfromApitocookieinc#using.NetCorecookiemiddlewareticketdataformat【发布时间】：2017-05-1803:00:42【问题描述】：我正在学习.netcorejwt，编写自己... 查看详情
我如何在 Axios 中传递 cookie
】我如何在Axios中传递cookie【英文标题】：HowcouldipasscookiesinAxios【发布时间】：2022-01-1302:41:49【问题描述】：我在next-js应用程序中，我的身份验证令牌存储在cookie中。对于某些原因，我使用Swr和Api路由来获取我的安全api后端。我... 查看详情
如何将 YouTube API 用于 iOS 应用？
】如何将YouTubeAPI用于iOS应用？【英文标题】：HowtouseYouTubeAPIforaniOSapp?【发布时间】：2015-07-1105:09:41【问题描述】：我在网上搜索了教程和说明，但找不到任何关于此的...所以我希望这里有人可以指出我正确的方向，或者只是链... 查看详情
将 html 保存在 cookie 中
...div中。我的问题是刷新页面时这个html会被删除。问题是如何将附加的HTML保存在div中（html代码将包含一些输入和选择列表，并且会有大量代码）。我应该调查什么？饼干？HTML5?还有什么？【问题讨论】：为了提供最佳解决方案，... 查看详情
帮助将 JSON 用于 API
...】：2013-05-2319:15:13【问题描述】：我不太明白这个API应该如何工作，因为我以前从未使用过JSON。文档没有给出任何示例，但它说此API中的端点支持POST和GET操作，返回JSON。我的问题是，我不确定如何实现这一点，假设我只想将所... 查看详情
如何为暗模式和亮模式切换保存 cookie？
】如何为暗模式和亮模式切换保存cookie？【英文标题】：HowcanIsavecookiesfordarkmodeandlightmodetoggling?【发布时间】：2022-01-1008:28:29【问题描述】：我不太明白如何将暗/亮模式的选择保存为cookie。这是我正在尝试的网页：https://schooloffi... 查看详情
会话 cookie 与 JWT
...仅仅是一个运行API的小型微型Web服务器，主要是因为cookie用于验证用户请求和coo 查看详情
request.cookies和response.cookies
Request.Cookies创建的Cookie只能用于后台不能用于HTML的前台Response.Cookies操作过的Cookie，所有方法获取到的都是被更新过的值，也就是说Response.Cookies是修改所有容器中的Cookie的值；总结：Request.Cookies：主要是用于获取所有Cookie值的，... 查看详情
如何使用来自 IHttpClientFactory 的 HttpClient 将 cookie 添加到请求中
】如何使用来自IHttpClientFactory的HttpClient将cookie添加到请求中【英文标题】：HowtoaddacookietoarequestusingHttpClientfromIHttpClientFactory【发布时间】：2020-07-0114:04:15【问题描述】：背景我正在开发一个ASP.NETCoreWebAPI，我们在API中调用第3方API... 查看详情