has been blocked by CORS policy
时间: 2023-09-07 08:16:41 浏览: 58
CORS (Cross-Origin Resource Sharing) 是一种用于跨域请求资源的机制,通常用于 AJAX 请求。浏览器在发送跨域请求时,会向服务器发送一个预检请求,如果服务器允许跨域请求,则会在响应头中加入 Access-Control-Allow-Origin 字段,指定哪些域名可以访问资源。
如果出现 "has been blocked by CORS policy" 的错误提示,说明浏览器在发送跨域请求时,被服务器拒绝了。这通常是由于服务器没有正确配置 CORS 导致的。
解决该问题的方法有以下几种:
1. 在服务器响应头中添加 Access-Control-Allow-Origin 字段,允许跨域请求。例如,可以将该字段设置为 "*",表示允许任意域名访问资源。注意:在生产环境中,不建议使用 "*",应该指定具体的域名。
2. 在服务器端设置代理,将跨域请求转发到本地,再由本地服务发起请求。例如,可以使用 webpack-dev-server 中的 proxy 配置。
3. 在客户端发送请求时,添加 withCredentials 字段,表示允许请求携带 Cookie 等凭证信息。例如:
```javascript
fetch('url/to/api', {
credentials: 'include'
})
.then(response => response.json())
.then(data => console.log(data))
.catch(error => console.error(error))
```
需要注意的是,如果使用第二种或第三种方法,请求并不是直接发往目标服务器,而是先经过一个中间服务器,因此可能会存在安全风险。