Ajax 保存但不将 CORS cookie 从 127.0.0.1 发送到服务

Question

所以我在向服务发送带有跨域请求的 cookie 时遇到了问题。我已经让它在我们的 CI 环境中工作，但不是在本地。基本上，我在api.service.com 有一个API，它是通过从webapp.service.com 的客户端运行的AJAX 调用来访问的。 API 通过set-cookie 为.service.com 设置一个cookie。然后对 API 的所有后续调用都应包含此 cookie。从webapp.service.com 运行时，这按预期工作。这将在产品中正常工作。 但是，出于显而易见的原因，我希望能够在本地开发 webapp，并从本地文件或 localhost 服务对 api.service.com 运行 API 调用。

我知道 Chrome 在为本地文件保存 cookie 方面有点不确定，但我已经解决了这个问题，这不是问题。事实上，cookie 是在保存。它只是没有在随后的 API 调用中发送该 cookie。这是我正在进行的工作流程（带有一些通用/审查的产品名称）：

一个 AJAX 调用 POSTS 到我们的 API：

$.ajax({
  method: "POST",
  crossDomain: true,
  xhrFields: {
    withCredentials: true,
  },
  url: 'https://api.service.com/login',
  data: data,
  contentType:"text/plain",
  dataType: "json",
  success: function(data){
    ...
  }
});

CORS 内容设置为允许凭据和此来源（允许的来源动态更新，不使用 *。所以我们取回此 cookie：cookie:service-token=7f7d251ebeec37f7c0815....; SameSite=lax;Max-Age=2629744; domain=.service.com; path=/;

它在 Chrome 中显示如下：

Request cookie

我知道这实际上可以保存 cookie。然而，也许不是我想要的。我进入 Chrome 的 cookie，它会正确更新，如下所示：

Chrome saved cookie

我看到的问题是它的“发送”值是“仅限同一站点连接”。我不知道如何最初为 Chrome 设置它以将其视为“任何类型的连接”。我认为这就是当我发送另一个 AJAX 调用时，请求中不包含该 cookie 的原因。

我看到其他类似的帖子通过在 AJAX 调用中添加 crossDomain 和/或 withCredentials 来解决。这并没有为我解决。这是对 API 的后续调用：

$.ajax({
  url: 'https://api.service.com/getTheThing',
  crossDomain: true,
  xhrFields: {
    withCredentials: true
  },
  success: function(data){...}
});

cookie 不包含在此请求中，因此失败。

Answer 1

事实证明，设置 SameSite=lax 与我想象的相反。删除它解决了这个问题。