RockyLinux跨域资源共享配置详解（手把手教你设置CORS解决前端跨域问题）

什么是CORS？

CORS（Cross-Origin Resource Sharing，跨域资源共享）是一种机制，允许网页向不同源（协议、域名、端口任一不同即视为不同源）的服务器发起请求。通过在HTTP响应头中添加特定字段，服务器告诉浏览器：“我信任来自这些源的请求”，从而绕过同源策略限制。

方法一：在Nginx中配置CORS（适用于RockyLinux）

如果你使用的是Nginx作为Web服务器，请按照以下步骤操作：

1. 打开你的站点配置文件，通常位于 /etc/nginx/conf.d/ 或 /etc/nginx/sites-available/ 目录下。
2. 在 server 块中添加以下CORS相关头部。
3. 保存并重载Nginx配置。

以下是完整的Nginx CORS配置示例：

server {    listen 80;    server_name your-domain.com;    location /api/ {        # 允许所有来源（生产环境建议指定具体域名）        add_header 'Access-Control-Allow-Origin' '*';        add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS, PUT, DELETE';        add_header 'Access-Control-Allow-Headers' 'DNT,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Range';        add_header 'Access-Control-Expose-Headers' 'Content-Length,Content-Range';        # 处理预检请求（OPTIONS）        if ($request_method = 'OPTIONS') {            add_header 'Access-Control-Max-Age' 1728000;            add_header 'Content-Type' 'text/plain; charset=utf-8';            add_header 'Content-Length' 0;            return 204;        }        # 正常代理或处理请求        proxy_pass http://localhost:3000;    }}

配置完成后，执行以下命令重载Nginx：

sudo nginx -t && sudo systemctl reload nginx

方法二：在Apache中配置CORS（适用于RockyLinux）

如果你使用的是Apache，请确保已启用 mod_headers 模块，然后在虚拟主机配置或 .htaccess 文件中添加CORS头。

首先，启用headers模块（通常默认已启用）：

sudo a2enmod headerssudo systemctl restart httpd

然后，在你的网站根目录下的 .htaccess 文件中添加以下内容：

# 启用CORSHeader always set Access-Control-Allow-Origin "*"Header always set Access-Control-Allow-Methods "POST, GET, PUT, DELETE, OPTIONS"Header always set Access-Control-Allow-Headers "DNT,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Range"Header always set Access-Control-Expose-Headers "Content-Length,Content-Range"# 处理预检请求RewriteEngine OnRewriteCond %{REQUEST_METHOD} OPTIONSRewriteRule ^(.*)$ $1 [R=204,L]

注意：在生产环境中，不建议将 Access-Control-Allow-Origin 设置为 *，而应指定具体的可信域名，例如 https://your-frontend.com，以提高安全性。

验证CORS是否生效

你可以使用浏览器开发者工具（Network标签页）查看响应头中是否包含 Access-Control-Allow-Origin 字段。也可以使用curl命令测试：

curl -H "Origin: https://example.com" \     -H "Access-Control-Request-Method: POST" \     -H "Access-Control-Request-Headers: Content-Type" \     -X OPTIONS --verbose http://your-rockylinux-server/api/test

如果返回头中包含你配置的CORS字段，说明配置成功！

总结

通过本文，你已经学会了如何在RockyLinux系统上为Nginx和Apache配置跨域资源共享（CORS）。无论是开发测试还是生产部署，正确设置CORS都能有效解决前端跨域请求被拦截的问题。记住，安全第一，尽量避免使用通配符*，而是明确指定可信源。

希望这篇教程对你有帮助！如果你正在搭建基于RockyLinux的Web服务，掌握Rocky Linux Nginx CORS或Apache跨域设置是必不可少的技能。