为什么要用前后端分离
在现在的程序开发中，越来越多的出现了前后端分离的趋势。在前后端分离的情况下，后端只需要关注于业务逻辑以及后台代码实现，对外只需提供api接口以及相应的接口文档即可。而前端则是在关注于自己的页面展现以及根据后端提供的接口文档调用api接口进行，在页面铺相应的数据即可。
这样做的好处是很多的。
首先就是后端的程序开发人员没有必要再去关注于前端页面的铺数据，这样由于不用再去处理前台页面中的各种自己所不擅长的dom节点，各种js与css，这样就加快了后端开发人员的开发进度，极大地减轻了后端开发人员的开发负担。
其次，对于前端的开发人员而言，其开发进度由于摆脱了后台的限制，没有必要等到后台实现相应的功能后再开展前台页面的搭建，这样前后端的程序开发人员可以实现同时开发，这样也就加快了前端开发人员的开发进度。而前台开发人员再也不用去处理jsp页面中的各种内嵌的java脚本和EL表达式等自己动都不敢动的代码，这样对于前端而言反倒是轻松了不少。同时在后端代码没有实现功能的前提下，前端可以根据需求铺虚拟数据，等到后台实现相应的接口后，直接替换掉即可。
再次，在前后端分离的前提下，由于页面的展现与后端的逻辑松耦合，这使得项目的改动变得更加的灵活，后端框架的改动不至于使前端受到影响，同时前端框架的改动，而后端也不至于出现较大的改动。由于前后端的分离，使得前端开发人员与后端开发人员各自只用关注自己的那一块代码即可，这样就提升了分工，提高了代码编写质量与编写效率。
解决前后端分离中出现的跨域问题
在前后端分离的情况下，我们所遇到的最大问题便是随之而出现的跨域问题。由于根据浏览器的安全规范，默认情况下是不允许进行跨域的url数据信息的获取的。这样一来，由于前端开发人员和后端开发人员并不是在一个工作环境中开发的，因而不可避免的就造成了浏览器的跨域问题，而这一问题也是被广大的开发人员所垢病的。
当然对于这一问题，网上有很多解决方案，比如说采用CORS（Cross-Origin Resource Sharing）跨域资源共享，比如说采用jsonp等等的都是相应的解决方案。
虽然这些解决方案是可以解决一些相应的问题，但是这些方案大都是采用侵入式的，也就是说，采用在项目中修改相应的代码来实现，而这种方式明显就带来了一定的技术难度，同时也失去了相应的灵活度。而最好的解决方式就是采用url代理的方式，这也就是我下面所说的采用Nginx来进行代理的方式。
使用Nginx进行URL代理转发
我之前说过，根据浏览器的安全协议，默认的情况下，浏览器是不允许进行数据的跨域获取的，即便是在同一个ip地址，不同的端口号中亦是如此。而浏览器判断是否跨域是根据url的根路径地址来进行判断的，这样我们只需要对url地址进行相应的转发，将请求在本地的url地址转发到远程的tomcat中即可实现相应的跨域数据请求操作。
简单的Nginx指令
启动：start nginx
重载配置文件：nginx -s reload
停止：nginx -s stop
退出：nginx -s quit
重启：nginx -s reopen
Nginx的配置文件信息
server{
listen 80;
server_name localhost;
#access_log c:/access.log combined;
#index index.html index.htm index.jsp index.php;
location / {
root D:/WorkSpace/layuiAdmin.pro-v1.0.0-beta9;#文件根目录
index index.html index.htm;#默认起始页
#proxy_pass http://localhost:9080;
#这样就可以实现GET,POST,OPTIONS的跨域请求的支持
#add_header Access-Control-Allow-Origin *;
#add_header Access-Control-Allow-Headers X-Requested-With;
#add_header Access-Control-Allow-Methods GET,POST,OPTIONS;
}
location /api { #添加访问目录为/login的代理配置
#rewrite ^/login/(.*)$ /$1 break;
proxy_pass http://localhost:8080/;
}
} 上述配置文件的信息是这样的，默认的Nginx监听的端口号为80，其服务名为localhost，拦截路径为“/”，也就是说项目的根路径，其访问的本地前端项目的文件地址为D:/WorkSpace/layuiAdmin.pro-v1.0.0-beta9，默认的是加载路径下的index文件作为起始页。
而当路径中拦截到/api时，其请求的是远程的http://localhost:8080/此时我们假设本地的请求路径为：
http://localhost/api/login/verifyCode.img那么其经过Nginx转发后，真实的请求路径为：
http://localhost:8080/login/verifyCode.img通过这样，我们就能够顺利的实现url的数据跨域请求操作。