vue-router的两种模式

hash 和 history

区别：

外观上：hash的路由在url中带有#号

功能上：

hash虽然在url中，但是请求不会包裹它，对后端不会产生任何影响，改变hash不会重新加载页面。

history是利用了html5 history interface中新增的pushState()和replaceState()方法。这两个方法是应用于浏览器的历史记录栈，是以当前已有的back(),forward(),go()方法为基础的，提供了对历史记录进行修改的功能。这两个方法执行修改时，只是修改了地址栏中的url，而不会向后端发送请求，也不会触发popstate事件。

因此，hash和history都是属于浏览器自身的特性，而vue-router只是调用浏览器提供的接口借助这两个特性来实现前端的路由。

404问题：

1、在hash模式下，仅hash符号之前的内容会被包含在请求中，如 http://www.page.com，对于后端来说，即使没有做到对路由的全覆盖，也不会返回404错误；

2、在history模式下，前端的url必须和实际后端发起请求的url一致，如http://www.page.com/person/name 。如果后端缺少对/person/name 的路由处理，将返回404错误。

利弊：

如果是to B系统，对url要求不敏感，简单易用，推荐 hash

to C系统，需要服务端支持的话，推荐使用history

注：在开发过程中，默认开启的模式为hash，开启history模式需要配置mode:'history'

来源：https://www.cnblogs.com/xytx906/archive/2023/03/16/17222946.html