在网站开发行业，这几年比较流行一个词，叫做前后端分离，这个前后端分离是什么意思呢？前后端分离的话，都有什么缺点和优点，如何实现？今天丁老师进行一下介绍。

什么是前后端分离？
1.传统网站，是把动态程序代码和数据，写到html模板中，有服务端读取html模板进行渲染的同时，输出变量值和数据。
2.传统网站，前端页面和后端程序必须放在同一台服务器，甚至同一个项目下。
3.前后端分离，是一种新的开发架构，核心是前端和后端各自独立开发、独立部署，通过API接口进行通信。
4.前后端分离，前端和后端可以分开单独开发、分开部署，两者不需要有关联性，只需要通过API接口进行数据互通即可。

前后端分离开发的优缺点有哪些？
优点：
1.开发效率高，前端和后端可以并行开发，节省时间；
2.职责清晰，前端可以专注用户体验，后端则专注业务实现和数据。
3.支持多端套用，后端提供的API接口，大多可同样用于网站、微信小程序、APP等数据调用。
4.部署灵活，前端可以部署到CDN上，加载速度快。

缺点：
1.开发成本高，同样的一个工作，传统开发只需要后端+UI设计，而前后端分离，还需要招一个前端开发者。开发最终实现的效果都一样，却增加了运营成本。
2.不适合网站SEO，传统网站的是直接把信息输出到了页面中，更便于搜索引擎的直接抓取；而前后端分离的开发方式，则是先显示模板页面，等调用服务端接口，获取到内容后，再通过js将数据显示到页面中，对于搜索引擎来说抓取网站的信息可能为空。前后端分离方式极不利于SEO。
3.网络请求太多，前端需通过Ajax/Fetch等方式发起多个接口请求获取数据，如果服务端接口设计不合理，就会导致网络请求过多、数据冗余或请求超时问题，增加前端数据处理和状态管理的复杂度。
4.安全风险增加，前后端分离后，前端代码与后端接口都会暴露在浏览器端，易被攻击者分析和篡改，需加强前端数据校验和xss、csrf安全防护。同时，后端接口需要进行严格的校验验证，避免因接口漏洞导致数据泄露或恶意攻击。
5.调试和部署复杂，调试时要同时启动前后端服务，借助接口调试工具定位问题，比传统单体应用调试更复杂。部署时需分别部署前端资源和后端服务，增加部署流程和运维成本。

如何实现前后端分离开发？
1.前后端分离开发方式，普遍应用于以vue/react等开发语言的前端框架。
2.纯html也可以实现前后端分离，用js调用即可，不过这种方式纯属脱裤子放屁-多此一举。
3.可以使用全栈快速开发框架来实现，如next.js、nuxt.js、Remix等。
4.后端不做页面渲染，只开发api接口，然后前端通过api接口调用来实现数据的读取。

全文总结
简单的说，传统方式做网站，就是后端自己做饭，做好饭端上桌；而前后端分离方式则是后端只提供食材，由前端自己炒菜自己端上桌。概念就是这么个概念。

前后端分离设计框架，大多应用于微信小程序、APP等明显前端和后端需要分开的应用，对于网站开发来说基本算是可有可无，也就是说技术是有这么个技术，只能说这种设计模式可以做网站，但不是最先进的，也不一定是最适用的，更不是说必须要用这种方式做，具体还是要根据网站的类型和需求来考虑。

丁老师个人建议，针对做网站来说，如无特殊癖好，则不要采用前后端分离的方式开发，这种方式开发复杂、维护成本高，也不利于网站的营销和推广。用这种方式开发，对于习惯使用Express、next.js的开发者来说，前端开发自己是爽了，但是对于网站的运营方来说，则是百害而无一利。对开发者友好，对运营者没什么显著的优点，简直是自己给自己找麻烦。

前后端分离方式更多适用于微信小程序、APP的开发，各种内部业务系统、数据中台、管理系统的开发，以及其他轻量级的web应用等，前后端分离方式不适合做前端网站。

公司企业官网开发制作 送服务器 免费维护