使用域名调用Django+NGINX部署的API遇CORS错误，如何解决？

一、Django配置调整 #

1. 安装并配置django-cors-headers包 #

这是DRF官方推荐的CORS处理工具，配置便捷且可靠：

• 安装依赖包：

  pip install django-cors-headers
  

• 修改项目根目录下的settings.py：
  • 将corsheaders添加到INSTALLED_APPS列表：

    INSTALLED_APPS = [
        # 保留原有其他应用
        'corsheaders',
    ]
    

  • 将CORS中间件添加到MIDDLEWARE列表（必须放在CommonMiddleware之前）：

    MIDDLEWARE = [
        'corsheaders.middleware.CorsMiddleware',
        'django.middleware.common.CommonMiddleware',
        # 保留原有其他中间件
    ]
    

  • 配置允许跨域的前端域名（即你的React网站地址http://example.net）：

    # 仅允许指定域名跨域（生产环境推荐）
    CORS_ALLOWED_ORIGINS = [
        "http://example.net",
        # 若前端有HTTPS版本，补充添加"https://example.net"
    ]
    
    # 若为开发环境，可临时允许所有域名（生产环境禁用）
    # CORS_ALLOW_ALL_ORIGINS = True
    

  • 可选配置：若API需要携带身份验证Cookie，开启以下选项：

    CORS_ALLOW_CREDENTIALS = True
    

2. 检查ALLOWED_HOSTS配置 #

确保你的API域名www.example.com在ALLOWED_HOSTS列表中，否则Django会直接拒绝该域名的请求：

ALLOWED_HOSTS = [
    "XXX.XXX.XXX.XXX",  # 你的服务器IP地址
    "www.example.com",
    "example.com",  # 若使用裸域名访问，补充添加
]

二、NGINX配置调整 #

若完成Django配置后仍存在CORS问题，检查NGINX是否正确转发请求且未移除CORS响应头：
打开你的NGINX站点配置文件（通常位于/etc/nginx/sites-available/或/etc/nginx/conf.d/目录下），在server块中添加以下配置：

server {
    listen 80;
    server_name www.example.com example.com;

    # 保留原有其他配置（如静态文件转发、uWSGI/Gunicorn代理等）

    # 处理CORS预检OPTIONS请求
    if ($request_method = OPTIONS) {
        add_header Access-Control-Allow-Origin "http://example.net";
        add_header Access-Control-Allow-Methods "GET, POST, PUT, DELETE, OPTIONS";
        add_header Access-Control-Allow-Headers "Content-Type, Authorization";
        add_header Access-Control-Allow-Credentials "true";
        return 204;
    }

    # 为常规请求添加CORS响应头（若Django未自动生成）
    add_header Access-Control-Allow-Origin "http://example.net" always;
    add_header Access-Control-Allow-Credentials "true" always;
}

修改完成后重启NGINX使配置生效：

sudo systemctl restart nginx

验证方式 #

通过浏览器开发者工具的Network面板查看请求：

• 检查OPTIONS预检请求的响应头是否包含Access-Control-Allow-Origin: http://example.net
• 检查实际API请求的响应头是否同样包含该字段

内容的提问来源于stack exchange，提问作者Bol