温馨提示×

温馨提示×

您好,登录后才能下订单哦!

密码登录×
登录注册×
其他方式登录
点击 登录注册 即表示同意《亿速云用户服务条款》

vue中vue-Router如何将默认hash模式修改为history需要做的修改

发布时间:2021-08-06 10:31:50 来源:亿速云 阅读:245 作者:小新 栏目:web开发

这篇文章主要介绍了vue中vue-Router如何将默认hash模式修改为history需要做的修改,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。

主要是因为活动页会存在pc端的时候未登录的用户也需要访问的问题,因为未登录用户在活动页面进行操作的时候会触发到登录事件,然后我们实现的方式是通过接口来判断,该接口标记的是一个upn的值

然后登录的时候是单点登录,不知道是否回调地址不支持vue形式下hash模式的路由,因而自动忽视了后面的#路径

然后我查了一下一般回调以后#后都会默认为书签,我转义了然而还是只能职别#之前的路径

由于不是很清楚登录单点那一块而且他们暂时实现没有什么业务问题(当然开始~~就是不稳定,现在有时候还是会有不稳定的问题)所以暂时不存在让他们的回调地址支持vue的hash模式路由的问题

然后我就只能修改vue Router的路由模式,修改为了hostory模式

好吧,摸索了很久不然可能真的没有办法解决

运维部署的活动地址线上的路径是 https://xxxxx.xxxxl.com/activity

我做了两处修改

vue中vue-Router如何将默认hash模式修改为history需要做的修改

1、修改模式

2、切到网站路径下的/activity

3、其它路径切到/activity/

当然这么处理以后本地运行出来肯定是白板。因为方便我一般是切到文件夹下直接 run的

没有再本地使用搭建本地的所以,需要两份路由一份只修改模式,一份继修改模式又切换路径

然后这样只是代码上的处理我们还需要修改服务端的配置

基于运维良好的配合,才能尝试出来,很是开心

他们本来对活动做的配置

vue中vue-Router如何将默认hash模式修改为history需要做的修改

使用 try命令尝试多种配置

location / { try_files $uri $uri/ /index.html; }

然后完成这些设置以后线上终于可以访问 https://xxxxx.xxxxx.com/activity/valentine

这种路径的形式了,当然这个地址是实际存在的,它并不会跳转到配置的路由的首页

感谢你能够认真阅读完这篇文章,希望小编分享的“vue中vue-Router如何将默认hash模式修改为history需要做的修改”这篇文章对大家有帮助,同时也希望大家多多支持亿速云,关注亿速云行业资讯频道,更多相关知识等着你来学习!

向AI问一下细节

免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。

AI