比如说请求网站首页 /home/login,而网站是前后端分离开发的,后端只提供接口,没有 /home/login 对应的处理函数。只有 /api/sys/login 这种接口。 那么当用户请求 /home/login 的时候,是走了什么流程呢?难道前端也有服务器吗?是请求前端服务器的函数,再发起接口请求吗?
1
cmdOptionKana 2021-09-07 21:05:55 +08:00
|
2
ESP OP @cmdOptionKana 非常感谢
|
3
learnshare 2021-09-07 21:32:32 +08:00
一般用 Nginx 处理。
前端页面一律返回 index.html (因为只有一个页面入口),路径由前端路由处理(根据路径判断该显示什么) 接口转发到后端服务 参考 https://cli.vuejs.org/zh/guide/deployment.html#docker-nginx |
4
yeqizhang 2021-09-07 21:57:22 +08:00 via Android
异步呀
|
5
ESP OP @learnshare 感谢,我了解到是先请求静态资源,再根据路由去匹配组件,由 ajax 发送 api 请求,拿到后端数据,最后完成页面的渲染。那么 nginx 在这里相当于什么角色呢?
|
7
Jacky23333 2021-09-07 23:34:50 +08:00 via Android 3
就 React 为例,包含了多种路由模式,在 HashRouter 下,你的网页 url 为 http://xxx.com/index.html/#/home/login,可以注意到,#后面的 path 已经不属于 url 中的 path 了,对后端而言,你只是访问了 index.html,而#后面的 path 是由 js 在前端中自行处理并重新渲染页面的,和服务端没有关系了~,当然 index.html 一般会省略掉,也就是网页 url 变成 http://xxx.com/index.html/#/home/login 。而 react 还支持另外一种模式 BrowserRouter,在这种模式下,你的浏览器 url 是 http://xxx.com/home/login,看起来很普通的 url 是不是?这种情况就需要前端提供 nodejs 服务器来进行解析了也就是你说到的情况。
|
8
iseki 2021-09-08 04:17:58 +08:00 via Android
不需要哦,nginx 不管啥路径一律返回 index 文件就行了,前端自己去维护路由
|
9
murmur 2021-09-08 08:24:52 +08:00
不习惯可以用 hash 模式,index.html?#/home/login 这样的形式,不需要改 nginx 配置
|
10
waiaan 2021-09-08 11:05:33 +08:00
页面只有一个,根据 url 在当前页面渲染不同的内容。
|