hash路由和history路由的区别

Hash模式

通过 onhashchange 方法监听hash的改变来实现

• Hash模式是基于锚点，以及onhashchange事件
• URL中#后面的内容作为路径地址
• 监听hashchange事件
• 根据当前路由地址找到对应组件重新渲染

History模式

通过 onpopstate 方法监听history的改变来实现

• History模式是基于HTML5中的History API
• 通过history.pushState()方法改变地址栏 IE 10 以后才支持
• 监听popstate事件
• history.replaceState()
• 根据当前路由地址找到对应组件重新渲染

hash 与 history 区别对比：

hash	history
有 # 号	没有 # 号
能够兼容到IE8	只能兼容到IE10
实际的url之前使用哈希字符，这部分url不会发送到服务器，不需要在服务器层面上进行任何处理	每访问一个页面都需要服务器进行路由匹配生成 html 文件再发送响应给浏览器，消耗服务器大量资源
刷新不会存在 404 问题	浏览器直接访问嵌套路由时，会报 404 问题。
不需要服务器任何配置	需要在服务器配置一个回调路由