Node.js 当通过fetch请求访问服务器时，express JS cors中间件不工作

服务器已打开，客户端相同，但端口为3000

在客户端上，我运行simple fetch，我需要从服务器获取登录的用户数据，目前我只使用get方法（get、POST、none-work）这样做（我还必须包括cookie）：

和服务器：

const cors = require("cors");
var corsOptions = {
  origin: "http://localhost:3000",
  optionsSuccessStatus: 200
};
app.get("/user", cors(corsOptions), function(req, res, next) {
  u_session = req.session;
  const db_result = db
    .collection("users")
    .findOne({ email: u_session.email }, function(err, result) {
      if (err) throw err;

      res.json({ email: result.email, type: result.type });
    });
});

我得到的是cors错误：

Access to fetch at 'http://localhost:3001/user' from origin 'http://localhost:3000' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.

另外，若我通过浏览器转到服务器URL，我可以看到access allow control allow origin标头设置成功

同样根据要求，故障案例网络选项卡的屏幕截图：

我在互联网上搜索了很多解决方案，但似乎没有任何效果。我错过什么了吗

谢谢你的帮助

对飞行前请求的响应未通过访问控制检查：请求的资源上不存在“访问控制允许来源”标头

---

最吸引我的是“飞行前”。我认为可能是

选项

请求没有启用正确的CORS头。确保您正在启用API支持的

GET

、

POST

、

OPTIONS

和任何其他方法上的CORS。

由于您从客户端发送凭据，因此必须配置

CORS

模块以允许通过athe发送凭据。另外，

application/json

是一种非简单的

内容类型

，因此必须通过

allowedHeaders

明确允许：

var corsOptions = {
  origin: "http://localhost:3000",
  optionsSuccessStatus: 200,
  credentials: true,
  allowedHeaders: ["Content-Type"]
};

---

否则，服务器将不会在选项预飞行中包含

访问控制允许凭据

标题，浏览器将拒绝发送主GET请求。

确保如果您有代理集，则将其设置为

http://localhost:3001

。然后调整

fetch

以仅使用部分url，如下所示：

fetch("/user", {
      method: "GET",
      headers: {
        "Content-Type": "application/json"
      }
    }).then(response => {
      console.log(response);
    });

移除此项也应该是安全的：

const cors = require("cors");
var corsOptions = {
  origin: "http://localhost:3000",
  optionsSuccessStatus: 200
};

---

官方API文档中没有一个示例说明需要这样做，我也不确定如何做到这一点。最让我抓狂的是，人们使用与我完全相同的代码和相同的API，任何东西都可以为他们工作，而无需编写任何附加内容。

cors

自动处理选项预飞行，只要您提供正确的配置选项。在选项处理

cors

处理cors请求的过程中，应该没有必要（而且可能是一种不需要的模式）在选项处理的同时编写自己的选项端点，@Nick您还必须允许您的非简单

内容类型

。（已编辑）如果我将此项目文件上载到github，您有时间吗？（我知道这有点太过分了，因为我们都忙于工作，不想成为不必要的负担）但从另一个角度看，这就是字面上的代码，我不知道它是否会让人失望difference@Nick最有帮助的是，如果您可以为失败案例添加网络选项卡的屏幕截图，因此，我们可以在选项preflight.Edited上看到真实世界的请求和响应标题。我刚刚注意到，它显示“显示临时标题”警告。但仍然不知道是什么原因导致了这个错误，因为我在Edge中遇到了这个错误。我以前在使用CreateReact应用程序和fetch时遇到过这个错误（可能不是同一个问题，但可能是一个有用的类比）。解决方案是将代理设置为后端服务器url，并从fetch请求中删除localhost:。我不必用这种方式处理任何CORS选项。@MattPengelly哦，天哪，我在这上面浪费了多少时间，忘了在客户端的packaje.json中设置了代理。非常感谢你！

const cors = require("cors");
var corsOptions = {
  origin: "http://localhost:3000",
  optionsSuccessStatus: 200
};