Nginx反向代理实现跨域请求

如今，RestFul接口服务比较流行，应用通过一套Http的API，并用json或者xml作为交互的数据格式来提供服务。这么做有效地实现了web项目，前后端的分离。从而使得架构更加开放，这套API可以同时给多套前端项目提供服务，包括web端和APP端。

什么是跨域？

跨域问题的由来是浏览器的同源策略。
所谓同源是指，域名，协议，端口相同。浏览器执行javascript脚本时，会检查这个脚本属于那个页面，如果不是同源页面，就不会被执行。跨域情况如下：

由此可知，即使前后端部署在同一台服务器上，如果不是起在同一个应用服务器中，那么跨域问题还是存在，因为两个服务的端口不同。那么如何来解决这个问题呢？

常用的跨域解决方法

1.jsonp 需要目标服务器配合一个callback函数。
2.window.name+iframe 需要目标服务器响应window.name。
3.window.location.hash+iframe 同样需要目标服务器作处理。
4.html5的 postMessage+ifrme 这个也是需要目标服务器或者说是目标页面写一个postMessage，主要侧重于前端通讯。
5.CORS  需要服务器设置header ：Access-Control-Allow-Origin。
6.nginx反向代理 这个方法一般很少有人提及，但是他可以不用目标服务器配合，不过需要你搭建一个中转nginx服务器，用于转发请求。

Nginx反向代理实现跨域请求

个人觉得用nginx反向代理来实现跨域是最简单的方式。原理也简单，操作也简单，无需修改js代码也无需改动服务端代码。只需要启动一个nginx服务，并且配置该服务，使得页面所有的请求都被nginx监听。在服务上配置多个前缀，然后将匹配到的http/https请求转发到多个真实的服务器。这样，这个web系统上的所有url都是相同的域名、协议和端口（即这台nginx服务所在的域名、协议和端口）。因此，对于浏览器来说，这些url都是同源的，没有跨域限制。而实际上，这些url实际上由物理服务器提供服务。这些服务器内的javascript可以跨域调用所有这些服务器上的url。
如下是我当前开发的项目中开发环境所做的nginx配置：

说明：nginx监听80端口，所有到80端口的请求都通过nginx来转发，默认会进到root目录下的静态页面。但是当请求匹配到“/api”时，则该请求会被转发到http://192.168.0.112:8080/这个地址上，而匹配到“/sohu”时，则接口被转发到搜狐主页了。

总结

nginx作为一个高性能的web服务器，常用作反向代理服务器。nginx作为反向代理服务器，就是把http请求转发到另一个或者一些服务器上。从而轻松实现跨域访问。
此外，正因为nginx能够实现反向代理的特点，它也经常被用来实现服务之间的负载均衡。所以nginx是一个优秀，灵活的web服务器。