vue项目在history模式下ios调用wxapi失败问题记录

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了vue项目在history模式下ios调用wxapi失败问题记录相关的知识,希望对你有一定的参考价值。

参考技术A 1、通过百度得知,在vue项目中,push的跳转不能被写入ios微信浏览器的地址栏,需要将push跳转改为 window.loaction.href 跳转 , window.loaction.href 跳转才能改变地址栏的变化,才能签名成功。

2、更改跳转方式后,仍然没有解决问题。通过微信右上角复制的页面链接和使用 location.href 获取的链接对比,发现二者并不一致。 location.href 获取的链接多了一个参数: VNK=1933df22 ,这个参数是因为使用了 vue-navigation 插件自动加上的。

3、最后的解决方式如下,通过在 beforeRouteEnter 中判断进入的路由和当前 location.search 是否都含有 VNK 参数,如果不一致,则重写地址栏

项目nginx部署时,前端用history模式,在浏览器浏览,页面空白

参考技术A 原因:vue项目,history模式下,后台nginx未进行相关配置.以下以项目名称shop为(nginx根目录下的shop文件夹下放的是项目)

原因:项目使用的vue的history模式,但是后端未做任何相关配置

解决方案:修改成了hash模式或者后端做配置

原因:走的网关,可能网关被禁用了,导致接口全部报错,无响应

以上是关于vue项目在history模式下ios调用wxapi失败问题记录的主要内容,如果未能解决你的问题,请参考以下文章

Vue项目history模式下nginx如何配置

vue3 history模式下 子路由刷新引入文件找不到

vue路由在多级页面下,页面刷新空白(history模式)

vue项目history模式下微信分享相关问题

Vue-cli创建项目从单页面到多页面2-history模式

vue history模式下出现空白页情况