解决跨域问题：Nginx提示CORS ：No ‘Access-Control-Allow-Origin’ header 解决办法

清疚 2021-11-23 01:46 1958阅读 0赞

## 1、前端请求问题\_跨域问题 ##

![20190725150852661.png][]

## 2、解决方案 ##

被CORS策略阻止的只有字体，只需要nginx配置字体跨域就可以。就不用配置其它跨域了。毕竟：Access-Control-Allow-Origin \* 跨域是很危险的。

说明：nginx.conf配置Ok了，需要重启nginx。

### nginx中Access-Control-Allow-Origin字体跨域配置 ###

方法：

location ~* \.(eot|ttf|woff|woff2|svg)$ {
        add_header Access-Control-Allow-Origin *;
        add_header Access-Control-Allow-Headers X-Requested-With;
        add_header Access-Control-Allow-Methods GET,POST,OPTIONS;
    }

以上nginx.conf这样就可以实现GET,POST,OPTIONS的跨域请求的支持，也可以 add\_header Access-Control-Allow-Origin --指定允许的url;

### nginx中Access-Control-Allow-Origin 其它跨域配置 ###

示例：

#
    # 用于nginx的开放式CORS配置
    #
    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';
            #
            # 告诉客户这个飞行前信息有效期为20天
            #
            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') {
            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-Expose-Headers' 'Content-Length,Content-Range';
         }
         if ($request_method = 'GET') {
            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-Expose-Headers' 'Content-Length,Content-Range';
         }
    }

[20190725150852661.png]: /images/20211122/f7c39aa783ac424b88d8cd97f8ef6a01.png