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

解决方法

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

GET正在运行,因为它没有发出预检请求,因为它符合CORS documentation定义的simple request标准

另一方面,POST请求满足标准为Preflighted request,这意味着应首先进行预检OPTIONS请求.

简而言之,您已正确设置CORS响应标头,但服务器未配置为响应OPTIONS方法请求的2xx响应(通常为200状态).

The server must respond to OPTIONS requests with a 2xx success status—typically 200 or 204.

If the server doesn’t do that,it makes no difference what Access-Control-* headers you have it configured to send. And the answer to configuring the server to handle OPTIONS requests in the right way—to send a 200 or 204 success message—depends on what server software it’s running

借用this answer中的解决方案,在您的后端.NET WEB API上执行此操作：

在您的BaseApiController.cs中：

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

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

参考

Preflighted requests

response for preflight 403 forbidden

注意

在domainA.com上运行nodejs服务器是无关紧要的. “axios”库可用于a)从浏览器生成XMLHttpRequests或b)从node.js发出http请求.在这种情况下,它是第一个选项,domainB的“axios.post”是通过浏览器的XMLHttpRequest完成的,这就是你在domainB.com上获得预检请求的原因.