nginx has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

CORS（跨域资源共享）是一种浏览器安机制，用于限制跨域请求。当浏览器发起跨域请求时，如果服务器没有正确配置CORS响应头，浏览器会拒绝该请求并报错"Access-Control-Allow-Origin"。这个错误通常在前端开发中遇到，特别是在使用Nginx作为反向代理服务器时。

要解决这个问题，你可以在Nginx配置文件中添加CORS响应头。具体步骤如下：

1. 打开Nginx配置文件（通常是`nginx.conf`或`sites-available/default`）。
2. 在`server`块中添加以下代码，允许所有来源的请求：

location / {
    add_header 'Access-Control-Allow-Origin' '*';
}

3. 保存并重新加载Nginx配置文件。

这样配置后，Nginx会在响应中添加`Access-Control-Allow-Origin`头，允许所有来源的请求访问资源，从而解决了CORS错误。

相关问题

nginx 全局 has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

这是一个常见的跨域资源共享 (Cross-Origin Resource Sharing, CORS) 错误，当你从一个域名尝试访问另一个域名的资源时，如果服务器没有设置 `Access-Control-Allow-Origin` 的响应头允许你的源域名，就会收到 "has been blocked by CORS policy" 这样的错误。Nginx 是一个强大的 Web 服务器和反向代理服务器，它默认不会处理 CORS 请求。

要解决这个问题，你需要在 Nginx 配置文件中添加适当的 CORS 中间件或者配置块，通常会在处理 HTTP 响应头的地方。例如，你可以创建一个自定义的 location 规则来设置 `Access-Control-Allow-Origin`，像这样：

location /api {
    add_header 'Access-Control-Allow-Origin' '*';
    add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS';
    add_header 'Access-Control-Allow-Headers' 'Content-Type, Authorization';
    if ($request_method = 'OPTIONS') {
        add_header 'Access-Control-Max-Age' 1728000; # 设置预检请求有效期
        add_header 'Content-Length' 0;
        return 204;
    }
}

这个配置允许任何来源 ( '*' ) 访问 `/api` 路径，并支持 GET、POST 和 OPTION 方法。当接收到预检请求 (OPTIONS) 时，会发送一个空响应 (`Content-Length: 0`) 并返回 204 状态码。

has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

这个错误提示表明浏览器在尝试从一个域名访问另一个域名的资源时，服务器没有返回 Access-Control-Allow-Origin 头，导致浏览器拒绝访问该资源。

要解决这个问题，你需要在你的服务器上设置 CORS 策略，以允许跨域访问。以下是一些可能的解决方案：

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

你可以在服务器端配置中添加 Access-Control-Allow-Origin 头，以允许指定的来源跨域访问。例如，在 Node.js 中，你可以使用以下代码：

res.setHeader('Access-Control-Allow-Origin', 'http://localhost:3000');

这将允许来自 http://localhost:3000 的跨域请求。

2. 使用 CORS 中间件

如果你使用的是 Express 或其他 Web 框架，你可以使用相应的 CORS 中间件来处理跨域请求。例如，在 Express 中，你可以使用 cors 中间件，如下所示：

const cors = require('cors');
app.use(cors());

这样会自动添加正确的 Access-Control-Allow-Origin 头。

3. 配置反向代理

如果你无法修改服务器端的代码，你可以尝试使用反向代理来解决跨域问题。例如，在 Apache 或 Nginx 中，你可以配置反向代理将跨域请求转发到正确的服务器端点，以避免浏览器跨域限制。

总的来说，要解决这个错误，你需要在服务器端设置正确的 CORS 策略，以允许跨域访问。