哈希路由和history路由的原理

这是vue-router的两种模式

哈希路由把路由的路径用 # 拼接在 url 后面,当井号 # 后面的路径发生变化时，浏览器并不会重新发起请求，而是会触发 onhashchange 事件。

hash有三个特点:

1. hash 可以改变 url ,但是不会刷新页面, 这并不算是一次 http 请求，所以这种模式不利于 SEO 优化
2. hash 通过 window.onhashchange 的方式，来监听 hash 的改变，借此实现无刷新跳转的功能
3. hash 永远不会提交到 server 端（可以理解为只在前端自生自灭）

history路由:

1. 更新页面而不发送 http 请求
2. 使用 history 模式时，需要通过服务端来允许地址可访问
3. 新的 url 可以是与当前 url 同源的任意 url ，也可以是与当前 url 一样的地址
4. 通过 history.state ，添加任意类型的数据到记录中。
5. 通过 pushState 、 replaceState 来实现无刷新跳转的功能。

使用场景:

1. to B 的系统推荐用 hash ，相对简单且容易使用，且因为 hash 对 url 规范不敏感；
2. to C 的系统，可以考虑选择 H5 history ，但是需要服务端支持；

to B 企业内部或商家使用的系统或平台

to C 消费者、个人终端用户使用的客户端