微信 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计算签名就会报错。

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

（完）