微信分享JSSDK-invalid signature签名错误的解决方案

核对官方步骤,确认签名算法。

  • 确认签名算法正确,可用 http://mp.weixin.qq.com/debug/cgi-bin/sandbox?t=jsapisign 页面工具进行校验。
  • 确认config中nonceStr(js中驼峰标准大写S), timestamp与用以签名中的对应noncestr, timestamp一致。
  • 确认url是页面完整的url(请在当前页面alert(location.href.split('#')[0])确认),包括'http(s)://'部分,以及'?'后面的GET参数部分,但不包括'#'hash后面的部分。
  • 确认 config 中的 appid 与用来获取 jsapi_ticket 的 appid 一致。
  • 确保一定缓存access_token和jsapi_ticket。
  • 确保你获取用来签名的url是动态获取的,动态页面可参见实例代码中php的实现方式。如果是html的静态页面在前端通过ajax将url传到后台签名,前端需要用js获取当前页面除去'#'hash部分的链接(可用location.href.split('#')[0]获取,而且需要encodeURIComponent,后台decodeURIComponent解码),因为页面一旦分享,微信客户端会在你的链接末尾加入其它参数,如果不是动态获取当前链接,将导致分享后的页面签名失败。

签名是正确,上面的步骤还没能解决你的问题(invalid signature)那就用是url的问题,注意:微信公众号必须配置了你调试的安全域名(可以配置二级域名:xxx.com,而不用配置多个a.xxx.com/b.xxx.com等)。

原因:微信分享时候会给你当前页面添加多个参数,你sha1时候必须保证url地址是微信给你加了参数之后的地址,这样才不会报config:invalid signature.

解决方案:sha1之前url必须是解码之后的正常的肉眼直接能识别的url,如果你用的是静态页面,在你配置wx.config之前,先通过encodeURIComponent(location.href.split('#')[0])把当前url编码传递到后台,后台通过decodeURIComponent解码,核心代码如下:

前台html页面,编码传递url:

jQuery.post("/xxx", {"url": encodeURIComponent(window.location.href.split('#')[0]),"t": new Date().getTime()}, function (result) {
    if (result.errno != 0) {
        alert("您当前的网络不稳定请稍后再试!");
        return;
    }
    var shareUrl = result.data.url;
    wx.config({
        debug: true, // 开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印。
        appId: 'xxx', // 必填,公众号的唯一标识
        timestamp: result.data.timestamp, // 必填,生成签名的时间戳
        nonceStr: result.data.nonceStr, // 必填,生成签名的随机串
        signature: result.data.signature,// 必填,签名,见附录1
        jsApiList: ['onMenuShareAppMessage','onMenuShareTimeline','onMenuShareQQ','onMenuShareWeibo','onMenuShareQZone'] // 必填,需要使用的JS接口列表,所有JS接口列表见附录2
    });

后台代码:

let url = decodeURIComponent( this.post().url);  //重点,解码前台传递url
//当前时间戳
let timestamp = parseInt( new Date().getTime()/1000);
//随机字符串
let nonceStr = Math.random().toString(36).substr(2,16);

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏程序员宝库

IntelliJ IDEA 教程设置讲解

IntelliJ在业界被公认为最好的java开发工具之一,尤其在智能代码助手、代码自动提示、重构、J2EE支持、Ant、JUnit、CVS整合、代码审查、 创新...

1284
来自专栏林德熙的博客

win10 uwp Markdown 输入需求文件文件格式文件类保存设置界面拼写检查云创建Html创建pdfGit

输入标题方式可以使用快捷键,也可以手动输入“#”,一个“#” 表示一级标题,两个个“#” 表示二级标题,三个“#” 表示三级标题,其他表示多级标题。

1053
来自专栏知晓程序

开发 | 只需 10 分钟,教你做一款查询类小程序

在全局配置文件中,我们定义了一个页面。保存之后,将会自动生成 index 页面的基本目录。

1113
来自专栏程序员互动联盟

【答疑释惑】Android多国语言实现原理

先来看一下网友的问题: ? 网友们问的问题是android中布局文件中android:text="hello_world"和 android:text="@s...

32110
来自专栏vue学习

34、vuex初探(二)

首先我们讲在组件中分发 Action,使用的是dispatch这个方法。也就是说如果你想在组件中改变vuex仓库的值,可以使用这个方法。

1592
来自专栏程序你好

如何用7个简单的步骤,在Firefox开发工具中调试JavaScript

本文将着重于在Firefox的开发工具中调试JavaScript代码。Firefox中的开发工具是一个非常强大的工具,可以加速您的bug查找和修复过程!

1166
来自专栏西安-晁州

nodejs初印象

初学Nodejs,特意在此记录学习过程,算是对这段时间的一个summary吧,相互勉励,共同进步嘛,Now Begin: 1、什么是nodejs nodejs ...

2230
来自专栏北京马哥教育

成为 Linux 终端高手的七种武器

Linux 终端不仅是一个键入命令的地方。如若你能熟谙这些基础技巧,那么你会在绝大多数 Linux 发行版的默认使用的 Bash shell中游刃有余。 这是...

2898
来自专栏JetpropelledSnake

Python入门之PyCharm的快捷键与常用设置和扩展(Mac系统)

1. 快捷键 2 . PyCharm的常用设置和扩展 -----------------------------------------------------...

1.4K8
来自专栏计算机编程

Vue 单文件组件详解<1>--简单上手

vue 的webpack的结构非常简单,简单的一眼就可以知道每个目录下是干啥的,在components目录下就有属于我们想要详细解析的内容,这两个vue文件即为...

951

扫码关注云+社区

领取腾讯云代金券