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

Question

我们有以下设置:

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工作正常,但每当我尝试将数据发布到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

反应解决方案的发布请求如下:

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

Answer 1

问题是您的服务器未配置为以正确的响应状态响应OPTIONS请求，2xx success status。

GET 正在工作，因为它没有发出预检请求，因为它符合作为CORS 文档定义的简单请求的标准

另一方面， POST 请求符合Preflighted request的标准，这意味着应该首先发出 preflight OPTIONS 请求。

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

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

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

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

在您的BaseApiController.cs 中：

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

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

参考

预检请求

禁止预检 403 响应

笔记

在 domainA.com 上运行 nodejs 服务器无关紧要。的“Axios的”库既可以用于从浏览器或b）a）作出的XMLHttpRequest进行HTTP从node.js中请求 在这种情况下，它是第一个选项，domainB 的“axios.post”是通过来自浏览器的XMLHttpRequest完成的，这就是为什么您在 domainB.com 上收到预检请求的原因。