基于Nginx解决跨域问题 （四）

什么是网站跨域问题

页面中请求的ajax地址如果与页面请求地址域名和端口、协议不同的话，浏览器采用安全策略，请求能够正常到达服务器端，但是无法获取响应结果。

相关跨域错误信息

网站跨域问题解决方案

1. 响应头设置允许跨域权限  response.setHeader("Access-Control-Allow-Origin", "*"); 适合于小公司
2. 使用jsonp解决网站跨域问题 缺点：只能支持Get请求 模拟脚本提交
3. 使用Nginx搭建API网关保持域名和端口一致 Location
4. 使用微服务中的Zuul网关
5. HttpClient实现转发 缺点：重复发送两次请求

使用Nginx搭建API网关保持域名和端口一致

 location /b {

            proxy_pass   http://192.168.18.190:8081/;

            index  index.html index.htm;

     }

      location /a {

            proxy_pass   http://192.168.18.190:8080/;

            index  index.html index.htm;

        }

 A项目访问 http://api.your.com/a/index.html

Nginx Location指令详解

1.通过指定模式来与客户端请求的URI相匹配，基本语法如下：location [=|~|~*|^~|@] pattern{……}

 ~    #区分大小写的正则匹配

 ~*   #不区分大小写的正则匹配

 ^~   #普通字符匹配，如果此选项匹配成功，忽略其他匹配选项，一般用来匹配目录

 =    #普通字符精确匹配

没有修饰符 表示：必须以指定模式开始，如：

location /order{

}

www.xxx.com/order

www.xxx.com/order/1

www.xxx.com/order/

www.xxx.com/orderList

 2.=表示：必须与指定的模式精确匹配

location =/order{

}

正确方案

www.xxx.com/order

www.xxx.com/order?id=1

错误方案

www.xxx.com/order/

www.xxx.com/orderList

3.~ 表示：指定的正则表达式要区分大小写

正确方案

www.xxx.com/order

www.xxx.com/order?id=1

错误方案

www.xxx.com/ORDER

www.xxx.com/ORder?tradeId=1

4.~* 表示：指定的正则表达式不区分大小写

正确方案

www.xxx.com/order

www.xxx.com/order/1

www.xxx.com/order?tradeId=1

错误方案

www.xxx.com/order/

root 、alias指令区别

root与alias主要区别在于nginx如何解释location后面的uri，这会使两者分别以不同的方式将请求映射到服务器文件上。

root的处理结果是：root路径＋location路径

alias的处理结果是：使用alias路径替换location路径

所以尽量以/结尾以免找不到文件。