微信分享连接带图,微信卡片分享,报错config:invalid signature

摘录

https://www.yudouyudou.com/jiaochengheji/wangzhanjianshe/1237.html

当开发微信时需要做特定的页面做分享时,根据官方提供的jssdk.php文件创建的签名数据包调试时,大家碰到的最多的错误而且解决最麻烦的大概就是signature错误了。

一般出现这个错误多半是签名获取失败,而造成签名获取失败的原因各种各种,余斗在开发的时候也遇到过这种情况,搜索了不少网上教程,解决了自己的问题。接下来,余斗将这些解决方法统一整理列出来,希望可以帮到大家:

1、APPID和APPSECRET填错

这个错误可以到官方的调试页面获取access_token看看是否是正确,点击获取获取access_token

根据返回的结果可以判断页面内的APPID和APPSECRET有没有出错,没有出错的话可以点击获取jsapi_ticket

利用前面拿到的access_token 采用http GET方式请求获得jsapi_ticket,如果出错的话会返回对应的说明。

点击进行确认签名算法校验

点击查看全局返回码说明

2、超过了每日的access_token获取上限

官方限定每日2000次请求,所以如果没有缓存access_token的话,还是比较容易过限的。

3、查看微信公共号状态是否不正常

比如验证过期了,被封禁了等。

4、确认config中nonceStr

js中驼峰标准大写S, timestamp与用以签名中的对应noncestr, timestamp一致。

5、确认url是页面完整的url

请在当前页面alert(location.href.split('#')[0])确认,包括'http(s)://'部分,以及'?'后面的GET参数部分,但不包括'#'hash后面的部分,这里在文章《静态页面实现微信分享带缩略图、标题和描述》最后已做说明,大家可以自行修改好。

6、配置curl是否使用ssl的带证书(https协议)访问开关

找到官方提供的jssdk.php,找到代码:

  curl_setopt($curl, CURLOPT_SSL_VERIFYPEER, true);
  curl_setopt($curl, CURLOPT_SSL_VERIFYHOST, true);

 将true改为false,因为一般我们是没有安装证书的(https协议),所以将true改为false就好,反之,如果网站安装了证书,则将false改为true。

7、将网站所在服务器IP地址加入白名单

8、反向代理问题

如果以上查验绝没有解决问题,则查看下自己的服务器是否反向代理没有设置好,nginx配置反向代理代码:

proxy_set_header Host $http_host;

以上,就是摘录别人的,我们现在搞下我们自己的问题,或者说的自己遇到的问题 


正文

我按照上文,全部检查了一边,发现没有问题啊,但是一直报错

 

 检查

第一步:检查了公众号的 :公众号设置>功能设置>JS接口安全域名

第二步:检查了公众号的 :开发>基本配置>公众号开发信息>JS接口安全域名

发没问题啊,该做的都做了。

直到最后,实在没辙,因为这个问题已经耗我了1天1夜了,

打电话求助,无果;

qq求助,没人回;

【意淫阶段】

微信求助,有个“老者”回了我“老夫正好有一套完善的代码,只需50两黄金,方可换之”

我闻言连忙,眼疾手快的发了一个5两黄金红包,紧接着就是一句“感谢老哥”,一气呵成。

5分钟后,

老者缓缓道:“你的URL不对,因为微信会给URL带上参数”

我听后,就在项目上是一顿狂秀,写下了二句代码

var  url=location.href;
alert(location.href.split('#')[0])
alert(url)

我的原地址:

http://***/index3.asp

然后,微信打开 

竟然多了【?&from=singlemessage】

重新,获取URL 并且传递给后端后,还是提示【config:invalid signature】

解决

 <script>
    var  url=location.href;
 alert(location.href.split('#')[0])
 alert(url)
    $.ajax({
       type : "get",
        url : "http://.../cp_con.asp?geturl="+url,  
        success : function(data){ 
		data=JSON.parse(data); 
            wx.config({
                debug: false,
                appId: data.getAppId,
                timestamp: data.timestamp,
                nonceStr: data.nonceStr,
                signature: data.signature,
                jsApiList: [
                    'onMenuShareTimeline',
                    'onMenuShareAppMessage',
                    'onMenuShareQQ',
                    'onMenuShareWeibo',
                    'onMenuShareQZone'
 
                ]
            });
        },
        error:function(data){
            alert("连接失败!");
        }
    });
 
    wx.ready(function () {
        var shareData = {
            title: '这是分享标题',
            desc: '这是分享摘要',
            link: url,
            imgUrl: 'http:/.../logo.jpg'
        };
 
        wx.onMenuShareAppMessage(shareData);//分享给好友
        wx.onMenuShareTimeline(shareData);//分享到朋友圈
        wx.onMenuShareQQ(shareData);//分享给手机QQ
        wx.onMenuShareWeibo(shareData);//分享腾讯微博
        wx.onMenuShareQZone(shareData);//分享到QQ空间  
    });
    wx.error(function (res) {
        alert(res.errMsg);//错误提示
    });
</script>

最终发现,如果是get请求的话,我请求的url是这样的

cp_con.asp?geturl=http://.../index3.asp&from=singlemessage

那么后端在获取geturl参数的时候就只能获取成这样的

http://.../index3.asp

他把

from=singlemessag

也看成了参数;原url和签名的url不一致,造成了

微信报错【config:invalid signature

采用post请求就可以解决这个问题了

采用post请求

		 <script>
    var  url=location.href;
 alert(location.href.split('#')[0])
 alert(url)
    $.ajax({
      type : "POST",
        url : "http://.../cp_con.asp", 
		data:{geturl:url},
        success : function(data){ 
		data=JSON.parse(data); 
            wx.config({
                debug: false,
                appId: data.getAppId,
                timestamp: data.timestamp,
                nonceStr: data.nonceStr,
                signature: data.signature,
                jsApiList: [
                    'onMenuShareTimeline',
                    'onMenuShareAppMessage',
                    'onMenuShareQQ',
                    'onMenuShareWeibo',
                    'onMenuShareQZone'
 
                ]
            });
        },
        error:function(data){
            alert("连接失败!");
        }
    });
 
    wx.ready(function () {
        var shareData = {
            title: '这是分享3标题',
            desc: '这是分享3摘要',
            link: url,
            imgUrl: 'http://.../logo.jpg'
        };
 
        wx.onMenuShareAppMessage(shareData);//分享给好友
        wx.onMenuShareTimeline(shareData);//分享到朋友圈
        wx.onMenuShareQQ(shareData);//分享给手机QQ
        wx.onMenuShareWeibo(shareData);//分享腾讯微博
        wx.onMenuShareQZone(shareData);//分享到QQ空间  
    });
    wx.error(function (res) {
        alert(res.errMsg);//错误提示
    });
</script>

但是,发现有时候,分享后的那个图片还是不显示,

经过测试后发现,如果在图片未加载完成的时候是不会显示的,无奈,只好加了句代码,放到了文件头,这样加载网站的时候,就会优先加载这个图片了

<img src="http://.../logo.jpg" width="0" height="0"/> 

 最后,很重要

一定要引用JQuery文件微信js文件

<script src="http://res.wx.qq.com/open/js/jweixin-1.6.0.js"></script>
<script src="http://.../jquery.min.js"></script>
已标记关键词 清除标记
相关推荐
©️2020 CSDN 皮肤主题: 大白 设计师:CSDN官方博客 返回首页
实付 9.90元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值