找回密码
 立即注册

QQ登录

只需一步,快速开始

[微信] 微信JSSDK分享,解决config:invalid signature问题

[复制链接]
查看: 1174|回复: 1
最佳答案
0 

51

主题

181

帖子

5105

积分

S1

积分
5105
 楼主| 发表于 2018-10-26 19:17:05 | 显示全部楼层 |阅读模式
微信JSSDK分享可以实现自己的网页在微信自定义图标,标题,还有描述,还可以分享到朋友圈,分享到微信群,分享给朋友等操作。


微信图片_20181025204729.jpg

上图就是,左侧是分享到朋友圈,右侧是分享到微信群。
很多开发者下载官方的demo进行开发,最后debug的时候,显示的是config:invalid signature
,这个原因其实很有可能是签名不一致。
我们需要保持签名一致,才能完整注入这个权限的。
一般,签名不一致的是因为access_token生成的时候,获取jsapi_ticket的时候有问题造成的,我一开始弄了好久都没搞对,后来一个个尝试。
我先尝试生成的一个jsapi_ticket,写死在页面,发现没问题,然后再尝试获取access_token写死在页面,也没问题,但是直接在页面上生成access_token再调用就不行。
我就另外写了一个access.php进行生成access_token,把access_token存入数据库,搞一个定时任务,每隔1小时生成一个新的access_token,因为access_token仅有2小时有效期,而且每天最多调用2000次,所以我觉得存数据库是比较好的。
然后在分享页面取数据库的access_token就行了。
下面是生成access_token的代码
access.php
  1. <?php
  2. header("Content-type:text/html;charset=utf-8");
  3. //获取access_token
  4. $appId = '填写您的';
  5. $appSecret = '填写您的';
  6. $url = "https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=".$appId."&secret=".$appSecret;
  7. $ch = curl_init();//初始化curl
  8. curl_setopt($ch, CURLOPT_URL,$url); //要访问的地址
  9. curl_setopt($ch,CURLOPT_RETURNTRANSFER,1);
  10. curl_setopt($ch, CURLOPT_SSL_VERIFYPEER, false);//跳过证书验证
  11. curl_setopt($ch, CURLOPT_SSL_VERIFYHOST, false); // 从证书中检查SSL加密算法是否存在
  12. $data = json_decode(curl_exec($ch));
  13. $token = $data->access_token;

  14. //连接数据库
  15. $con = mysql_connect("数据库地址","数据库账号","数据库密码");
  16. mysql_select_db("数据库名", $con);
  17. mysql_query("INSERT INTO access_token (access_token) VALUES ('$token')");
  18. mysql_close($con);
  19. ?>
复制代码


下面是分享页面代码:
index.php
  1. <?php
  2. //获取jsapi_ticket
  3. function getjsapi_ticket(){

  4.   //获取微信access_token
  5.   //连接数据库
  6.   $con = mysql_connect("数据库地址","数据库账号","数据库密码");
  7.   mysql_select_db("数据库名", $con);
  8.   $result = mysql_query("SELECT access_token FROM access_token ORDER BY ID DESC LIMIT 1");
  9.   while($row = mysql_fetch_array($result)){
  10.     $token = $row["access_token"];
  11.   }

  12.   $access_token = $token;
  13.   $url = "https://api.weixin.qq.com/cgi-bin/ticket/getticket?type=jsapi&access_token={$access_token}";
  14.   $ch = curl_init();
  15.   curl_setopt($ch, CURLOPT_URL,$url);
  16.   curl_setopt($ch, CURLOPT_RETURNTRANSFER,1);
  17.   curl_setopt($ch, CURLOPT_SSL_VERIFYPEER,0);
  18.   $data = curl_exec($ch);
  19.   curl_close($ch);
  20.   $data = json_decode($data,true);
  21.   return $data['ticket'];
  22. }
  23.   
  24. // mysql_close($con);

  25. //默认生成16位随机数
  26. function createNonceStr($length = 16) {
  27.      $chars = "abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789";
  28.      $str = "";
  29.      for ($i = 0; $i < $length; $i++) {
  30.        $str .= substr($chars, mt_rand(0, strlen($chars) - 1), 1);
  31.      }
  32.      return $str;
  33.    }

  34. //获取要排序的signature相关代码
  35.   function getSignPackage() {
  36.     $jsapiTicket = getjsapi_ticket();
  37.     $url = "当前页面的URL";
  38.     $timestamp = time();
  39.     $nonceStr = createNonceStr();
  40.   
  41.     // 这里参数的顺序要按照 key 值 ASCII 码升序排序
  42.     $string = "jsapi_ticket=$jsapiTicket&noncestr=$nonceStr×tamp=$timestamp&url=$url";
  43.     $signature = sha1($string);
  44.     $signPackage = array(
  45.       "appId"     => 'ADDPID修改为您的',
  46.       "nonceStr"  => $nonceStr,
  47.       "timestamp" => $timestamp,
  48.       "url"       => $url,
  49.       "signature" => $signature
  50.     );
  51.     return $signPackage;
  52.   }
  53.   $signPackage = getSignPackage();
  54. ?>
  55. <html lang="en">
  56. <head>
  57. <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  58. <meta http-equiv="X-UA-Compatible" content="IE=edge">
  59. <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0" />
  60. <meta name="apple-mobile-web-app-capable" content="yes">
  61. <meta name="apple-mobile-web-app-status-bar-style" content="black">
  62. <meta name="format-detection" content="telephone=no">
  63. <title>微信分享DEMO</title>
  64. </head>
  65. <body>
  66. test
  67. </body>
  68. <script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>
  69. <script>
  70.   wx.config({
  71.     debug: true,
  72.     appId: '<?php echo $signPackage["appId"];?>',
  73.     timestamp: <?php echo $signPackage["timestamp"];?>,
  74.     nonceStr: '<?php echo $signPackage["nonceStr"];?>',
  75.     signature: '<?php echo $signPackage["signature"];?>',
  76.     jsApiList: [
  77.       // 所有要调用的 API 都要加到这个列表中
  78.       'onMenuShareTimeline',
  79.       'onMenuShareAppMessage'
  80.     ]
  81.   });


  82.   //分享到朋友圈
  83.   wx.ready(function () {
  84.       wx.onMenuShareTimeline({
  85.         title: '吾爱破解论坛,微信JSSDK分享学习',
  86.         link: "修改为当前JS接口安全域名下的页面的自定义URL",
  87.         imgUrl: 'http://wxpad.cn/editor/php/upload/20181025/1540469570441.png',
  88.         success: function (res) {
  89.           alert('已分享到朋友圈');
  90.         },
  91.         cancel: function (res) {
  92.           alert('已取消分享');
  93.         },
  94.         fail: function (res) {
  95.           alert(JSON.stringify(res));
  96.         }
  97.       })
  98.       
  99.           //分享给朋友
  100.       wx.onMenuShareAppMessage({
  101.             title: "吾爱破解论坛,微信JSSDK分享学习", // 分享标题
  102.             desc: "学破解,学技术,就来吾爱破解论坛!", // 分享描述
  103.             link: "修改为当前JS接口安全域名下的页面的自定义URL", // 分享链接
  104.             imgUrl: "http://wxpad.cn/editor/php/upload/20181025/1540469570441.png", // 分享图标
  105.             type: '', // 分享类型,music、video或link,不填默认为link
  106.             dataUrl: '', // 如果type是music或video,则要提供数据链接,默认为空
  107.             success: function () {
  108.                 // 用户确认分享后执行的回调函数
  109.             },
  110.             cancel: function () {
  111.                 // 用户取消分享后执行的回调函数
  112.             }
  113.         });

  114.   });

  115.   alert(location.href.split('#')[0])
  116. </script>
  117. </html>
复制代码


大概就这样就可以configk了
当然,开发过程中需要设置IP白名单,JS接口安全域名这些我就不多说了。
作者:TANKING
2018-10-25
http://likeyunba.com

回复

使用道具 举报

最佳答案
0 

0

主题

372

帖子

1万

积分

S2

积分
13453
发表于 2019-3-22 19:11:35 | 显示全部楼层
路过!!!!!!
回复

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则



www.henkuai.com—微信开发者的分享交流平台,专注微信开发生态。

天津市滨海新区
中新生态城中成大道生态建设公寓9号楼3层301

微信公众号

广告推广
QQ:805874290

市场合作
zhongcong@henkuai.com