微信 jssdk 签名错误invalid signature 问题

一、官方概述

微信JS-SDK是微信公众平台 面向网页开发者提供的基于微信内的网页开发工具包。

借助微信实现的功能有一下两种

• 手机系统的能力：拍照、选图、语音、位置等；
• 微信特有的能力：微信分享、扫一扫、卡券、支付等；

二、使用方法

一般签名算法是后端来操作的，前端主要是使用后端提供的接口、传参(我们项目---主要是传需要使用微信某方法所在页面的URL即可)，获取签名等，通过config接口注入权限验证配置，详情请查看：官网

wx.config({
  appId: '', // 必填，公众号的唯一标识；接口取得
  timestamp: , // 必填，生成签名的时间戳；接口取得
  nonceStr: '', // 必填，生成签名的随机串；接口取得
  signature: '',// 必填，签名；接口取得
  jsApiList: [] // 必填，需要使用的JS接口列表；按需自取
});

三、签名错误invalid signature 问题

开始出现这个问题很摸不到头脑，随着不断的深入的了解才发现产生的原因。

微信要求：如果我们需要在页面中调用微信的某个方法，则必须用这个页面的URL地址获取签名。

所以请确认：url是页面完整的url(请在当前页面alert(location.href.split('#')[0])确认)，包括'http(s)://'部分，以及'？'后面的GET参数部分,但不包括'#'hash后面的部分。

例如：你的URL地址是这样：https://www.abc.com/abc.html?abc=def#xyz，那么你用于计算签名的URL地址不能是https://www.abc.com/abc.html，也不能https://www.abc.com/abc.html?abc=def#xyz，而必须只能是https://www.abc.com/abc.html?abc=def。

四、ios与安卓的坑

如果发现URL获取完整但是依旧会报错，就要注意了！！！！

微信内嵌浏览器在iOS和安卓下的表现不一样。安卓系统你可以使用当前使用微信方法页面的URL，但在iOS下，微信需要你传递的是入口URL，而不是当前页面的URL！

就那我遇到的问题解释吧

首先进入的是登陆页面：http://www.test.com/h5login，然后登陆成功后跳转到http://www.test.com/h5Info 页面（此页面调用微信方法），在安卓系统下用的是http://www.test.com/h5Info，但在ios下用的是http://www.test.com/h5login，所以此时你在用http://www.test.com/h5Info计算签名就会报错。

所以根据自己的实际情况区分一下即可。

（完）