Javascript 无法在标头中没有没有 cors 的情况下获取 POST
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/37668282/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Unable to fetch POST without no-cors in header
提问by htochko
On making request like that:
在提出这样的要求时：
return fetch(
'http://localhost:8000/login',
{ method: 'POST',
headers: new Headers(
{"Content-Type": "application/json",
"Accept":"application/json"}
),
body: JSON.stringify(
{'name': 'Tom', 'password': 'Soyer'}
)
}
).then( response => { console.log(response);})
.catch(err => console.log(err))
request running with method OPTIONS instead POST. Only on adding mode: 'no-cors' request become POST:
请求使用方法 OPTIONS 而不是 POST 运行。仅在添加模式下：'no-cors' 请求变为 POST：
return fetch(
'http://localhost:8000/login',
{ method: 'POST',
mode: 'no-cors',
headers: new Headers(
{"Content-Type": "application/json",
"Accept":"application/json"}
),
body: JSON.stringify(
{'name': 'Tom', 'password': 'Soyer'}
)
}
).then( response => { console.log(response);})
.catch(err => console.log(err))
but response not ok than (even if network response status is 200): {type: "opaque", url: "", status: 0, ok: false, statusText: ""…} I suppose it because
但响应不如（即使网络响应状态为 200）：{type: "opaque", url: "", status: 0, ok: false, statusText: ""...} 我想是因为
The only allowed values for the Content-Type header are: application/x-www-form-urlencoded multipart/form-data text/plain
Content-Type 标头的唯一允许值是：application/x-www-form-urlencoded multipart/form-data text/plain
described here https://developer.mozilla.org/en-US/docs/Web/HTTP/Access_control_CORS
此处描述https://developer.mozilla.org/en-US/docs/Web/HTTP/Access_control_CORS
Is any way bring to live POST json data with fetch?
有什么方法可以通过 fetch 实时发布 JSON 数据？
回答by Asad Saeeduddin
The custom Content-Typeheader you're sending causes your request to be preflighted, which means an OPTIONS request, containing some metadata about the POST request that is about to be dispatched, will be sent beforethe actual POST request.
Content-Type您发送的自定义标头会导致您的请求被预检，这意味着 OPTIONS 请求将在实际 POST 请求之前发送，其中包含有关即将发送的 POST 请求的一些元数据。
Your server needs to be prepared to deal with this OPTIONS request. You haven't specified what the server is written in, but with express for example, you can register a middleware that intercepts all 'OPTIONS' requests, sets the Access-Control-Allow-Origin: *and Access-Control-Allow-Headers: Content-Typeheaders, and responds with 200.
你的服务器需要准备好处理这个 OPTIONS 请求。您还没有指定服务器是用什么编写的，但是以 express 为例，您可以注册一个中间件来拦截所有 'OPTIONS' 请求，设置Access-Control-Allow-Origin: *和Access-Control-Allow-Headers: Content-Type标头，并以 200 响应。
If it is possible for you to make the request using a 'Content-Type': 'text/plain' header, that would solve your problem. Alternatively you could use something that bypasses XHR entirely, like JSONP.
如果您可以使用 'Content-Type': 'text/plain' 标头发出请求，那将解决您的问题。或者，您可以使用完全绕过 XHR 的东西，例如 JSONP。
回答by sdc
When using non-cors, all headers must be valid simple-headers. The only valid values for the content-typeheader that qualifies as a simple-headeris:
使用时non-cors，所有标头必须是有效的simple-headers。content-type符合简单标头的标头的唯一有效值是：
headers: [
['Content-Type', 'application/x-www-form-urlencoded'],
['Content-Type', 'multipart/form-data'],
['Content-Type', 'text/plain'],
]
Exceptions with contingencies:
意外情况的例外：
headers: [
['Content-Type', 'application/csp-report'],
['Content-Type', 'application/expect-ct-report+json'],
['Content-Type', 'application/xss-auditor-report'],
['Content-Type', 'application/ocsp-request'],
]
