Skip to content

路由模式Hash和History有什么区别?

Hash模式History模式
功能实现基于window.location.hashwindow.history
兼容性兼容到IE8兼容到IE10
URL链接显示带`#`号显示不带`#`号
离线环境正常跳转不能正常跳转
线上环境正常跳转需要配置,否则刷新会出现404问题
服务请求实际的url之前使用哈希字符,这部分url不会发送到服务器,不需要在服务器层面上进行任何处理每访问一个页面都需要服务器进行路由匹配生成 html 文件再发送响应给浏览器,消耗服务器大量资源
缺点
  • 由于`#`被占用,会导致页面锚点定位无法使用
  • 不利于 SEO(搜索引擎优化)
  • 白屏时间问题。浏览器需要等待 JavaScript 文件加载完成之后渲染 HTML 文档内容,用户等待时间稍长
需要配置