vue中history和hash的区别有哪些

本篇内容主要讲解“vue中history和hash的区别有哪些”，感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷，实用性强。下面就让小编来带大家学习“vue中history和hash的区别有哪些”吧!

区别：1、hash路由再地址栏URL上有“#”，而history路由没有；2、进行回车刷新操作时，hash路由会加载到地址栏对应的页面，而history路由一般会出现404错误；3、hash支持一些低版本的浏览器，而history不支持。

本文操作环境：windows10系统、Vue2.9.6版，DELL G3电脑。

vue中history和hash的区别

• hash路由在地址栏URL上有#，用 window.location.hash 读取。而history路由没有会好看一点

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

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

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

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

• history的这种模式需要后台配置支持。比如：当我们进行项目的主页的时候，一切正常，可以访问，但是当我们刷新页面或者直接访问路径的时候就会返回404，那是因为在history模式下，只是动态的通过js操作window.history来改变浏览器地址栏里的路径，并没有发起http请求，但是当我直接在浏览器里输入这个地址的时候，就一定要对服务器发起http请求，但是这个目标在服务器上又不存在，所以会返回404

到此，相信大家对“vue中history和hash的区别有哪些”有了更深的了解，不妨来实际操作一番吧！这里是编程网网站，更多相关内容可以进入相关频道进行查询，关注我们，继续学习！