关于前后端分离与不分离

zyq122 zyq122     2023-02-21     648

关键词:

前端开发者(Frontend Developer)所做的就是开发产品的前端,所谓的 应用产品的前端就是用户看到,接触到和体验到的,他们主要做静态用户界面加上一些动态效果,不涉及数据逻辑,前端考虑到的是用户体验,而后端开发者(Backend Developer)就不一样了,他们是在后台工作的,控制着前端的内容,主要负责程序设计架构思想,管理数据库等。

      前后端分离和微服务一样,渐渐地影响了新的大型系统的架构。微服务和前后端分离要解决是类似的问题,解耦——可以解耦复杂的业务逻辑,解耦架构。可要是说相像吧,消息队伍和前后端便相似一些,通过传递数据的形式来解耦组件。

    前后端分离意味着,前后端之间使用 JSON 来交流,两个开发团队之间使用 API 作为契约进行交互。从此,后台选用的技术栈不影响前台。当后台开发人员选择 Java 的时候,我可以不用 JSP 来编写前端页面,继续使用我的 React 又或者 Angular。而我使用 React 时,也不影响后台使用某一个框架。

    过去,听说 TDD (Test-driven development,测试驱动开发) 可以改善代码的质量,我们便实施了 TDD;接着,听说 BDD (Behavior-driven development,行为驱动开发) 可以交付符合业务需求的软件,我们便实施了 BDD;后来,听说 DDD (Domain-driven design,领域驱动设计) 可以分离业务代码与基础代码,我们便实施了 DDD。今天,听说了前后端分离很流行,于是我们就实施了前后端分离——这就是传说中的 HDD(Hype-driven Development,热闹驱动开发)。

      页面交互是否复杂 ?是简单的提供页面给用户浏览?或者想要支持复杂的用户操作?是否需要搜索引擎优化?如果需要的话,那么从一开始我们就需要考虑后端渲染。能提升开发效率吗?如果不能有效的提升开发效率,为什么要作死呢?是否会提供 API 给 APP?如果我们已经有一个 API 提供给 APP,那么要做这件事就很容易了。如果未来会有的话,那么我们更应该尝试去分离。前端的修改是不是非常频繁?如果不需要经常修改的话,那么这种优化便没有优势。

当然了,如果老板说,我们需要前后端分离,那就做呗!很多时候,一些技术决策都会由于战略原因,而发生一些有意思的变化。

前后端分离将遇到的那些挑战

当我们决定需要前后端分离时,我们仍然还需要面对一系列的问题:

是否足够的安全?如果我们设计出来的架构不够安全,那么这一系列的操作都是白搭。我们怎么去存储用户数据,使用 LocalStorage 的话,还要考虑加密。采用哪种认证方式来让用户登录,并保存相应的状态?是否有足够的技术来支撑前后端分离?有没有能力创建出符合 RESTful 风格的 API?是否有能力维护 API 接口?当前端或者后台需要修改接口时,是否能轻松地修改。前后端协作的成本高不高?前端和后台两个团队是不是很容易合作?是不是可以轻松地进行联调?前后端职责是否能明确?即:后台提供数据,前端负责显示。是否建立了前端的错误追踪机制?能否帮助我们快速地定位出问题。

当我们在不同的项目组上尝试时,就会发现主要的挑战是沟通上的挑战,而非技术上的局限。

前后端分离的核心:后台提供数据,前端负责显示

我曾经有过使用 PHP 和 Java 开发后台代码的经历,仍然也主要是集中在前端领域。在这样的传统架构里,编写前端页面可不是一件容易的事。后台只会传给前端一个 ModelAndView,然后前端就要扑哧扑哧地去丰富业务逻辑。

传统的 MVC 架构里,因为某些原因有相当多的业务逻辑,会被放置到 View 层,也就是模板层里。换句话来说,就是这些逻辑都会被放到前端。我们看到的可能就不是各种if、else还有简单的equal判断,还会包含一些复杂的业务逻辑,比如说对某些产品进行特殊的处理。

如果这个时候,我们还需要做各种页面交互,如填写表单、Popup、动态数据等等,就不再是简单的和模板引擎打交道了。我们需要编写大量的 JavaScript 代码,因为业务的不断增加,仅使用 jQuery 无法管理如此复杂的代码。

     

输出逻辑:数据显示

而仅仅只是因为逻辑复杂的前端代码,无法影响大部分团队进行前后端分离——因为它没有业务价值。实际上是先有了单页面应用,才会出现前后端分离。单页面应用可以让用户不需要下载 APP,就可以拥有相似的体现。并且与早期的移动网页相比,拥有更好的体验。

为了达到这样的目的,后台似乎返回对应的 Model 即可,稍微修改一下 Controller 的逻辑,然后返回这些数据。

与此同时,后台应该按时间来对博客进行排序。前端只需要遍历这个数组,随后取出相应的值显示即可,不需要做任何的逻辑处理。

遗憾的是,在真正的项目中开发的时候,并不能达到这么完美的状态。特别是,为了提高用户体验时,我们可能就会将数据存储在本地,随后直接操作这些数据,对其进行排序,筛选等等的操作。除此,还有诸如表格、图表等等的高级样式,也需要处理这些数据。

而当用户需要提交数据的时候,这些逻辑就会落到前端上。

不可避免的前端逻辑:表单

如果一个前端应用只显示数据的话,那么这个应用就没有充足的理由,做成一个单页面应用——单页面应用是为了更好的交互而存在的。当我们注册、登录、购买东西时,就需要开始与表单进行处理。

合理的表单验证模式应该是:双向验证。

前端在用户输入的过程中就需要实时地检查,是否带有特殊符号、值是否是在允许的范围内、是不是符合相应的规范等等。而不是等用户填写完内容并提交后,再由服务端来告诉用户说,“你的用户名不符合规范”。

服务在收到前端收到的数据后,不管前端有没有进行验证,都应该按后台的逻辑进行验证。

于是乎在这个时候,这些逻辑就被无可避免地放到前台里了。

 

关于前后端分离与不分离

前端开发者(FrontendDeveloper)所做的就是开发产品的前端,所谓的应用产品的前端就是用户看到,接触到和体验到的,他们主要做静态用户界面加上一些动态效果,不涉及数据逻辑,前端考虑到的是用户体验,而后端开发者(BackendD... 查看详情

前后端分离与不分离的区别总结

参考技术A前后端不分离:    在前后端不分离的情况下,前端页面看到的效果都是有后端控制的,由后端渲染页面或重定向,也就是后端需要控制前端的展示,前端与后端的耦合度很高。这种模式比较适合纯文本... 查看详情

前后端分离与不分离,一点点理解

1>为什么要前后端分离?现有开发模式的使用场景前后端职责不清开发效率的问题对前端发挥的局限2>前后端分离会带来什么变化?  1.彻底解放前端    制作页面的时候,不需要后台配置服务器环境,可以自己配置路由,前... 查看详情

前后端分离与不分离

前后端不分离   在前后端不分离的应用模式中,前端页面看到的效果都是由后端控制,由后端渲染页面或重定向,也就是后端需要控制前端的展示,前端与后端的耦合度很高。    这种应用模式比较适合纯网... 查看详情

浅谈前后端分离与不分离

前后端的分离与不分离  随着不同终端的兴起,对开发人员的要求越来越高,纯浏览器端的响应式已经不能满足用户体验的高要求,我们往往需要针对不同的终端开发定制的版本,为了提升开发效率,前后端分离的需求越来越... 查看详情

前后端分离与不分离

 前后端不分离    在前后端不分离的应用模式中,前端页面看到的效果都是由后端控制,由后端渲染页面或重定向,也就是后端需要控制前端的展示,前端与后端的耦合度很高。     这种应用... 查看详情

前后端分离与不分离

 为什么要做前后端分离?  前端后端有两种协作方式,一种可以称之为是服务器端渲染,一种是叫做前后端分离。这两种方式的差别是什么呢?第一种方式是服务器端渲染的方式,是指在服务器端就将网页直接生成,... 查看详情

怪咖------前后端分离与不分离的区别------

   前后端分离,首先所有的程序以数据为基础的,没有数据的程序没有实际意义,程序的本质就是对程序的增删改查,其实前后端分离就是把数据操作和显示分离出来。前端专注做数据显示,通过文字,图片或者图标等方... 查看详情

关于web实现前后端分离,前后端解耦

 一、前言”前后端分离“已经成为互联网项目开发的业界标杆,通过Tomcat+Ngnix(也可以中间有个Node.js),有效地进行解耦。并且前后端分离会为以后的大型分布式架构、弹性计算架构、微服务架构、多端化服务(多种客... 查看详情

关于前后端分离的理解

http://blog.csdn.net/piantoutongyang/article/details/65446892#reply#reply 个人理解:前后端并未分离的时候:javaweb以前使用sparingMVC+mybatis等方式将jsp经过容器解释成servlet再画成html再返回给前端。此时响应返回的是整个页面。 当前后分... 查看详情

aspnetmvc前后端分离项目手记关于跨域问题(还有前言)

 前言,最近的项目使用前后端分离的模式,记录其中一些知识点。经过这个项目,也对前后端分离有了更多理解,尤其是在技术之外的方面。   越来越多的项目采用前后端分离的原因,有两点:   1,... 查看详情

关于模板引擎和前后端分离的使用

模板引擎  1、导入全局作用下的变量  $imports.变量  2、导入非全局作用下的变量  tamplate.defaults.imports.变量名=变量  $imports.变量名利用前后端分离方法制作阿里百秀项目练习  1、localhost:3000访问的内容  是开发... 查看详情

关于前后端分离,你需要知道的那些事

对于刚入门前端或者是想要入门前端,并追随时代的潮流,想要做前后端分离的小伙伴们来说,这篇文章是为你们而写的。至于想多了解一些前后端分离的知识,可以参考https://www.kancloud.cn/chandler/web_technology/741853&... 查看详情

aspnetmvc前后端分离项目手记关于token认证(代码片段)

在前后端分离的项目中,首先我们要解决的问题就是身份认证以往的时候,我们使用cookie+session,或者只用cookie来保持会话。 一,先来复习一下cookie和session首先我们来复习一下在aspnet中cookie和session的关系,做一个简单试验... 查看详情

关于前后端分离的开发模式

为什么要做分离开发:现在很多公司的web开发模式都是用jsp、php、asp等等开发,由服务端渲染,而前端工程师的工作就是完成切图及静态页面的搭建,他们的精力都放在了辅助别人完成项目的工作,背锅还不讨好,责任划分不明... 查看详情

springboot项目一般选择前后端分离好还是整合freemarker?

springboot项目一般选择前后端分离好?还是整合freemarker?现在项目采用哪种模式多一些啊?并没有好与不好,只有合适与不合适;你要看你的项目的应用场景,开展的具体业务类型;是小型项目,还是一定规模的项目,是你自己... 查看详情

什么是前后端分离?为什么分离

...是这样:前端写html页面(非单页面应用),index首页about关于我们newslist新闻列表newsdetail新闻详情productlist产品列表productdetail产品详情后台只提供json数据那么1、前端数据如何渲染?2、页面跳转是否必须使用路由?(不想使用路... 查看详情

vue+mockjs模拟数据,实现前后端分离开发

在项目中尝试了mockjs,mock数据,实现前后端分离开发。关于mockjs,官网描述的是1.前后端分离2.不需要修改既有代码,就可以拦截Ajax请求,返回模拟的响应数据。3.数据类型丰富4.通过随机数据,模拟各种场景。等等优点。总结... 查看详情