点击上方“方志朋”，选择“置顶公众号”
技术文章第一时间送达！
一、前戏
前后端分离已成为互联网项目开发的业界标准使用方法，通过nginx+tomcat的方法（也可以中间加一个nodejs）有效的进行前馈，而且前后端分离会为之后的小型分布式构架、弹性估算构架、微服务构架、多端化服务（多种顾客端，比如：浏览器，车载终端，安卓，IOS等等）打下坚实的基础。
这个步骤是系统构架从猿进化成人的必经之路。
核心思想是后端html页面通过ajax调用前端的restufulapi插口并使用json数据进行交互。
在互联网构架中，名词解释：
Web服务器：通常指像nginx，apache这类的服务器，她们通常只能解析静态资源。
应用服务器：通常指像tomcat，jetty，resin这类的服务器可以解析动态资源也可以解析静态资源，但解析静态资源的能力没有web服务器好。
通常都是只有web服务器能够被内网访问，应用服务器只能外网访问。
二、术业有专攻（开发人员分离）
原先的JavaWeb项目大多数都是java程序员又当爹又当妈，又搞后端，又搞前端。
随着时代的发展，逐渐的许多大中小公司开始把前后端的界限分的越来越明晰，后端工程师只管后端的事情，前端工程师只管前端的事情。
正所谓术业有专攻，一个人假如哪些就会，这么他虽然哪些都不精。
大小型公司须要专业人才，小公司须要通才，而且对于个人职业发展来说，我建议是分开。
1、对于前端java工程师：
把精力放到java基础，设计模式，jvm原理，spring+springmvc原理及源码，linux，mysql事务隔离与锁机制，mongodb，http/tcp，多线程，分布式构架，弹性估算构架，微服务构架，java性能优化，以及相关的项目管理等等。
前端追求的是：三高（高并发，高可用，高性能），安全，储存，业务等等。
2、对于后端工程师：
把精力放到html5，css3，jquery，angularjs，bootstrap，reactjs，vuejs，webpack，less/sass，gulp，nodejs，GoogleV8引擎，javascript多线程，模块化，面向切面编程，设计模式，浏览器兼容性，性能优化等等。
后端追求的是：页面表现，速率流畅，兼容性，用户体验等等。
术业有专攻，这样你的核心竞争力才能越来越高，正所谓你往生活中投入哪些，生活都会反馈给你哪些。
但是两端的发展都越来越艰深，你想哪些就会，那你虽然哪些都不精。
通过将team分成前后端team，让两侧的工程师愈发专注各自的领域，独立整治，之后建立出一个全栈式的精益求精的team。
三、原始人时代（各类耦合）
几曾何时，我们的JavaWeb项目都是使用了若干后台框架，springmvc/struts+spring+springjdbc/hibernate/mybatis等等。
大多数项目在java前端都是分了三层，控制层，业务层，持久层。控制层负责接收参数，调用相关业务层，封装数据，以及路由&渲染到jsp页面。
之后jsp页面上使用各类标签或则手写java表达式将后台的数据凸显下来，玩的是MVC那套思路。
我们先看这些情况：需求定完了，代码写完了，测试测完了，之后呢？
要发布了吧？
你须要用maven或则eclipse等工具把你的代码打成一个war包，之后把这个war包发布到你的生产环境下的web容器里，对吧？
发布完了以后，你要启动你的web容器，开始提供服务，这时侯你通过配置域名，dns等等相关，你的网站就可以访问了（假定你是个网站）。
那我们来看，你的前后端代码是不是全都在哪个war包里？包括你的js，css，图片，各类第三方的库，对吧？
好，下边在浏览器中输入你的网站域名（），然后发生了哪些？
（这个问题也是好多公司的笔试题）我捡干的说了啊，基础不好的童鞋请自己去搜。
浏览器在通过域名通过dns服务器找到你的服务器内网ip,将http恳求发送到你的服务器，在tcp3次握手以后（http下边是tcp/ip），通过tcp合同开始传输数据，你的服务器得到恳求后，开始提供服务，接收参数，然后返回你的应答给浏览器，浏览器再通过content-type来解析你返回的内容，呈现给用户。
这么我们来看，我们先假定你的首页中有100张图片，此时，用户的看似一次http恳求，虽然并不是一次，用户在第一次访问的时侯，浏览器中不会有缓存，你的100张图片，浏览器要连着恳求100次http恳求（有人会跟我说http长连短连的问题，不在这儿讨论），你的服务器接收那些恳求，都须要花费显存去创建socket来玩tcp传输（消耗你服务器上的估算资源）。
重点来了，这样的话，你的服务器的压力会特别大，由于页面中的所有恳求都是只恳求到你这台服务器上，假如1个人还好，假如10000个人并发访问呢（先不聊服务器集群，这儿就说是单实例服务器），那你的服务器能扛住多少个tcp联接？
你的带宽有多大？
你的服务器的显存有多大？
你的硬碟是高性能的吗？
你能抗住多少IO？
你给web服务器分的显存有多大？
会不会宕机？
这就是为何，越是大小型的web应用，她们越是要前馈。
理论上你可以把你的数据库+应用服务+消息队列+缓存+用户上传的文件+日志+等等都扔在一台服务器上，你也不用玩哪些服务整治，也不用做哪些性能监控，哪些报案机制等等，就乱成一团糟好了。
然而这样就好象是你把猪肉都置于一个篮子里，隐患特别大。
假如由于一个子应用的显存不稳定造成整个服务器显存溢出而hung住，那你的整个网站就死掉了。
倘若出意外死掉，而正好这时大家的业务又处于井喷式发展高峰期，这么恭喜你，业务成功被技术卡住，很可能会流失大量用户，后果不堪构想。
（注意：技术一定是要走在业务后面的，否则你将错过最佳的发展期哟，亲~）
据悉，你的应用全部都耦合在一起，相当于一个巨石，当服务端负载能力不足时，通常会使用负载均衡的方法，将服务器弄成集群，这样虽然你是在水平扩充一块块巨石，性能加速度会越来越低，要晓得，本身负载就低的功能or模块是没有必要水平扩充的，在本文中的反例就是你的性能瓶颈不在后端，那干嘛要水平扩充后端呢？？？还有发版布署上线的时侯，我明明只改了前端的代码，为何要后端也跟随发布呢？？？
正常的互联网构架，是都要拆开的，你的web服务器集群，你的应用服务器集群+文件服务器集群+数据库服务器集群+消息队列集群+缓存集群等等。
四、JSP的痛点
原先的javaWeb项目大多数使用jsp作为页面层展示数据给用户，由于流量不高，因而也没有这么严苛的性能要求，但如今是大数据时代，对于互联网项目的性能要求是越来越高，因而原始的前后端耦合在一起的构架模式早已渐渐不能满足我们，因而我们须要需找一种前馈的方法，来大幅度提高我们的负载能力。
1、动态资源和静态资源全部耦合在一起，服务器压力大，由于服务器会收到各类http恳求，比如css的http恳求，js的，图片的等等。一旦服务器出现状况，前后台一起玩完，用户体验极差。
2、UI出好设计图后，后端工程师只负责将设计图劈成html，须要由java工程师来将html套成jsp页面，出错率较高（由于页面中常常会出现大量的js代码），更改问题时须要双方协同开发，效率低下。
3、jsp必需要在支持java的web服务器里运行（比如tomcat，jetty，resin等），难以使用nginx等（nginx听说单实例http并发高达5w，这个优势要用上），性能提不上来。
4、第一次恳求jsp，必需要在web服务器中编译成servlet，第一次运行会较慢。
5、每次恳求jsp都是访问servlet再用输出流输出的html页面，效率没有直接使用html高（是每次哟，亲~）。
6、jsp内有较多标签和表达式，后端工程师在更改页面时会捉襟见肘，遇见好多痛点。
7、如果jsp中的内容好多，页面响应会很慢，由于是同步加载。
8、需要后端工程师使用java的ide（比如eclipse），以及须要配置各类前端的开发环境，大家有考虑过后端工程师的体会吗。
基于上述的一些痛点，我们应当把整个项目的开发权重向前移，实现前后端真正的前馈！
五、开发模式
原先老的方法是：
1、产品总监/领导/顾客提出需求
2、UI作出设计图
3、前端工程师做html页面
4、后端工程师将html页面套成jsp页面（前后端强依赖，前端必需要等后端的html做好就能套jsp。假如html发生变更，就更痛了，开发效率低）
5、集成出现问题
6、前端返工
7、后端返工
8、二次集成
9、集成成功
10、交付
新的方法是：
1、产品经历/领导/顾客提出需求
2、UI作出设计图
3、前后端约定插口&数据&参数
4、前后端并行开发（无强依赖，可前后端并行开发，假如需求变更，只要插口&参数不变，就不用两侧都更改代码，开发效率高）
5、前后端集成
6、前端页面调整
7、集成成功
8、交付
六、请求方法
原先老的方法是：
1、客户端恳求
2、服务端的servlet或controller接收恳求（前端控制路由与渲染页面，整个项目开发的权重大部份在前端）
3、调用service,dao代码完成业务逻辑
4、返回jsp
5、jsp诠释一些动态的代码
新的方法是：
1、浏览器发送恳求
2、直接抵达html页面（后端控制路由与渲染页面，整个项目开发的权重前移）
3、html页面负责调用服务端插口形成数据（通过ajax等等，后台返回json格式数据，json数据格式由于简约高效而代替xml）
4、填充html，凸显动态疗效，在页面上进行解析并操作DOM。
总结一下新的形式的恳求步骤：
大量并发浏览器恳求-→web服务器集群(nginx)-→应用服务器集群(tomcat)-→文件/数据库/缓存/消息队列服务器集群
同时又可以玩分模块，还可以按业务拆成一个个的小集群，为前面的构架升级做打算。
七、前后分离的优势
1、可以实现真正的前后端前馈，后端服务器使用nginx。
后端/WEB服务器放的是css，js，图片等等一系列静态资源（甚至你还可以css，js，图片等资源放在特定的文件服务器，比如阿里云的oss，并使用cdn加速），后端服务器负责控制页面引用&跳转&路由，后端页面异步调用前端的插口，前端/应用服务器使用tomcat（把tomcat想像成一个数据提供者），推动整体响应速率。（这儿须要使用一些后端工程化的框架例如nodejs，react，router，react，redux，webpack）
2、发现bug，可以快速定位是谁的问题，不会出现相互踢皮球的现象。
页面逻辑，跳转错误，浏览器兼容性问题，脚本错误，页面款式等问题，全部由后端工程师来负责。
插口数据出错，数据没有递交成功，应答超时等问题，全部由前端工程师来解决。
双方互不干扰，后端与前端是相亲相爱的一家人。
3、在大并发情况下，我可以同时水平扩充前后端服务器，例如天猫的一个首页就须要2000+台前端服务器做集群来抗住日均多少亿+的日均pv。
（去出席阿里的技术大会，听她们说她们的web容器都是自己写的，即使他单实例抗10万http并发，2000台是2亿http并发，但是她们还可以依照预知洪峰来无限拓展，很惊悚，就一个首页。。。）
4、减少前端服务器的并发/负载压力。
不仅插口以外的其他所有http恳求全部转移到后端nginx上，插口的恳求调用tomcat，参考nginx反向代理tomcat。
且不仅第一次页面恳求外，浏览器会大量调用本地缓存。
5、即使前端服务暂时超时或则宕机了，后端页面也会正常访问，只不过数据刷不下来而已。
6、也许你也须要有陌陌相关的轻应用，那样你的插口完全可以共用，假如也有app相关的服务，这么只要通过一些代码构建，也可以大量复用插口，提高效率。（多端应用）
7、页面显示的东西再多也不怕，由于是异步加载。
8、nginx支持页面热布署，不用重启服务器，后端升级更无缝。
9、增加代码的维护性&易读性（前后端耦在一起的代码读上去相当费力）。
10、提升开发效率，由于可以前前端并行开发，而不是像先前的强依赖。
11、在nginx中布署证书，内网使用https访问，但是只开放443和80端口，其他端口一律关掉（避免黑客端口扫描），外网使用http，性能和安全都有保障。
12、前端大量的组件代码得以复用，组件化，提高开发效率，抽下来！
八、注意事项
1、在开需求大会的时侯，前后端工程师必须全部出席，但是须要拟定好插口文档，前端工程师要写好测试用例（2个维度），不要让后端工程师充当你的专职测试，推荐使用chrome的插件postman或soapui或jmeter，service层的测试用例拿junit写。ps：后端也可以玩单元测试吗？
2、上述的插口并不是java里的interface，说白了调用插口就是调用你controler里的方式。
3、加重了后端团队的工作量，减少了前端团队的工作量，提升了性能和可扩充性。
4、我们须要一些后端的框架来解决类似于页面嵌套，分页，页面跳转控制等功能。（前面提及的这些后端框架）。
5、如果你的项目很小，或则是一个单纯的外网项目，那你大可放心，不用任何构架而言，而且假如你的项目是内网项目，呵呵哒。
6、以前还有人在使用类似于velocity/freemarker等模板框架来世成静态页面，仁者见仁智者见智。
7、这篇文章主要的目的是说jsp在小型内网javaweb项目中被淘汰掉，可没说jsp可以完全不学，对于一些中学生同学来说，jsp/servlet等相关的javaweb基础还是要把握牢的，不然你以为springmvc这些框架是基于哪些来写的？
8、如果页面上有一些权限等等相关的校准，这么那些相关的数据也可以通过ajax从插口里拿。
9、对于既可以后端做也可以前端做的逻辑，我建议是放在后端，为何？
由于你的逻辑须要估算资源进行估算，假如放在前端去run逻辑，则会消耗带宽&显存&cpu等等估算资源，你要记住一点就是服务端的估算资源是有限的，而假如放在后端，使用的是顾客端的估算资源，这样你的服务端负载都会增长（高并发场景）。类似于数据校准这些，前后端都须要做！
10、前端须要有机制应对前端恳求超时以及前端服务宕机的情况，友好的展示给用户。
