彻底解决关于路由的问题,前端路由和服务端路由,history api 和 hash路由

首先路由分成两大块,分别是前端路由和服务端路由,而前端路由又分为两种模式,分别是 histroy api 模式和 hash 模式。

  1. 路由
    1. 前端路由:指在浏览器中进行路由控制的一种方式,通过监听 url 变化决定加载哪个页面组件或视图,并不会引起完整的页面刷新。
      1. SPA 单页应用使用前端路由
      2. 页面切换不需要从服务器重新加载整个页面,可以提升web应用性能
        1. History API 路由(react router 、vue router 等)
        2. hash 路由
        3.  history api 和 hash 路由的区别
      3. nuxtjs 虽然是服务端渲染,但是实际上是前端路由的一种应用
      4. 单页应用有一个根节点,然后前端路由会根据地址的 pathname 去匹配相应页面的组件,然后将dom 插入根节点,达到无刷新就切换页面的效果,这也是 vue 等 spa 框架的原理
    2. 服务端路由:服务端进行路由控制的一种方式,当用户请求某个 URL,服务端更具URL 的不同来返回不同的页面或数据
      1. 通常由后端框架 express 等负责处理,服务器接收客户端请求后,更具 URL 调用响应的路由处理函数,并返回响应的响应
      2. 比如我们在写express 服务的时候,下面代码就是 服务端路由的例子
      3. 对 seo 搜索引擎优化友好,因为服务端返回的是完整的 HTML
      4. 多用于多页应用 MPA 架构

关于单页应用和多页应用的关系和区别,请参考这篇文章

  • 7
    点赞
  • 8
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值