hash路由和history路由的区别，他们的优缺点是什么

[yixiaosi1314]

No description provided.

[zyb970821]

hash路由和history路由的区别：

1.hash路由在地址栏URL上有#，而history路由没有会好看一点

hash路由 121.0.0.1:80/test/index.html#/a/b

history路由 121.0.0.1:80/a/b

2.进行回车刷新操作，hash路由会加载到地址栏对应的页面，而history路由一般就404报错了（刷新是网络请求，没有后端准备时会报错）。

3.hash路由支持低版本的浏览器，而history路由是HTML5新增的API。

4.hash的特点在于它虽然出现在了URL中，但是不包括在http请求中，所以对于后端是没有一点影响的，所以改变hash不会重新加载页面，所以这也是单页面应用的必备。

5.history运用了浏览器的历史记录栈，之前有back,forward,go方法，之后在HTML5中新增了**pushState（）和replaceState（）**方法（需要特定浏览器的支持），它们提供了对历史记录进行修改的功能，不过在进行修改时，虽然改变了当前的URL，但是浏览器不会马上向后端发送请求。

---

hash路由和history路由优缺点：

hash模式:

优点:

(1) 只需要前端配置路由表, 不需要后端的参与
(2) 兼容性好, 浏览器都能支持
(3) hash值改变不会向后端发送请求, 完全属于前端路由

缺点:

(1) hash值前面需要加#, 不符合url规范,也不美观

---

history模式:

优点:

(1) 符合url地址规范, 不需要#, 使用起来比较美观

缺点:

(1) 在用户手动输入地址或刷新页面时会发起url请求, 后端需要配置index.html页面用户匹配不到静态资源的情况, 否则会出现404错误
(2) 兼容性比较差, 是利用了 HTML5 History对象中新增的 pushState() 和 replaceState() 方法,需要特定浏览器的支持.

---

总结: 一般情况下两种路由的模式都可以使用, 具体的使用场景可以结合以上两种模式的优缺点进行选择.