宝哥软件园

微信jssdk签名错误无效签名解决方案

编辑:宝哥软件园 来源:互联网 时间:2021-08-27

几乎每一个为微信微信官方账号开发页面的工程师,在微信jssdk中都遇到过各种各样的错误,通常都是权限被拒绝,就像这样:

通常他们会建议您打开调试选项,例如:

微信. config({ debug: true,appId: appId,timestamp: timestamp,nonceStr: nonceStr,signature: signature,jsApiList: ['scanQRCode'],});结果,你又遇到了无效签名。像这样:

签名错了,是什么意思?但这个签名来自后端。我怎么知道为什么是错的?后端采用标准算法,不会错。

上网查各种教程,或者微信官网,他们总是告诉你查签名算法,但是一点用都没有!

在这90%的情况下,原因只有一个:你用来计算签名的URL地址是错误的,这与算法无关,所以你不必浪费时间去看任何签名算法。

微信要求如果我们需要在页面中调用微信的一个方法,就必须使用这个页面的URL地址来获取签名。听起来很容易理解,但实际上网址包含很多部分,包括问号和#。#你要做的就是去掉之前的部分#。例如,您的网址是这样的:https://www.abc.com/abc.html? Abc=def # XYZ,那么您用来计算签名的网址不能是https://www.abc.com/abc.html或https://www.abc.com/abc.html? Abc=def # XYZ,而只能是https://www.abc.com/abc.html? Abc=def .

如何获取当前页面的URL地址?这很简单:

让we chaturl=window . location . href . split(' # ')[0];但你觉得结束了吗?太天真了。你的页面还是不能正常使用微信功能。

因为:微信嵌入式浏览器的性能在iOS和安卓下是不一样的。

在Android下,可以调用上面的方法。但是在iOS下,签名还是失败了!因为在iOS下,微信需要你传递的是入口URL,而不是当前页面的URL!

比如你从微信微信官方账号的一个菜单链接进入A页,然后从A页的一个链接跳转到B页,然后在B页得到你的签名,如果是安卓的话,应该用B页的URL地址得到,但是在iOS下,你也必须用A页的URL地址才能得到,否则签名还是会失败!

知道了原因,有很多解决办法。

首先,我们可以在A页的入口添加这个判断:

if(navigator . user agent . indexof(' iPhone ')!==-1) { window .微信图=window . location“”;}然后,在B页需要调用签名的地方,加上这个判断:

让we chaturl=window . location . href . split(' # ')[0];if (window.wechaturl!==undefined) {微信公众号=window .微信公众号;}这样,我们就可以有效区分iOS和安卓。但问题是,在iOS下,如果我的另一个菜单项是B页,我从B页跳转到A页,然后我的入口链接被强制变成A页,仍然会造成签名失败的错误。

因此,我们还需要在微信微信官方账号的每个入口菜单链接中添加一个特殊的参数,比如微信=1,变成这样:https://www.abc.com/abc.html? ABC=def微信=1,

然后我们加上另一层判断,变成这样:

if(navigator . user agent . indexof(' iPhone ')!==-1) { if (this。$route.query .微信!==未定义此。$route.query .微信==='1') { window .微信图=window . location ";}}我这里用vue,但是原理是一样的。只有当我检测到微信参数时,我才认为当前页面是入口页面。如果没有检测到,则没有必要强制将其作为入口页。

这似乎解决了微信签名失败的问题。

然而,我们遇到了另一种情况:微信小程序中嵌入网页视图的网页也报告了安卓系统中的权限被拒绝和签名无效的错误。但是,根据以上经验,我们诊断出错误的根源是URL条目地址。果然,在安卓系统中,用入口地址成功获取签名,用当前地址失败。因此,我们在门户页面上添加了另一个判断:

if(navigator . user agent . indexof(' miniProgram ')!==-1) { window .微信图=window . location“”;}此时,各种签名错误都可以视为全部解决了。

以上就是本文的全部内容。希望对大家的学习有帮助,支持我们。

更多资讯
游戏推荐
更多+