CORS 策略已阻止对 XMLHttpRequest 的访问：请求的资源上不存在“Access-Control-Allow-Origin”标头

当使用 XMLHttpRequest 对跨域资源进行请求时，浏览器会实施 CORS（跨源资源共享）策略，以确保安全性。

如果请求的资源没有在响应中包含 Access-Control-Allow-Origin 标头，那么浏览器就会阻止请求。

什么是跨域资源共享？

CORS 是一种通过头部信息控制浏览器和服务器如何交互的机制，以确保安全性。CORS 允许跨域访问，但是在保留浏览器安全的前提下限制跨域访问。

Access-Control-Allow-Origin 标头

服务端可以在响应头中添加 Access-Control-Allow-Origin 标头，以允许跨域资源共享。

该标头接受一个值，代表允许的跨域访问源。例如，如果服务器希望允许所有来自 example.com 的访问，可以这样设置：

Access-Control-Allow-Origin: https://example.com

也可以设为 * 表示允许所有来源。

如何解决 CORS 问题？

1. 在服务端添加 Access-Control-Allow-Origin 标头。

2. 如果不想改动服务端，可以使用代理进行请求。

3. 如果使用的是第三方 API，一些 API 提供商提供了解决 CORS 问题的接口。

参考资料

• CORS 介绍 - MDN

• 解决“Access-Control-Allow-Origin”跨域问题