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});
解决方法
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 }; } }
参考
response for preflight 403 forbidden
注意
在domainA.com上运行nodejs服务器是无关紧要的. “axios”库可用于a)从浏览器生成XMLHttpRequests或b)从node.js发出http请求.在这种情况下,它是第一个选项,domainB的“axios.post”是通过浏览器的XMLHttpRequest完成的,这就是你在domainB.com上获得预检请求的原因.