fetch 跨域该怎么写

Question

如题所述

Answer 1

[分为下面两种情况]

1. 如果服务器支持 CORS, 则在客户端设置相应的  `Access-Control-Allow-Origin`  å³å¯å¾—到数据。

let myHeaders = new Headers({
'Access-Control-Allow-Origin': '*',
'Content-Type': 'text/plain'
});
fetch(url, {
method: 'GET',
headers: myHeaders,
mode: 'cors'
}) .then((res) => {
// TODO
})

服务端是否支持可以问下后端同事，如果是自己承担后端编码，则可以直接自己设置，比如如果是 PHPer, header 一下响应头即可。

header("Access-Control-Allow-Origin: *");

2. 如果服务器不支持 CORS， 则不用使用 Fetch Api 了。

`Fetch Api`  å¿…须后台支持 `CORS`,。咱们可以试下，如果你设置了 `{mode: ' cors '}`(一般用于请求API)，就会报错告诉你你请求的服务器不支持 `CORS`。大概会报下面的错误：

Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.

如果设置成 `{mode: ' no-cors '}` (一般用于请求图片等静态资源), 虽然不会报错，但是结果会 返回被标记了为  `opaque`  çš„数据，表明你没有权限访问。

这种情况下可以使用 JSONP。