如何将 CORS(跨域策略)添加到 NGINX 中的所有域?

Posted

技术标签:

【中文标题】如何将 CORS(跨域策略)添加到 NGINX 中的所有域?【英文标题】:How to add CORS (cross origin policy) to all domains in NGINX? 【发布时间】:2016-05-12 12:06:31 【问题描述】:

我创建了一个文件夹,用于提供静态文件(CSS、图像、字体和 JS 等),我最终会将文件夹 CNAME 到一个子域中,以便在 CDN 上使用我的 Magento 2 设置。

我想允许所有域通过 CORS - 跨域策略进行所有访问,并且我也想缓存数据。这就是我所拥有的。 (我不是在询问有关 JSONP 问题的安全建议或提示 - 我希望全局访问文件目录)

location /cdn-directory/ 

    location ~* \.(ico|jpg|jpeg|png|gif|svg|js|css|swf|eot|ttf|otf|woff|woff2|zip|gz|gzip|bz2|csv|xml)$ 
        add_header Cache-Control "public";
        add_header X-Frame-Options "ALLOW-FROM *";
        expires +1y;
    


根据documentation,它说X-Frame-Options 支持ALLOW-FROM uri,但看不到使用*(所有域)或在此ALLOW-FROM 中添加某些多个域的示例。我需要允许所有域访问我的静态文件夹。

【问题讨论】:

您的配置是正确的,它按照定义(我测试过)将标头添加到请求中,我不确定您在这里问什么:如何在 nginx 中全局定义响应标头? X-Frame-Options 的用法?请记住,Google Chrome 和 Safari 不支持 X-Frame-Options ALLOW FROM,因此可能没有太多示例 您是否尝试过使用Content-Security-Policy: frame-ancestors *?我相信 CSP 标头取代了 X-Frame-Options,因此可能是一个很好的补充。 我想知道我是否可以让多个域使用我的内容,因为似乎 ALLOW-FROM uri 仅限于一次调用 【参考方案1】:

我没有在 nginx 上尝试过,但是允许当前请求的来源在 tomcat 中有效:

add_header X-Frame-Options "ALLOW-FROM $http_origin";

【讨论】:

这个 sn-p,尤其是与 OP 的其余配置一起,只会导致 CACHE POISON。更不用说可能缺少 Origin 标头,即使存在,ALLOW-FROM 也不应该包含地址方案(例如,它永远不应该从 http:// 之类的东西开始)。 我不希望赏金给你。我怎样才能删除这个?【参考方案2】:
location /cdn-directory/ 

location ~* \.(js|css|swf|eot|ttf|otf|woff|woff2)$ 
    add_header 'Cache-Control' 'public';
    add_header 'X-Frame-Options' 'ALLOW-FROM *';
    add_header 'Access-Control-Allow-Origin' '*';
    add_header 'Access-Control-Allow-Credentials' 'true';
    add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS';
    add_header 'Access-Control-Allow-Headers' 'DNT,X-CustomHeader,Keep-Alive,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type';
    expires +1y;
   

http://enable-cors.org/server_nginx.html

【讨论】:

【参考方案3】:

允许所有域嵌入资源(例如,在iframe 等内)是默认设置,因此不需要额外的标头。

X-Frame-Options HTTP 响应标头的唯一目的是防止交互式资源被外部站点嵌入到iframe,因此如果您的意图是ALLOW-FROM *(这确实不应该是一个有效的指令,如上所述),那么您应该完全省略整个标头,并且任何人都可以按照您的意愿从任何域对您的静态资源进行完全和适当的访问。

【讨论】:

【参考方案4】:

假设您确实想要 CORS(跨源请求共享),而不仅仅是嵌入 iframe,配置将是:

location /cdn-directory/ 

    location ~* \.(js|css|swf|eot|ttf|otf|woff|woff2)$ 
        add_header Cache-Control "public";
        add_header Access-Control-Allow-Origin: *
        expires +1y;
    


【讨论】:

+repped 为您的建议感谢这看起来足够吸引人尝试。【参考方案5】:

这可能有点矫枉过正,但我​​在 Magento 1.8.x 安装中为 CORS 使用了以下标头:

add_header 'Access-Control-Allow-Origin' "*";
add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS, DELETE, PUT';
add_header 'Access-Control-Allow-Credentials' 'true';
add_header 'Access-Control-Allow-Headers' 'User-Agent,Keep-Alive,Content-Type';

【讨论】:

以上是关于如何将 CORS(跨域策略)添加到 NGINX 中的所有域?的主要内容,如果未能解决你的问题,请参考以下文章

Nginx使用“逻辑与”配置origin限制,修复CORS跨域漏洞

asp.net core 2.1 跨域策略。添加为 CORS 时,只有单个 url 有效

Nginx解决跨域配置(Cors),支持白名单

如何使用CORS解决跨域问题

跨域请求(CORS)要点

cors跨域问题