NGINX服务器的搭建与通过配置解决同源跨域问题

前言

本团队在主打产品CRM中通过前端AngularJS调用后台NodeJS接口用了Ajax技术，但是这样问题就出现了，由于NodeJs启动服务与AngularJs用Ajax调用接口同样来自于同一台IP的服务器但是端口不一样，所以产生了同源跨域问题。为此我记录一下内容为了解决同源跨域问题。

什么是同源跨域问题呢？

首先浏览器安全的基石是”同源政策”（same-origin policy）。最初，它的含义是指，A网页设置的 Cookie，B网页不能打开，除非这两个网页”同源”。所谓”同源”指的是”三个相同”。仅有同协议，同端口和同IP才可以被称为同源。

同源政策的目的，是为了保证用户信息的安全，防止恶意的网站窃取数据。设想这样一种情况：A网站是一家银行，用户登录以后，又去浏览其他网站。如果其他网站可以读取A网站的 Cookie，会发生什么？很显然，如果 Cookie 包含隐私（比如存款总额），这些信息就会泄漏。更可怕的是，Cookie 往往用来保存用户的登录状态，如果用户没有退出登录，其他网站就可以冒充用户，为所欲为。因为浏览器同时还规定，提交表单不受同源政策的限制。由此可见，”同源政策”是必需的，否则 Cookie 可以共享，互联网就毫无安全可言了。

之后，随着互联网的发展，”同源政策”越来越严格。目前，如果非同源，共有三种行为受到限制。

Cookie、LocalStorage和IndexDB无法读取
DOM无法获取
AJAX请求不能发送（本项目所拥有的问题）

虽然这些限制是必要的，但是有时很不方便，合理的用途也受到影响。下面，我将详细介绍，如何规避上面三种限制。

其中AJAX请求不能发送是本项目拥有的问题，虽然有些浏览器，例如Chrome可以输入以下命令进入安全模式可以暂时忽略跨域问题，但是这治标不治本。

Mac使用方法

1	$ open -a /Applications/Google\ Chrome.app --args --disable-web-security --user-data-dir

通过配置Nginx来解决同源跨域问题

我使用的环境是64位 Ubuntu 14.04。nginx依赖以下模块：

gzip模块需要 zlib 库
rewrite模块需要 pcre 库
ssl 功能需要openssl库

以下省略三个库的安装过程，直接进入配置详情讲解。

例如：

NodeJS为 http://192.168.10.107:3000 为例

AngularJs调用端口为8000端口

location / 
{     
	root   qiantai;   #项目名 必须在根目录路径下 项目文件夹
	index  index.html index.htm;  #项目主页  必须在项目目录路径下
}
location ^~ /u-routeasasoe/ {
	proxy_pass  http://192.168.10.107:3000;   #转发地址及相应端口号
	proxy_redirect    off;  
	proxy_set_header  Host $host;
	proxy_set_header  X-Real-IP  $remote_addr;  
	proxy_set_header  X-Forwarded-For $proxy_add_x_forwarded_for;
}

则需要将所有为/u-routeasaseo开头的接口统统转化成 http://192.168.10.107:3000发出的变为同IP,同端口，同协议保证同源已解决问题。