前后端分离架构模式讨论:要前后端分离,不要前后端分裂

本文涉及的产品
.cn 域名,1个 12个月
简介: 前后端分离架构模式讨论:要前后端分离,不要前后端分裂

本文作者为蚂蚁集团工程师王辰,主要介绍了他对于前后端分离架构模式的思考。

引子

最近在项目中遇到了前后端分离如何实现的问题,搞得有点[裂开了]。

其实这个问题并不新鲜,因为从这个世界上的研发被分为前端和后端两类的时候开始,大家就哭着吵着要分家了。

但是就像茴字有多种写法一样?分家有多少种方式?具体每种方式怎么操作?每种方式的优劣是什么?

本文试图结合最近的经验对这些问题作出总结。

而一旦说起前后端分离,始终绕不开的就是传统的MVC架构。

传统的单应用MVC架构
传统的MVC架构,如图所示:


特点:
●前端页面和后端部署在一起。
●一个域名:前后端使用相同的域名。
●登陆态通过cookie-session模式维护。(其中session可以放在db中,也可以放在分布式缓存中)
●spring框架天然支持:CookieHttpSessionStrategy

在大规模的软件工程中,由于前后端技能各自的专业化,前后端分离有其必要性,所以在传统的单应用MVC架构基础上,可以做如下前后端分离:

前后端分离-情况一:前后端同域名
示意图如下:



特点:
●前端页面和后端分离部署
●一个域名:前后端使用相同的域名
●登陆态通过cookie-session模式维护(因为同域名)
●spring框架天然支持:CookieHttpSessionStrategy

前后端分离-情况二:前后端不同域名
示意图如下:



特点:
●前端页面和后端分离部署
●前后端使用不同的域名
●此时不能继续使用cookie-session模式维护登陆态,需要使用tokenId-session的交互模式。
●spring框架天然支持:HeaderHttpSessionStrategy

存在的问题:
●前端跨域访问。
●前端跨域写入cookie。有些浏览器完全不支持跨域写入cookie,比如safari,这一点非常致命,尤其是在iphone上。

实践:项目中的“分裂”和“缝合”
在最近的项目中,我们就遇到了现状是情况一,但因为前端平台的限制(前端直接把研发工程部署到了生产域名),需要我们同时支持情况二的特殊情况。

这种情况同时要支持cookie(前端是PC)和tokenId(前端是H5)两种模式,目前spring框架无法直接支持。

调研和验证之后,我们后端的解决方案也非常简单粗暴:
1)向前端提供登陆接口(信任登陆),返回tokenId。
注:这里需要注意tokenId被盗用等安全性问题,这是另一个话题,本文不表。
2)直接修改CookieHttpSessionStrategy中的DefaultCookieSerializer,同时兼容cookie和tokenId模式,如下;




(当然,前端也得改,但是前端PC和H5本身就是两个端,本来就要改)。

可以看到,(情况一和情况二)都是在单应用mvc架构上的改造。

如果即要支持客户端、H5、小程序等各种端,那么一定不能使用mvc模式,更不能使用cookie-session这种仅在浏览器中支持的交互模式(何况有些浏览器都不支持跨域cookie),因此应该做完全的前后端分离。

完全前后端分离
完全的前后端分离中,前后端必然使用tokenId交互(比如Oauth),后端应以网关的模式提供所有的服务,同时登陆态的管理也应该交由独立的登陆系统。

示意图如下:



特点:
●前端页面和后端分离部署
●前后端使用不同的域名
●使用tokenId-后端登陆态管理(如Oauth等方式)。

如何选型?
那么,这四种模式该如何选型呢?我的想法如下:

传统MVC模式
真正意义上的全栈开发,适合只在单一客户端上开发,一个人或者几个人的创业团队。

前后端分离(情况一)
不推荐这种模式,使用这种方式还不如一步跳到前后端分离(情况二)。

前后端分离(情况二)
适合曾经是单应用的传统MVC模式,现在想做前后端分离,但是又没有太多经验的团队,又不想步子迈得太大。

完全前后端分离
适合有一定前后端分离的经验,一开始就定位为需要支持多端的大型团队,这样的团队者规模比较大、团队中的每个小组负责一个模块或者一个领域。


一般的演进路径:传统MVC模式 -> 前后端分离(情况二)-> 完全前后端分离

总结
前后端分离是生产技能精细化带来的分工导致的必然结果,是优化前后端生产关系的一种方法。

这种分工方法和全栈开发有一定的矛盾性。

实践中,我们应该按照自己的实际情况和目标来选型,而不是盲目追求新概念和新技术。

目录
相关文章
|
7月前
|
小程序 Java 数据管理
Java前后端分离架构开发的智慧校园电子班牌系统源码(SaaS模式)
.智慧校园设备管理: 设备管理主要对班级中正在使用的电子智慧班牌进行管理,基本功能包含(开关机状态、班级信息、设备型号、开关机信息、电子智慧班牌截屏信息、教师编号、设备ID、在线和离线状态、电子智慧班牌更新时间等)
82 0
|
2月前
|
运维 负载均衡 安全
深度解析:Python Web前后端分离架构中WebSocket的选型与实现策略
深度解析:Python Web前后端分离架构中WebSocket的选型与实现策略
105 0
|
6月前
|
前端开发 安全 数据库
Web架构&前后端分离站&Docker容器站&集成软件站&建站分配
Web架构&前后端分离站&Docker容器站&集成软件站&建站分配
207 1
|
2月前
|
安全 数据安全/隐私保护 UED
优化用户体验:前后端分离架构下Python WebSocket实时通信的性能考量
在当今互联网技术的迅猛发展中,前后端分离架构已然成为主流趋势,它不仅提升了开发效率,也优化了用户体验。然而,在这种架构模式下,如何实现高效的实时通信,特别是利用WebSocket协议,成为了提升用户体验的关键。本文将探讨在前后端分离架构中,使用Python进行WebSocket实时通信时的性能考量,以及与传统轮询方式的比较。
70 2
|
7月前
|
缓存 自然语言处理 前端开发
第一章 引言-HTTP协议基础概念和前后端分离架构请求交互概述
第一章 引言-HTTP协议基础概念和前后端分离架构请求交互概述
147 0
|
3月前
|
前端开发 安全 JavaScript
构建高效Web应用:前后端分离架构的实践
【9月更文挑战第4天】在数字时代,Web应用已成为企业与用户互动的主要平台。本文将介绍如何通过前后端分离的架构设计来构建高效的Web应用,探讨该架构的优势,并分享实现过程中的关键步骤和注意事项。文章旨在为开发者提供一种清晰、高效的开发模式,帮助其在快速变化的市场环境中保持竞争力。
|
5月前
|
监控 前端开发 JavaScript
构建高效实时应用:Python WebSocket在前后端分离架构中的实践
【7月更文挑战第18天】WebSocket助力实时Web应用,通过一次握手建立持久连接,解决HTTP实时性问题。Python中可用Flask-SocketIO创建WebSocket服务器,前端JavaScript使用Socket.IO库连接。确保安全可采用HTTPS、认证及跨域限制。示例代码展示如何实现双向实时通信。
111 4
|
5月前
|
安全 数据安全/隐私保护 UED
优化用户体验:前后端分离架构下Python WebSocket实时通信的性能考量
【7月更文挑战第17天】前后端分离趋势下,WebSocket成为实时通信的关键,Python有`websockets`等库支持WebSocket服务。与HTTP轮询相比,WebSocket减少延迟,提高响应。连接管理、消息传输效率、并发处理及安全性是性能考量重点。使用WebSocket能优化用户体验,尤其适合社交、游戏等实时场景。开发应考虑场景需求,充分利用WebSocket优势。
156 3
|
6月前
|
前端开发 JavaScript API
现代Web开发中的前后端分离架构
本篇文章探讨了前后端分离架构在现代Web开发中的应用与优势。