Nginx 跨域配置 支持多域名 (解决配置无效问题)【一个很大的坑，终于解决了...】

参考此篇文章 才真正得以解决：https://leanote.zzzmh.cn/blog/post/5d08554b16199b068300222d

 

关于nginx跨域配置网上的文章特别多,但是最终依然没有效果，最终发现一个问题，除了要参数上面文章的配置以外，一定要注意一个细节

 

Nginx map 使用详解： https://www.cnblogs.com/sheng-247/p/12916610.html

 

比如你从 www.aa.com 跨域访问 www.bb.com，必须确保两个条件【相互配置跨域才能成功】

1、就是 www.aa.com域名中必须配置允许跨域www.bb.com

2、就是 www.bb.com域名中也必须配置允许跨域www.aa.com跨域

 

nginx成功配置的案例【比如aa.com和bb.com域名的相互跨域成功配置】

第一种简单配置方式【推荐使用】

	# 定义map类型变量,添加所有相互之间可跨域的域名【访问和被访问之间的域名必须相互支持彼此跨域,才能实现跨域成功】
	map $http_origin $corsHost {
        default 0;
        "~https://aa.com" https://aa.com;
        "~https://bb.com" https://bb.com;
    }
    server {
        ...
		listen 80;
		server_name aa.com www.aa.com;
		index index.html index.htm;
        location / {
            # 允许 所有头部 所有$corsHost域 所有方法
            add_header 'Access-Control-Allow-Origin' $corsHost;
            add_header 'Access-Control-Allow-Headers' '*';
            add_header 'Access-Control-Allow-Methods' '*';
            # OPTIONS 直接返回204
            if ($request_method = 'OPTIONS') {
                return 204;
            }
        }
        ...
    }
	 server {
        ...
		listen 80;
		server_name bb.com www.bb.com;
		index index.html index.htm;
        location / {
            # 允许 所有头部 所有$corsHost域 所有方法
            add_header 'Access-Control-Allow-Origin' $corsHost;
            add_header 'Access-Control-Allow-Headers' '*';
            add_header 'Access-Control-Allow-Methods' '*';
            # OPTIONS 直接返回204
            if ($request_method = 'OPTIONS') {
                return 204;
            }
        }
        ...
    }

第二种繁琐配置方式【仅供参考】 

server {
        ...
		listen 80;
		server_name aa.com www.aa.com;
		index index.html index.htm;
        location / {
            	#使用正则表达式配置多个域名跨域信息【当前域名配置跨域域名且被跨域的域名也必须支持当前域名跨域,必须相互配置支持跨域,才能正常跨域成功！】
				# 此处是配置aa域名支持bb域名的跨域,如果要跨域成功,必须在bb域名下也配置aa域名,才能跨域成功！
				set $cors_origin "";
				if ($http_origin ~* "^http://bb.com$") {
						set $cors_origin $http_origin;
				}
				if ($http_origin ~* "^http://www.bb.com$") {
						set $cors_origin $http_origin;
				}
				# http或https跨域必须配置的三条记录！
				add_header Access-Control-Allow-Origin $cors_origin;
				add_header Access-Control-Allow-Methods 'GET, POST, OPTIONS';
				add_header Access-Control-Allow-Headers 'DNT,X-Mx-ReqToken,Keep-Alive,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Authorization';
				# OPTIONS 方法直接返回204
				if ( $request_method = 'OPTIONS' ) { 
						return 204;
				}
        }
        ...
    }
	
	 server {
        ...
		listen 80;
		server_name bb.com www.bb.com;
		index index.html index.htm;
        location / {
            	#使用正则表达式配置多个域名跨域信息【当前域名配置跨域域名且被跨域的域名也必须支持当前域名跨域,必须相互配置支持跨域,才能正常跨域成功！】
				# 此处是配置bb域名支持aa域名的跨域,如果要跨域成功,必须在aa域名下也配置bb域名,才能跨域成功！
				set $cors_origin "";
				if ($http_origin ~* "^http://aa.com$") {
						set $cors_origin $http_origin;
				}
				if ($http_origin ~* "^https://www.aa.com$") {
						set $cors_origin $http_origin;
				}
				# http或https跨域必须配置的三条记录！
				add_header Access-Control-Allow-Origin $cors_origin;
				add_header Access-Control-Allow-Methods 'GET, POST, OPTIONS';
				add_header Access-Control-Allow-Headers 'DNT,X-Mx-ReqToken,Keep-Alive,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Authorization';
				# OPTIONS 方法直接返回204
				if ( $request_method = 'OPTIONS' ) { 
						return 204;
				}
        }
        ...
    }