前后端开发的心得体会_前后端对接的思考及总结
说在前面的话
随着前端NodeJs技术的火爆,现在的前端已经非以前传统意义上的前端了,各种前端框架(Vue、React、Angular......)井喷式发展,配合NodeJs服务端渲染引擎,目前前端能完成的工作不仅仅局限于CSS，JS等方面，很多系统的业务逻辑都可以放在前端来完成，例如我司的管控
那可能有些人会说,前端这么火,NodeJs发展这么迅猛,后端是不是以后都没事情干了，其实不然,拿Java来说，经过这么多年发展,已经相当稳定,完善的生态圈也非最近今年发展起来的NodeJs可比，我们常常说闻道有先后，术业有专攻,用在这里最合适不过了，集群、分布式、高可用等等技术还是需要后端架构师来思考的事情
目前前端同后端的合作方式是前后端分离，通过Nginx+Tomcat的组合部署(还可加nodejs中间件)方式能有效的进行解耦，并且前后端分离为项目以后的架构扩展、微服务化、组件化都打下重要基础,所以这在以后是一个发展的必然趋势,我们需要去适应,做出改变！！！
早期的开发方式
早期的开发方式如下图：
这也是我前面工作1-3年的开发方式,我们没有前端帮我们写JS函数功能,所有的页面表单验证,数据渲染,数据接口编写都是我们后端全部实现,看上去更像是一个全栈工程师,从需求分析、搭建整个技术架构、数据库表设计、功能设计、编码开发，再到最终部署上线,我们无所不在,这可能也是目前很多小公司仍然在沿用的开发方式,很多后端同学担负起了项目的方方面面
以我目前的经验来看,这样的开发方式对我个人的成长是有益无害的,因为你只有在了解了前端的JS/CSS/HTML的情况下,然后再谈目前的前后端分离,会让你的工作事半功倍,在写后端接口前,你脑子里浮现的是整个功能的交互页面,最终呈现的是前后端合作开发好后的的终端结果,这大大缩减了前后端的沟通交流
前后端分离的探索
jsonp
可能由于我在前面三年积累了丰富的前端经验,在上家公司主要负责开发官网、微信、后台等相关系统的接口，前期我们的开发方式虽然也是前后端分离的方式,但大都使用jsonp跨域接口调用的方式来达到分离效果,后端所有的接口都是可跨域调用的jsonp形式,抛开需要登录的授权之外的接口，前端在开发的时候本地无需开启服务即可调用服务端接口，然后渲染数据，完成页面交互渲染效果
jsonp的优点
不像XMLHttpRequest对象实现的Ajax请求那样受到同源策略的限制
兼容性更好,在更低版本的ie浏览器中都能兼容,这里区别于cors跨域类型
jsonp的原理其实很简单，当然,这也涉及到前端的知识,简单点说就是js端的function函数执行
正常的后端响应数据,例如：
{
"code":"8200",
"data":{
"id":"100",
"name":"Test"
//more......
}
}
jsonp需要的返回格式：
callback({
"code":"8200",
"data":{
"id":"100",
"name":"Test"
//more......
}
});
前端在页面定义callback回调函数,callback函数接收后端响应回来的data-json数据,后端响应后执行callback函数达到调用前端业务逻辑的目的,渲染页面
nginx+ajax
这种配合开发方式也是适合前端还没有引入Node等一站式开发解决方案的情况下引入的,纯粹的HTML+CSS+JS同后端对接，绑定业务接口,渲染数据
我们在使用JSONP开发的时候,前端都是需要在页面端写死HOST+IP接口地址,存在很重大一个弊端就是前端需要些config文件，来配置我们后端的接口请求地址，如果前端工程师规范意识强一点，会通用到一个配置文件里，但是如果没