vue 前后端分离的原理

一： 原始人时代

1，定需求
2，敲代码
3，测试
4，发布，需要用eclipse把代码打成一个war包，然后把这个war包发布到生产环境下的web容器里。这时候前后端代码都在这个war包里，html，js，css，各种第三方库等。这样服务器压力会很大，页面中的所有请求都要通过这个服务器，如果同时很多人访问这个网站速度就会很慢。一旦服务器出现状况，前后端一起玩完，用户体验级差。。

---

二： 新的方式

1，浏览器发送请求
2，直接到达html页面（前端控制路由和渲染页面，整个项目开发的权重前移）
3，html页面负责调用服务器端接口产生数据（通过ajax等等，后台返回json数据）
4，填充html，展现动态效果，在页面上进行解析并操作

---

三： 前后端分离的优势

1，可以实现正真的前后端解耦，前端服务器放 css，js，图片等一系列资源，前端服务器负责控制页面引用，跳转，路由。前端页面异步调用后端的接口。加快整体响应速度。

2，发现bug，可以快速定位是谁的问题，页面逻辑，跳转错误，浏览器兼容问题，脚本错误，页面样式等问题由前端解决。接口数据出错，数据没有提交成功，响应超时等由后台负责。双方互不干扰。

3，减少后端服务器的开发/负载压力。除了接口外的http请求全部转到 前端nginx上。

5，即使后端服务器暂停超时或者宕机了，前端页面也会正常访问。只不过数据刷不出来而已。

6，增加代码的维护性，易读性。

7，前端大量的组件化代码 可以抽出来复用，组件化开发提升效率。

---

四： 注意事项

1，再开需求会议的时候，前后端都需要参加，并且制定好接口文档。

2，加重了前端的工作量，减轻了后端的工作量。提高了性能和可扩展性。

3，如果你的项目很小，而且是一个内网项目，不用任何架构而言。

4，前端需要有机制应对后端请求超时以及宕机的情况，有好的展示给客户。

---

五： 总结

千万不要以为只有敲代码的时候把前端和后端分开就是前后端分离了，需要区分前后端项目。

前端与后端是两个项目。放在两个不同的服务器，需要独立部署。

两个不同的工程，两个不同的代码库，不同的开发人员。

前后端需要约定交互接口，实现并行开发，开发结束后需要进行独立部署。