Access-Control-Allow-Origin 不允许来源 http: localhost:3002.

当在客户端 (如浏览器、移动应用程序) 中调用跨域的 API 时，可能会收到如下错误消息：

Access to XMLHttpRequest at 'http://example.com/api/' from origin 'http://localhost:3002' 
has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

这通常是由于CORS策略防止未经授权的跨域资源共享引起的。CORS 策略是web浏览器实现的安全限制。它使用HTTP头来控制哪些域可以访问资源。Access-Control-Allow-Origin 是CORS的一部分，用于指定哪些域有权访问资源。如果缺少该标头，浏览器将阻止页面使用该API。

如果遇到此错误，请参考以下建议来解决问题：

1. 了解 CORS

CORS是浏览器实现的策略，是一种安全措施，可以限制跨域脚本对某些资源的访问。当你在浏览器中请求来自不同源的数据时，就会启用CORS。默认情况下，JavaScript是不允许访问和发送跨域请求的。但是开发者可以通过设置HTTP响应头来允许跨域请求。

在后端服务器上配置HTTP响应标头，以控制跨域请求是一个常见的做法。

在HTTP响应头中，Access-Control-Allow-Origin是一个重要的标头，可以配置以下值：

1. • (所有域名都允许访问)
2. 具体的域名，比如http://example.com

2. 启用CORS

请查看API文档以确定提供程序是否提供了CORS支持。

如果API支持CORS，则可以将Access-Control-Allow-Origin标头设置为跨域请求来源的值。

以下是一个示例响应头文件：

HTTP/1.1 200 OK
Content-Type: application/json
Access-Control-Allow-Origin: http://localhost:3002

在上面的响应标头中，Access-Control-Allow-Origin设置了允许请求的来源域，即http://localhost:3002。

3. 通过中间件或服务器设置CORS

在web应用程序中，可以通过使用web服务器启用CORS。以下是一些流行的web服务器上的CORS设置代码：

Express中间件

var express = require('express')
var app = express()

app.use(function(req, res, next) {
  res.header("Access-Control-Allow-Origin", "http://localhost:3002");
  res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
  next();
});

Apache

Header set Access-Control-Allow-Origin "http://localhost:3002"

Nginx

add_header 'Access-Control-Allow-Origin' 'http://localhost:3002' always;

4. 浏览器扩展

在某些情况下，当在浏览器上访问没有启用CORS的API时，可以使用浏览器扩展以解决此问题。以下是一些流行的浏览器扩展：

• CORS Anywhere
• Allow CORS: Access-Control-Allow-Origin

结论

跨域访问API时，可能会遇到Access-Control-Allow-Origin错误。解决此问题的一种方法是在API服务器中启用CORS。可以通过更改API服务器的响应标头来启用CORS。设置响应标头应该是在API文档中记录的。如果API不支持CORS，可以考虑使用浏览器扩展或代理，以允许浏览器访问API。