Nginx实战：跨域配置

目录

一、什么是跨域

二、什么是CORS

三、nginx配置跨域

---

一、什么是跨域

        跨域（Cross-Origin）是指浏览器从一个域名的网页去请求另一个域名的资源时，浏览器会对这个请求进行同源策略（Same-Origin Policy）的安全限制。

        这个安全策略是浏览器的一种安全机制，用于限制一个源（域名、协议、端口）的网页只能请求该源的资源，而不能请求其他源的资源。

二、什么是CORS

        CORS是一个W3C规范，它定义了一种浏览器和服务器交互的方式来确定是否允许跨源请求。CORS通过一种特殊的HTTP头信息（Access-Control-Allow-Origin）来实现这种交互。

三、nginx配置跨域

        Nginx本身并不直接支持CORS配置，但你可以通过添加自定义的HTTP头信息来实现。这通常通过在Nginx配置文件中添加add_header指令来完成。

location / {  
    # 其他配置...  
  
    if ($request_method = 'OPTIONS') {  
        add_header 'Access-Control-Allow-Origin' '*';  
        add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS';  
        add_header 'Access-Control-Allow-Headers' 'DNT,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Range';  
        add_header 'Access-Control-Max-Age' 1728000;  
        add_header 'Content-Type' 'text/plain; charset=utf-8';  
        add_header 'Content-Length' 0;  
        return 204;  
    }  
  
    if ($request_method = 'POST' || $request_method = 'GET' || $request_method = 'PUT' || $request_method = 'DELETE') {  
        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';  
    }  
  
    # 其他配置...  
}

• Access-Control-Allow-Origin：指定哪些源可以访问该资源。'*'表示允许任何源访问。但出于安全考虑，建议仅允许特定的源。
• Access-Control-Allow-Methods：指定允许哪些HTTP方法。
• Access-Control-Allow-Headers：指定允许哪些HTTP头信息。同样也可以配置'*'。
• Access-Control-Max-Age：指定预检请求的结果可以被缓存多久（以秒为单位）。这可以减少不必要的预检请求。