vue spa history模式 jssdk注入 `invalid signature`解决

最新推荐文章于 2022-12-02 17:30:42 发布
最新推荐文章于 2022-12-02 17:30:42 发布
阅读量1.1k 收藏
点赞数 2
分类专栏： H5 项目实战经验 微信公众号 文章标签： vue.js html5 安卓
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_36131788/article/details/107665082
版权

需求

【首页】和【我的联系人】页面都对当前用户进行定位，于是通过JS SDK中的wx.getLocation()拿到用户定位。
【首页】入口：直接默认进入
【我的联系人页】入口：由首页进入

项目技术背景

vue h5 spa history模式的项目

初步思路

在index.vue中全局wx.config进行的SDK的配置服务

IOS表现

【首页】、【我的联系人】都能拿到用户定位，SDK配置正常

Andorid 表现

【首页】：能拿到用户定位，SDK配置正常
【我的联系人】：

  • 当由【首页】进入到【我的联系人】页时，无法拿到用户定位，SDK配置无效，！！报错：invalid signature
  • 当再次刷新当前页面-【我的联系人】页面，可以拿到用户定位，SDK配置正常，无报错！

问题分析

微信开发者文档
由于安卓对H5 histroy模式支持的不太友好导致出现的问题！！

Android：微信安卓版，每次切换路由，SPA的url是会变的，发起签名请求的url参数必须是当前页面的url(不是最初进入页面时的)
IOS：微信IOS版，每次切换路由，SPA的url是不会变的，发起签名请求的url参数必须是当前页面的url(就是最初进入页面时的url)

解决方法

不在全局组件注入，在各自需要SDK的路由view页面, create钩子函数中，进行wx.config即可~

娃哈哈_
关注
  • 2
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
微信 jssdk 签名错误invalid signature的解决方法
10-17
主要介绍了微信 jssdk 签名错误invalid signature的解决方法，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
vue中单页面SPA项目和History模式，导致微信网页签名失败，invalid signature
qq_27876841的博客
05-08 1016
vue项目中为了去掉路径中的#号，导致微信签名失败，原因分析：history模式副带的页面刷新问题和iOS、Android获取url方式不同的兼容问题，在vue-router模式为history的情况下, 由于IOS微信浏览器在验证微信jssdk签名时,需要的URL是第一次进入该应用时的URL, 并不是当前页面的URL, 所以这里需要针对IOS微信浏览器作特殊处理； 从 A页面，跳转到B页面，由于没有刷新，B调用 JSSDK的 内容，由于vue-router切换的时候 都是操作的浏览器历史记录，真实u.
【Exception】微信JS-SDK接入报错： invalid signature 签名无效 解决思路
HaHa_Sir的博客
03-01 9640
【Exception】微信JS-SDK接入报错： invalid signature 签名无效 解决思路 一、问题描述 1、接入微信 JS-SDK实现分享链接时，显示公司LOGO，便于品牌效应传播。 2、遇到一个问题： JS-SDK 签名一直无法通过，按照 【附录5-常见错误及解决方法】逐一排除后，且本地加密后签名和【微信 JS 接口签名校验工具】得出的结果一致的情况下，仍然报错： "...
vue history 微信jssdk授权失败解决办法
weixin_30538029的博客
03-05 1357
bug再现： 前提保证后端签名都正确，我的是正确的，前端时不时会出现授权失败的情况。 IOS微信访问vue history模式的页面， A页面，需要微信授权，调用jssdk使用扫描二维码接口，打开方式：直接从url进入或者别的页面进入。 B页面，支付页，打开方式：需要从别的页面进入。 直接访问A页面：微信授权正常扫一扫正常使用。从别的页面进入A页面，授权失败，提示【invalid sig...
wx.config 报错 invalid signature
baojianhuangbo的专栏
01-07 1004
测试的时候在主域名下，一直报invalid signature 死活过不去，无奈挨个参数检查，在用微信工具检查计算签名的方法也没问题。最终发现在主域名下的时候 计算签名的url不能写成http://www.xxxx.com 而要写成http://www.xxxx.com/  真是一个悲伤的故事...
VUE解决微信签名及SPA微信invalid signature问题(完美处理)
10-17
主要介绍了VUE解决微信签名及SPA微信invalid signature问题(完美处理)，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
Vue项目History模式404问题解决方法
10-17
本文主要解决Vue项目使用History模式发布到服务器Nginx上刷新页面404问题。小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
vue.js中使用微信扫一扫解决invalid signature问题(完美解决)
10-15
主要介绍了vue.js中使用微信扫一扫解决invalid signature问题(推荐),本文通过实例代码给出解决方法，代码简单易懂非常不错，具有一定的参考借鉴价值，需要的朋友可以参考下
Vue路由history模式解决404问题的几种方法
12-10
vue-router 默认是hash模式，使用url的hash来模拟一个完整的url，当url改变的时候，页面不会重新加载。但是如果我们不想hash这种以#号结尾的路径时候的话，我们可以使用路由的history的模式。比如如下网址：使用hash...
微信调用时，提示invalid signature，签名错误解决办法
热门推荐
zhh0310235的博客
10-31 2万+
微信公众要对信息安全要求较高，所以开发前有多项关于服务器信息的配置。这里就拿测试号进行说明。 一、接口配置信息配置，主要用于自己服务器确定信息来自微信服务器。按照接入接口教程还是比较容易完成的。 二、JS接口安全域名配置，微信服务器只响应配置的域名服务器进行JS接口调用，并且避免有人截断伪造信息，还需要利用微信公众号的方法进行签名认证。 三、配置好两边的服务器后，也会出现签名无效。 ...
微信js sdk invalid signature签名错误问题的解决方法分析
10-17
主要介绍了微信js sdk invalid signature签名错误问题的解决方法,结合实例形式分析了微信签名错误问题相关解决方法,需要的朋友可以参考下
vue3实现微信公众号一次性订阅消息+ios和Android的63002 config:invalid signature问题
weixin_44622464的博客
07-06 535
微信开放文档https://developers.weixin.qq.com/doc/offiaccount/OA_Web_Apps/Wechat_Open_Tag.html#23 微信 JS 接口签名校验工具 首先使用官方文档加入ip白名单，域名之类的做完之后的代码（ 可查看 微信公众号订阅通知（go+vue） https://blog.csdn.net/m0_37592532/article/details/116066277 微信订阅消息接入 使用开放标签 在 H5网页设置订阅通知组件 https:/
ios使用wx.getLocation获取位置报错‘getLocation:invalid signature‘
星星月亮的博客
12-02 2998
ios调用wx.getLocation 方法首次无法成功问题解决方法
vue.js中使用微信扫一扫,解决invalid signature问题
S筱潇S四维Smile
03-28 2870
1、点击按钮，实现微信扫一扫功能： <template> <a class="btn" @click="scan">扫一扫</a> </template> 2、使用config接口注入配置信息，wx.config调用方法如下： （其中appId,timestamp,nonceStr,signature必须从后台获取，传参当前网页的UR...
微信网页开发JSSDK获取地理位置wx.getLocation的使用，及开发时遇到的问题（invalid signature）
weixin_44356647的博客
05-06 1万+
最近做的一个微信网页项目，用的是vue，但因为项目中需要实现定位，获取用户的经纬度，因此使用了微信公众号的JSSDK中的wx.getLocation，具体可看官方文档 https://developers.weixin.qq.com/doc/offiaccount/OA_Web_Apps/JS-SDK.html. 1、首先安装 jssdk npm install weixin-js-sdk --s...
微信js sdk invalid signature
a1008223的专栏
06-14 136
1. 检查签名是否过期 2.检查 url 是否js 使用 encodeURI, 改为 encodeURICommpent. 参数使用 json，因为授权转发只支持一个参数。 var last= encodeURIComponent(JSON.stringify(parma)); var pkurl= 'pkSearch.htm?allParameter='+last ;...
移动端使用 js sdk 在ios上一直报invalid signature的问题解决
视力的博客
07-08 633
wx.getLocation ios invalid signature
微信公众平台开发，微信JS-SDK对接invalid signature报错解决
intersting的博客
08-31 3246
笔者在做微信JS-SDK学习过程中，用微信打开页面时总是弹出invalid signature的errmsg，笔者在开发文档和网友提供的解决方法中苦苦搜寻，好在功夫不负有心人，经历一上午的苦苦挣扎总结出如下解决方案
微信公众号之:JSSDK接入以及invalid signature等常见错误问题
weixin_41049850的博客
08-07 2737
最近在搞微信公众号开发，进行到网页开发部分被坑了一天，最坑的问题就是invalid signature，而网上大部分解答这个问题的都没有说清楚，都直接丢文档。博主认为这样很不好。本文是博主结合自身遇到的问题所写，整个流程跟问题都很详细，虽然排版可能有点不好。但是绝对对遇到类似问题的朋友有所帮助。请认真看下去 一、绑定JS接口安全域名 生产号绑定方法：登录微信公众平台进入“公众号设置”的“功能设...
java解决vue的history模式下刷新页面进入404
最新发布
09-09
在使用Vue的history模式时，当页面进行刷新时，会出现404错误。这是因为Vue的history模式使用的是HTML5的history API，而...这样，通过Java进行相应的配置和处理，就可以解决Vue在history模式下刷新页面进入404的问题。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值