这个 javascript 前端、NodeJS 后端方案可行吗？答案

【问题标题】：Is this javascript frontend, NodeJS backend scenario viable to work?这个 javascript 前端、NodeJS 后端方案可行吗？
【发布时间】：2022-02-11 13:08:35
【问题描述】：

我有一个 Domain-A，它是基于 netlify 构建的静态站点，用于提供购物车功能。

我有一个 Domain-B 服务器后端在 Node.JS 上运行支付，并通过 passport.js 处理身份验证服务。

作为 Netlify 上的静态站点，此 Domain-A 无法提供任何后端服务。用户查看该域的网页，选择产品，并最终按下购买按钮。此按钮调用在浏览器中运行的 JS 代码，将 AJAX /login 发送到 Domain-B。它成功登录。它使用 SameSite:none, Secure:true 向 Domain-A 返回一个 connect.sid cookie。我可以使用 Chrome 调试器查看 cookie。

从 Domain-B 成功登录返回后，Domain-A 现在向 Domain-B 发送 AJAX GET 请求卖家和付款信息。但是 GET 总是失败并返回 403“用户未登录”。

AJAX GET 包括

crossDomain: true,
headers: { 
    "Content-Type": "text/plain",
    "withCredentials": true
},

Content-Type 是为了使其成为 CORS Simple Get 并避免 Preflight 问题，withCredentials 以确保 cookie 包含在 GET 中。我尝试使用 POST，但它似乎总是触发 Preflight 处理，这会产生许多其他复杂性。

我的基本问题是，我应该能够做到这一点，登录并从 Domain-A 静态站点的浏览器代码执行 GET 到 Domain-B 上的 NodeJS 服务器吗？或者，我是否必须离开 Netlify 并将其放到 DigitalOcean 之类的东西上，其中 Domain-A 有一个后端，可以登录并获取或发布到 Domain-B？

是否有可以将结构复制到场景中的示例代码？

更新：2022-02-20 这是我的服务器端 cors() 代码：

var corsOptions = {
  "origin": 'https://www.chicagomegashop.com',
  "methods": "GET, PUT, POST, DELETE, HEAD, OPTIONS",
  "credentials": true,
  "allowedHeaders": ['Content-Type'],
  "optionsSuccessStatus": 204
};

app.use(cors(corsOptions));

关于我担心没有 cookie 被保存。这是作为响应标头到达的 cookie：

但是现在，在域中检查 cookie 时，它不存在：

是有什么问题还是我没有正确解释我看到的内容？

【问题讨论】：

标签： javascript node.js cross-domain

【解决方案1】：

尝试将withCredentials 移出headers

crossDomain: true,
headers: { 
    "Content-Type": "text/plain",
},
withCredentials: true

另外，在您的后端服务器上，您是否配置了 cors 以允许您的前端尝试执行的操作？

 cors({
    origin: 'netlifysite_uri',
    credentials: true,
    allowedHeaders: ['Content-Type'],
  })

【讨论】：

knicholas 感谢您的建议。我因为去看牙周病而变黑了，我的嘴里全都破了。我回来了，痛苦，但回来调试。移动 withCredentials 有效，但没有改变任何东西。在 CORS() 中添加 allowedHeaders 是一个很好的调用，是新的东西，但没有改变。这是一个观察结果——当我成功登录到 passport.js 时，Chrome DevTools 在响应标头中显示了一个 set-cookie，正如我所期望的那样。但是当我查看域的 cookie 时，没有 cookie。当然，我随后的 POST 会返回用户未定义。为什么没有存储 cookie？
注意在我的原始帖子底部添加了代码。