更新时间:2022-04-01 23:41:35
该OPTIONS
请求由浏览器自行发送,然后再尝试从您的代码尝试POST
请求.这称为CORS手术前检查.
That OPTIONS
request is sent automatically by your browser on its own, before it tries the POST
request from your code. It’s called a CORS preflight.
https://developer.mozilla.org/en -US/docs/Web/HTTP/CORS#Preflighted_requests 包含详细信息.
在您的特定情况下,要点是代码添加的Content-Type: application/json
请求标头是触发浏览器执行该预检OPTIONS
请求的原因.
The gist of it in your specific case is that the Content-Type: application/json
request header that your code is adding is what triggers the browser to do that preflight OPTIONS
request.
因此,该特定的预检请求的目的是让浏览器询问服务器您是否允许跨域的POST
请求具有Content-Type
标头,而该标头的值不是multipart/form-data
或text/plain
?"
So the purpose of that particular preflight request is for the browser to ask the server, "Do you allow cross-origin POST
requests that have a Content-Type
header whose value isn’t one of application/x-www-form-urlencoded
, multipart/form-data
, or text/plain
?"
And for the browser to consider the preflight successful, the server must send back a response with an Access-Control-Allow-Headers
response header that includes Content-Type
in its value.
因此,我看到您在http://localhost:8000/
的当前服务器代码中已经包含res.header('Access-Control-Allow-Headers', 'Content-Type')
,如果您要以这种方式手动对其进行编码,那么这是正确设置的值.但我认为无法正常运行的原因是,您还没有明确处理OPTIONS
请求的代码.
So I see that you’ve got res.header('Access-Control-Allow-Headers', 'Content-Type')
in your current server code on http://localhost:8000/
, and that’s the right value to set if you’re going to code it manually that way. But I think the reason that’s not working is because you don’t also have code that explicitly handles OPTIONS
requests.
要解决此问题,您可以尝试安装npm cors
软件包:
To fix that, you might try instead installing the npm cors
package:
npm install cors
…然后做这样的事情:
var express = require('express')
, cors = require('cors')
, app = express();
const corsOptions = {
origin: true,
credentials: true
}
app.options('*', cors(corsOptions)); // preflight OPTIONS; put before other routes
app.listen(80, function(){
console.log('CORS-enabled web server listening on port 80');
});
这将为您处理OPTIONS
请求,同时还发送回正确的标题和值.
That’ll handle the OPTIONS
request for you, while also sending back the right headers and values.