Node.js：POST - 请求方法：选项状态代码：403 禁止

我们有以下设置：

Front end code : REACT (Hosted using express js) (lets call this www.domainA.com)
Backend        : .NET WEB API (Hosted in IIS 7.5) (lets call this www.domainB.com)

FE 应用程序的域正在向 Web API 发出 GET 数据和 POST 数据的请求。

GET 工作完美，但是每当我尝试将数据 POST 到 Web API 时，它都会抛出以下错误：

Request URL: http://www.domainB.com/api/postdataoperation
Request Method: OPTIONS
Status Code: 403 Forbidden

我查看了许多 CORS 文章，并继续在 IIS 中设置 HTTPResponseHeaders，如下所示：

Access-Control-Allow-Methods : POST,GET,OPTIONS,PUT,DELETE
Access-Control-Allow-Origin  : http://www.domainA.com

React 解决方案的 post 请求如下：

axios.post(`http://www.domainB.com/api/postdataoperation`, {userId});

问题是您的服务器未配置为响应OPTIONS具有正确响应状态的请求，2xx 成功状态.

GET 正在工作，因为它没有发出预检请求，因为它满足成为简单的请求定义为CORS 文档

另一方面，POST 请求满足成为预检请求，这意味着应首先发出预检 OPTIONS 请求。

简而言之，您已正确设置 CORS 响应标头，但服务器未配置为使用OPTIONS 方法请求的 2xx 响应（通常为 200 状态）。

服务器必须以 2xx 成功状态（通常为 200 或 204）响应 OPTIONS 请求。

如果服务器不这样做，那么您配置它发送什么 Access-Control-* 标头就没有什么区别。配置服务器以正确方式处理 OPTIONS 请求（发送 200 或 204 成功消息）的答案取决于它运行的服务器软件

借用解决方案这个答案，在您的后端 .NET WEB API 上执行此操作：

In your BaseApiController.cs:

我们这样做是为了允许 OPTIONS http 动词

public class BaseApiController : ApiController
  {
    public HttpResponseMessage Options()
    {
      return new HttpResponseMessage { StatusCode = HttpStatusCode.OK };
    }
}

参考

预检请求

对预检 403 禁止的响应

Note

在domainA.com 上运行nodejs 服务器是无关紧要的。这"axios"库可用于 a) 从浏览器发出 XMLHttpRequests 或 b) 从 node.js 发出 http 请求。在这种情况下，这是第一个选项，到domainB的“axios.post”是通过a完成的来自浏览器的 XMLHttpRequest，这就是为什么你会得到一个domainB.com 上的预检请求.