这是一个创建于 930 天前的主题，其中的信息可能已经有所发展或是发生改变。
以前没写过前后端分离的项目，想请教下架构怎么设计
例如未分离时，像登录成功后的页面跳转到首页的功能
是在后端校验完，后端重定向到首页接口，再由首页接口返回首页的 html 页面
页面的跳转是由后端负责的
那如果项目改成前后端分离，页面的重定向是由前端负责吗？
前端页面使用 ajax 向后端发送请求
后端校验后，不进行重定向，只返回状态码和 json 数据
前端根据状态码决定是在当前页面提示登录错误信息，还是登录成功跳转到首页
是这样设计吗？前后端分离后所有的页面的跳转都是由前端负责，后端只负责返回数据
 |
1
molvqingtai 2022-06-09 13:27:12 +08:00
理解正确
|
 |
2
shabbyin 2022-06-09 13:29:25 +08:00
重定向谁做都可以
后端做的话 可以直接返回 301 302 前端做的话就加拦截器 发现接口返回对应的响应码 就重定向到登录页 |
 |
3
zhuweiyou 2022-06-09 13:30:05 +08:00
重定向肯定是客户端负责. 你想象一下你的 API 如果给 APP 用,你能控制 APP 的跳转吗?
|
 |
4
ChefIsAwesome 2022-06-09 13:31:09 +08:00 via Android
楼上说的没错。你就想着是写原生 app 的后端，自然就没有以前的包袱了。
|
 |
5
yezheyu OP |
 |
7
dcsuibian 2022-06-09 13:34:38 +08:00  1
以前是后端直接给 html 页面的，差不多是这样，他来告诉你跳到哪儿，所以叫后端路由。去到不同的页面就是给你不同的 html 页面，所以就是多页的。
现在前端应该多是单页应用，前端根据拿来的数据决定跳到哪儿。后端只负责提供数据。 说是跳转，实际上就是网页内容的替换，配合浏览器的 history api 变更地址栏，看起来就像跳到了新页面。所以叫前端路由。 一个明显的地方就是浏览器的刷新按钮根本没动过，因为就是原来那一个页面，所以叫单页应用。 |
 |
8
Erroad 2022-06-09 13:36:03 +08:00
@yezheyu #5 前端校验是为了验证参数本身格式是否有问题，并且给用户提示；后端是登录鉴权等登录逻辑，也可能有格式校验。要从功能本身出发啊
|
 |
9
lyusantu 2022-06-09 13:41:13 +08:00
|
|
10
yezheyu OP @fiypig
为啥呢？ 以前是： 前端：校验数据 ——> 后端：校验数据 前端提前校验数据是为了让用户知道输入错误 后端校验是保证存到数据库的数据的正确性 </br> 现在是： 前端 ——> 后端：校验数据 ——> 前端：取出参数错误信息加载到页面上 前段不加校验的话，不是可以从后端返回的参数错误信息取数据加载到页面上吗？ 一样可以提醒用户输入错误 为啥还要校验呢？ |
|
13
yezheyu OP 还有个问题想请教下各位老哥
以前 html 页面由后端服务器直接生成，返回给浏览器 现在改成前后端分离了，html 页面是由谁返回给浏览器呢？是前端自己有个单独的服务器吗？ 如 nginx ？前端页面开发好后直接把所有的 html 页面当做静态资源交给 nginx 管理是吗？ 后端的接口再单独部署一台服务器，再交给 nginx 反向代理 </br> 所以对于一个 url ，如果是请求 html 页面，则直接由 nginx 路由处理 如果是个接口，则由 nginx 转发给后端服务器 是这样吗 ? |
 |
15
yyfearth 2022-06-09 14:23:28 +08:00
|
|
16
yyfearth 2022-06-09 14:29:54 +08:00
@yezheyu html 页面 现在都是推荐直接使用 CDN
CDN 后面连一个云存储 比如 S3 之类的 如果非要用自己的服务器 直接一个静态服务器就可以了 如果要用 cookie 那需要 CDN 或者负载均衡可以转发后端 用 nginx 的话 就和你说的一样 如果用 jwt 的话 可以前后端服务器都分离 用不同的域名 做好服务器的 CORS 跨域认证就没问题了 |
|
17
yyfearth 2022-06-09 14:32:19 +08:00
@yezheyu 现在 除非是内部服务 或者使用者非常小的服务 否则都不推荐直接服务器 连虚拟机都不是很推荐了
有能力直接上 K8n 或者 Docker |
|
18
yyfearth 2022-06-09 14:33:03 +08:00
k8s 或者 docker
就算是内部服务 用 docker 部署起来也方便不少 |
|
19
dcsuibian 2022-06-09 14:40:53 +08:00
@yezheyu
单页应用的话，可以参考 vue router 的说明： https://router.vuejs.org/zh/guide/essentials/history-mode.html#%E6%9C%8D%E5%8A%A1%E5%99%A8%E9%85%8D%E7%BD%AE%E7%A4%BA%E4%BE%8B 拿 Spring Boot 举例，直接 build 到后端 src/main/resources/static 里然后和后台程序一起打成 jar 包就可以直接跑了 但其实更多的应该是 Nginx ，好扩展，而且前后端分离的比较彻底，比较推荐 原理上就跟你想的一样，把请求 api 的和请求页面的分开处理。api 的话，主要有两种，api.xxx.com 或 xxx.com/api 这样的。 单页应用应该只有一个 index.html 。注意如果客户端直接访问一个地址 xxx.com/user-center/advance ，也要把 index.html 返回去，xxx.com/user-center/advance 这个链接到底有没有还得前端 js 执行了再说，没有就跳到前端做的 404 页面。 |
 |
20
libook 2022-06-09 14:42:17 +08:00
跟用户交互有关的尽可能都放在前端，后端只为前端提供数据、核心业务功能、安全性。
同为前后端分离，不同需求用不同重定向方式；如果是 HTTP 协议层的原因需要重定向，如为转移位置的资源进行重定向，或由 HTTP 协议升级成 HTTPS 协议的重定向，可以由后端来完成；虽然是后端完成，但用户不一定会有感知，比如一个页面请求的一张图片从一个 URL 移动到另一个 URL 了，后端返回了重定向，然后浏览器去新 URL 获取资源了，这个过程用户可能只看到了一张图片加载出来，并没有感知到中间经过了一次重定向；跟用户交互有关的页面跳转，可以使用前端重定向，比如可以在前端登录页面判断服务器返回的登录结果信息，成功就跳转到功能页面。 |
 |
21
wu67 2022-06-09 15:48:09 +08:00
一般来说, 后端只提供接口和数据、校验, 其余全部都在前端完成. 一般就需要判断一个问题, 就是身份失效 /过期时的统一处理, 需要协调好数据格式告知前端让其重定向登录.
|
 |
22
elboble 2022-06-09 18:30:46 +08:00
@yezheyu 我自己做的小项目前后端分离，基本如你所说，前端打包后，js,html,static 当成静态文件通过 nginx 访问，然后 nginx 反代后端，可以是一个 nginx ，也可以是不同机器上的 nginx ，要注意 cors 。
|
 |
23
ration 2022-06-09 18:52:26 +08:00 via Android
前后端分离。用前端跳转，不要用后端，后端只提供授权接口。不然维护很麻烦，而且会多跳几次
|
 |
24
ychost 2022-06-10 11:15:52 +08:00
现在 Web 支持 H5 路由和 Hash 路由，前端可以完全控制页面跳转而不重载页面
|
Select Language