vue-router 的 hash 和 history 模式

vue-router 默认 hash 模式:
使用 URL 的 hash 来模拟一个完整的 URL，于是当 URL 改变时，页面不会重新加载

history 模式:
利用 history.pushState API 来完成 URL 跳转而无须重新加载页面
利用了 HTML5 History Interface 中新增的 pushState() 和 replaceState() 方法。（需要特定浏览器支持）这两个方法应用于浏览器的历史记录栈，在当前已有的 back、forward、go 的基础之上，它们提供了对历史记录进行修改的功能。只是当它们执行修改时，虽然改变了当前的 URL，但浏览器不会立即向后端发送请求。

history 提供类似 hashchange 事件的 popstate 事件，但 popstate 事件有些不同：通过浏览器前进后退改变 URL 时会触发 popstate 事件，通过pushState/replaceState或标签改变 URL 不会触发 popstate 事件。好在我们可以拦截 pushState/replaceState的调用和标签的点击事件来检测 URL 变化，所以监听 URL 变化可以实现，只是没有 hashchange 那么方便

history 模式下，前端的 URL 必须和实际向后端发起请求的 URL 一致，如 http://www.abc.com/def/id。如果后端缺少对 /def/id 的路由处理，将返回 404 错误。
Vue-Router 官网里如此描述：“不过这种模式要玩好，还需要后台配置支持…所以需要要在服务端增加一个覆盖所有情况的候选资源，如果 URL 匹配不到任何静态资源，则应该返回同一个 index.html 页面，如 app 依赖的页面。

history模式注意404、微信分享等的问题

hash 模式下
是 URL 中 hash (#) 及后面的那部分http://www.abc.com#abc即#abc，常用作锚点在页面内进行导航。改变 URL 中的 hash 部分不会引起页面刷新，仅 hash 符号之前的内容会被包含在请求中，如 http://www.abc.com，因此对于后端来说，即使没有做到对路由的全覆盖，也不会返回 404 错误。
通过 hashchange 事件监听 URL 的变化，改变 URL 的方式只有这几种：通过浏览器前进后退改变 URL、通过标签改变 URL、通过window.location改变URL，这几种情况改变 URL 都会触发 hashchange 事件

参考：https://mp.weixin.qq.com/s/XV7tGdB6bDbZT4h5H8Y3yw