Node.js:POST - 请求方法:OPTIONS 状态代码:403 Forbidden [英] Node.js : POST - Request Method: OPTIONS Status Code: 403 Forbidden

问题描述

我们有以下设置:

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 数据的请求.

The domain of the FE app is making the request to GET data and POST data to the web api.

GET 工作正常，但是每当我尝试将数据发布到 Web API 时，它都会抛出以下错误:

The GET is working perfectly, however whenever I am trying to POST data to the web API, its throwing the following error :

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

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

I have looked at many CORS articles and went ahead and setup HTTPResponseHeaders in IIS as follows :

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

react 解决方案的 post 请求如下:

The post request from react solution is as follows :

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

推荐答案

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

The issue is that your server is not configured to respond to OPTIONS requests with the correct response status, 2xx success status.

GET 正在工作，因为它没有发出预检请求，因为它符合成为 简单请求 由CORS 文档

The GET is working because it is not making a preflight request, as it meets the criteria to be a simple request as defined by the CORS documentation

另一方面，POST 请求满足以下条件:预检请求，意味着应首先提出预检选项请求.

On the other hand, the POST request meets the criteria to be a Preflighted request, meaning a preflight OPTIONS request should be made first.

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

In short, you have correctly setup the CORS response headers, but the server is not configured to respond with a 2xx response for OPTIONS method requests(commonly 200 status).

服务器必须以 2xx 成功状态(通常为 200 或 204)响应 OPTIONS 请求.

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

如果服务器不这样做，那么您配置它发送的 Access-Control-* 标头没有任何区别.配置服务器以正确方式处理 OPTIONS 请求的答案——发送 200 或 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 上执行此操作:

Borrowing the solution from this answer, do this on your backend, .NET WEB API:

在您的 BaseApiController.cs 中:

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

We do this to allow the OPTIONS http verb

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

参考文献

预检请求

预检 403 禁止响应

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

Running a nodejs server on domainA.com is irrelevent. The "axios" library can be used either to a) make XMLHttpRequests from the browser or b) make http requests from node.js. In this case it is the first option, the "axios.post" to domainB is done through a XMLHttpRequest from the browser, that `s why you get a preflighted request at domainB.com.

这篇关于Node.js:POST - 请求方法:OPTIONS 状态代码:403 Forbidden的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！