首页
所有分类
TAGS
文字工具 EMOJI BIBLE
编程 PHP

微信公众平台开发教程②微信端分享功能图文详解

Posted in PHP onApril 10, 2019

本文实例讲述了微信公众平台微信端分享功能。分享给大家供大家参考，具体如下：

背景

    初次尝试微信公众号的开发，对于学习方法的探索都是来源于网上的博客、问答，对于参差不齐的信息，自己也是有苦说不出，抽出一点时间写点文章，既是对自己的学习总结，也希望给予同是菜鸟的小白一点帮助。

    今天想添加微信分享的功能，如果不进行自定义设计，那么当我们点击分享朋友圈、好友或者QQ好友、空间时，默认的标题就是<title>标签中的信息，而显示的描述信息就是链接，图片多是默认为页面中显示的第一张图片，显然这样的处理是不合理的，所以需要查询开发文档进行编码设计。

操作步骤：

一.参考微信公众号开发文档

【1】.登录微信公众号

      打开 “开发者工具->开发者文档->微信网页开发->微信JS-SDK说明文档”，找到对应的位置，首先要了解官方的需求说明才能进行下一步的开发。
        微信公众平台开发教程②微信端分享功能图文详解

【2】.建议详细参考文档后再考虑代码的编写

      提示：下拉上图中的网页最下端，下载官方提供的参考demo。本文的最后我会提供一份稍作修改的仅针对于php的实现代码，可作参考。
        微信公众平台开发教程②微信端分享功能图文详解

二.代码实现（PHP）及部分问题引导

【1】.我提供的代码就是下图中的几个简单文件

      主要来源于微信公众号的开发文档，上面提到过一次。其中，我们操作的分享页面代码只需参考 sharePage.php就好，对于官方的实现可以去阅读其他文件，毕竟我们实现功能只需导入文件，调用所提供类及方法就好。
        微信公众平台开发教程②微信端分享功能图文详解

【2】.在此提供 sharePage.php 简单代码，以便参考讲解。

      其中提出几点需要注意的是： 

（1）.需要提供 $appid, $secret 

（2）.代码中需要引用微信端提供的js文件<script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script> ，当然也可以下载其源代码，放于本地链接获取就可以。 

（3）.保证 wx.config 的信息配置的正确，debug如果为true可以提示操作的过程，测试没有问题后可以改为false,这样才是合理的操作，另外jsApiList中要补全自己需要的功能 

（4）.之前我把分享功能的代码写在 wx.config 平级中无法实现，之后测试发现应该写在wx.reday(function（）)中，具体的代码模式都应该参考开发文档。 

<?php
require_once "jssdk.php";

//获取到网页授权的access_token
$appid = "wx36xxxxxxxxxx199";// 输入公众号、服务号、或者测试号的appid 
$secret = "9caxxxxxxxxxxxxxxxxxx8a2";// 输入公众号、服务号、或者测试号的 secret


$jssdk = new JSSDK($appid, $secret);
$signPackage = $jssdk->GetSignPackage();

//此处用于输出得到的数据 用来测试签名证书是否正确 
/*
echo ' appId:'. $signPackage["appId"].'<br/>';
echo ' jsapi_ticket:'. $signPackage["jsapiTicket"].'<br/>';
echo ' url:'. $signPackage["url"].'<br/>';
echo ' timestamp:'. $signPackage["timestamp"].'<br/>';
echo ' nonceStr:'. $signPackage["nonceStr"].'<br/>';
echo ' signature：'. $signPackage["signature"];
echo '<br/>';
echo '<br/>';
echo '<br/>';
exit;
*/

?>
<!DOCTYPE html>
<html lang="en">
<head>
 <meta charset="UTF-8">
 <title></title>
</head>
<body>
 Hello Hello Hello
</body>
<script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>
<script>
 /*
 * 注意：
 * 1. 所有的JS接口只能在公众号绑定的域名下调用，公众号开发者需要先登录微信公众平台进入“公众号设置”的“功能设置”里填写“JS接口安全域名”。
 * 2. 如果发现在 Android 不能分享自定义内容，请到官网下载最新的包覆盖安装，Android 自定义分享接口需升级至 6.0.2.58 版本及以上。
 * 3. 常见问题及完整 JS-SDK 文档地址：http://mp.weixin.qq.com/wiki/7/aaa137b55fb2e0456bf8dd9148dd613f.html
 *
 * 开发中遇到问题详见文档“附录5-常见错误及解决办法”解决，如仍未能解决可通过以下渠道反馈：
 * 邮箱地址：weixin-open@qq.com
 * 邮件主题：【微信JS-SDK反馈】具体问题
 * 邮件内容说明：用简明的语言描述问题所在，并交代清楚遇到该问题的场景，可附上截屏图片，微信团队会尽快处理你的反馈。
 */
 wx.config({
 debug: true,
 appId: '<?php echo $signPackage["appId"];?>',
 timestamp: <?php echo $signPackage["timestamp"];?>,
 nonceStr: '<?php echo $signPackage["nonceStr"];?>',
 signature: '<?php echo $signPackage["signature"];?>',
 jsApiList: [
  // 所有要调用的 API 都要加到这个列表中
  'checkJsApi',
  'onMenuShareTimeline',
  'onMenuShareAppMessage',
  'onMenuShareQQ',
  'onMenuShareWeibo',
  'onMenuShareQZone',
 ]
 });

 wx.ready(function () {
 // 在这里调用 API
 //获取“分享到朋友圈”按钮点击状态及自定义分享内容接口
 wx.onMenuShareTimeline({
  title: '快来!分享朋友圈', // 分享标题
  link: 'http://www.baidu.com', // 分享链接
  imgUrl: 'http://img1.3lian.com/img013/v2/4/d/101.jpg', // 分享图标
  success: function () {
  // 用户确认分享后执行的回调函数
  },
  cancel: function () {
  // 用户取消分享后执行的回调函数
  }
 });
 //获取“分享给朋友”按钮点击状态及自定义分享内容接口
 wx.onMenuShareAppMessage({
  title: ' 微信分享给朋友', // 分享标题
  desc: '描述一下，可是知道该咋描述你呢？', // 分享描述
  link: 'http://www.baidu.com', // 分享链接
  imgUrl: 'http://img1.3lian.com/img013/v2/4/d/101.jpg', // 分享图标
  type: 'link', // 分享类型,music、video或link，不填默认为link
  dataUrl: '', // 如果type是music或video，则要提供数据链接，默认为空
 });
 wx.onMenuShareQQ({
  title: 'QQ我要跳转到百度页面了啊！', // 分享标题
  desc: '描述一下，可是知道该咋描述你呢？', // 分享描述
  link: 'http://www.baidu.com', // 分享链接
  imgUrl: 'http://img1.3lian.com/img013/v2/4/d/101.jpg', // 分享图标
 });
 wx.onMenuShareQZone({
  title: 'QZone我要跳转到百度页面了啊！', // 分享标题
  desc: '描述一下，可是知道该咋描述你呢？', // 分享描述
  link: 'http://www.baidu.com', // 分享链接
  imgUrl: 'http://img1.3lian.com/img013/v2/4/d/101.jpg', // 分享图标
 });
 });
</script>
</html>
【3】.正常操作中，可能会有 “errMsg config:invalid signature" 签名错误

      可以参考博文  《微信js sdk invalid signature签名错误》，网上多数的建议是检查签名证书是否正确，用作者的话就是“确认签名算法正确，可用 http://mp.weixin.qq.com/debug/cgi-bin/sandbox?t=jsapisign 页面工具进行校验”。
       微信公众平台开发教程②微信端分享功能图文详解       对于需要填入的信息，可以从上文中打印出需要的信息，我做注释的那一部分信息，请参考。不过，普遍情况，这样的签名是没有问题的，可作为参考。

【4】.新发现一种情况

     原先一切正常的分享功能，突然变得无法显示分享时的链接、图片等，我将 wx.config 中的debug 设定为true继续报错“errMsg config:invalid signature"，并非签名证书的问题，我猜测应该是文档中一直提及的token或ticket缓存问题，个人打开之前导入的两个文件发现已经重新写入了值，但是我将其重新改为当初下载下来的文件放入服务器中覆盖，意外的发现可以重新获得正确的分享能力，不知哪一天又会出现问题，也希望好心的大牛告知一下。

【2016-7-14 补充】

      经测试发现，上文提及分享功能的失败，与token ，ticket 存储文件没有多大关系，因为如今无法重现 Bug，无语的是，发现当初开发者中心使用的测试号是被赋予了分享权限的，然而自己申请的订阅号，通过查看“接口权限”发现“未获得”分享权限。

        微信公众平台开发教程②微信端分享功能图文详解

      一般的服务号都是拥有分享权限的，获取需要开通什么来着，具体的可百度，我的问题是没有进入“公众号平台->公众号设置->功能设置”中填写“JS接口安全域名”，其中要求是备案过的域名，个人实验证明填写去掉“http://www”后的形如“beidou.com”的域名即可，便于限制诱导关注的情况出现。

      设置完成后可以查看上图中的“分享接口”，保证里面显现的是获得权限，然后再进行菜单栏的分享测试即可发现，正常进行。

【5】.我遇到过提示此处代码报错的问题

      参考网上资源介绍的多是与签名安全相关的信息，可自行百度，鉴于能力有限，暂时发现注释此处的代码可避免该问题的影响，等有时间再做深入解决。
     微信公众平台开发教程②微信端分享功能图文详解

【6】.最后的报错信息显示该处对于文件操作的权限不足的问题

      类似 “Warning: fopen(access_token.json) [function.fopen]: failed to open stream: Permission denied in jssdk.php "问题，可以参考此文的部分介绍。
     微信公众平台开发教程②微信端分享功能图文详解       值得一提的是该问题大多牵扯操作系统的权限分配，之前我用的是新浪SAE进行测试，后面得知SAE是无法由我们用户进行权限设定的，最后我选择了公司服务器，使用类似 “chmod -R 777 /home/mypackage ” 的命令进行对应文件的操作权限分配。

三.补充

1.出现问题，多参考别人的解决方法，可见有一个可以带你的前辈是多么重要 

2.自己探索问题的解决方法，然后做好笔记作为自己的经历回顾，虽然解决时间拉长，但成就感绝对比从别人口中听来分量重的多。 

3.在此我粘贴稍作修改后的代码，其实就是其中的大概几行的改动，为了配合上面签名的测试，所以需要参考，其中另外的两个文件没做改动，无需上传，公众号开发文档的最后就有 demo 文件，具体的请参照开发文档。      

<?php
class JSSDK {
 private $appId;
 private $appSecret;

 public function __construct($appId, $appSecret) {
 $this->appId = $appId;
 $this->appSecret = $appSecret;
 }

 public function getSignPackage() {
 $jsapiTicket = $this->getJsApiTicket();

 // 注意 URL 一定要动态获取，不能 hardcode.
 $protocol = (!empty($_SERVER['HTTPS']) && $_SERVER['HTTPS'] !== 'off' || $_SERVER['SERVER_PORT'] == 443) ? "https://" : "http://";
 $url = "$protocol$_SERVER[HTTP_HOST]$_SERVER[REQUEST_URI]";

 $timestamp = time();
 $nonceStr = $this->createNonceStr();

 // 这里参数的顺序要按照 key 值 ASCII 码升序排序
 $string = "jsapi_ticket=$jsapiTicket&noncestr=$nonceStr×tamp=$timestamp&url=$url";

 $signature = sha1($string);

 $signPackage = array(
 "appId" => $this->appId,
 "jsapiTicket" => $jsapiTicket,
 "nonceStr" => $nonceStr,
 "timestamp" => $timestamp,
 "url" => $url,
 "signature" => $signature,
 "rawString" => $string
 );
 return $signPackage;
 }

 private function createNonceStr($length = 16) {
 $chars = "abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789";
 $str = "";
 for ($i = 0; $i < $length; $i++) {
 $str .= substr($chars, mt_rand(0, strlen($chars) - 1), 1);
 }
 return $str;
 }

 private function getJsApiTicket() {
 // jsapi_ticket 应该全局存储与更新，以下代码以写入到文件中做示例
 $data = json_decode($this->get_php_file("jsapi_ticket.php"));
 if ($data->expire_time < time()) {
 $accessToken = $this->getAccessToken();
 // 如果是企业号用以下 URL 获取 ticket
 // $url = "https://qyapi.weixin.qq.com/cgi-bin/get_jsapi_ticket?access_token=$accessToken";
 $url = "https://api.weixin.qq.com/cgi-bin/ticket/getticket?type=jsapi&access_token=$accessToken";
 $res = json_decode($this->httpGet($url));
 $ticket = $res->ticket;
 if ($ticket) {
 $data->expire_time = time() + 7000;
 $data->jsapi_ticket = $ticket;
 $this->set_php_file("jsapi_ticket.php", json_encode($data));
 }
 } else {
 $ticket = $data->jsapi_ticket;
 }

 return $ticket;
 }

 private function getAccessToken() {
 // access_token 应该全局存储与更新，以下代码以写入到文件中做示例
 $data = json_decode($this->get_php_file("access_token.php"));
 if ($data->expire_time < time()) {
 // 如果是企业号用以下URL获取access_token
 // $url = "https://qyapi.weixin.qq.com/cgi-bin/gettoken?corpid=$this->appId&corpsecret=$this->appSecret";
 $url = "https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=$this->appId&secret=$this->appSecret";
 $res = json_decode($this->httpGet($url));
 $access_token = $res->access_token;
 if ($access_token) {
 $data->expire_time = time() + 7000;
 $data->access_token = $access_token;
 $this->set_php_file("access_token.php", json_encode($data));
 }
 } else {
 $access_token = $data->access_token;
 }
 return $access_token;
 }

 private function httpGet($url) {
 $curl = curl_init();
 curl_setopt($curl, CURLOPT_RETURNTRANSFER, true);
 curl_setopt($curl, CURLOPT_TIMEOUT, 500);
 // 为保证第三方服务器与微信服务器之间数据传输的安全性，所有微信接口采用https方式调用，必须使用下面2行代码打开ssl安全校验。
 // 如果在部署过程中代码在此处验证失败，请到 http://curl.haxx.se/ca/cacert.pem 下载新的证书判别文件。
 curl_setopt($curl, CURLOPT_SSL_VERIFYPEER, true);
 //curl_setopt($curl, CURLOPT_SSL_VERIFYHOST, true);
 curl_setopt($curl, CURLOPT_URL, $url);

 $res = curl_exec($curl);
 curl_close($curl);

 return $res;
 }

 private function get_php_file($filename) {
 return trim(substr(file_get_contents($filename), 15));
 }
 private function set_php_file($filename, $content) {
 $fp = fopen($filename, "w");
 fwrite($fp, "<?php exit();?>" . $content);
 fclose($fp);
 }
}

四、附录

    1.在此推荐参考一篇比较详细的 微信分享博文，向前辈致敬。   
    2.源代码之前存于360云盘共享
如今已经过期找不到了。其实参考文中的代码同时下载官方demo就能完全重现源代码。
    3.此处 推荐参考新篇： 微信公众平台开发教程微信开发集成类的使用 （包含微信分享功能）

希望本文所述对大家PHP程序设计有所帮助。

微信公众平台开发教程②微信端分享功能图文详解

- Author -

moTzxx

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

PHP 相关文章推荐
某大型网络公司应聘时的笔试题目附答案
Mar 27 PHP
jq的get传参数在utf-8中乱码问题的解决php版
Jul 23 PHP
PHP实现时间轴函数代码
Oct 08 PHP
PHP数据类型之布尔型的介绍
Apr 28 PHP
10 个经典PHP函数
Oct 17 PHP
PHP多个文件上传到服务器实例
Oct 29 PHP
PHP GD库生成图像的几个函数总结
Nov 19 PHP
php制作动态随机验证码
Feb 12 PHP
php实现数组纵向转横向并过滤重复值的方法分析
May 29 PHP
php基于环形链表解决约瑟夫环问题示例
Nov 07 PHP
php插入mysql数据返回id的方法
May 31 PHP
VSCode+PHPstudy配置PHP开发环境的步骤详解
Aug 20 PHP
ThinkPHP框架整合微信支付之刷卡模式图文详解
Apr 10 #PHP
laravel配置Redis多个库的实现方法
Apr 10 #PHP
在Ubuntu 18.04上安装PHP 7.3 7.2和7.0的方法
Apr 09 #PHP
微信公众号实现扫码获取微信用户信息（网页授权）
Apr 09 #PHP
ThinkPHP框架整合微信支付之Native 扫码支付模式二图文详解
Apr 09 #PHP
ThinkPHP框架整合微信支付之Native 扫码支付模式一图文详解
Apr 09 #PHP
ThinkPHP框架整合微信支付之JSAPI模式图文详解
Apr 09 #PHP
frg-100(1) 239军机(1) DE1107(3) AN-LP1(1) SONY600GR(1) DE1103(2) YAESU(1) DE1105(1) 根德5570(1) ICF-903L(1)
You might like
用PHP将数据导入到Foxmail
2006/10/09 PHP
php检测图片木马多进制编程实践
2013/04/11 PHP
实用的简单PHP分页集合包括使用方法
2013/10/21 PHP
ThinkPHP3.1新特性之动态设置自动完成和自动验证示例
2014/06/19 PHP
PHP curl模拟登录带验证码的网站
2015/11/30 PHP
PHP命令Command模式用法实例分析
2018/08/08 PHP
php-fpm.conf配置文件中文说明详解及重要参数说明
2018/10/10 PHP
ThinkPHP5.1+Ajax实现的无刷新分页功能示例
2020/02/10 PHP
gearman中worker常驻后台，导致MySQL server has gone away的解决方法
2020/02/27 PHP
JS.elementGetStyle(element, style)应用示例
2013/09/24 Javascript
js动态改变select选择变更option的index值示例
2014/07/10 Javascript
JQuery实现防止退格键返回的方法
2015/02/12 Javascript
浅谈javascript中的加减时间
2016/07/12 Javascript
输入法的回车与消息发送快捷键回车的冲突解决方法
2016/08/09 Javascript
微信小程序实现带刻度尺滑块功能
2017/03/29 Javascript
element-ui表格数据转换的示例代码
2018/08/24 Javascript
微信小程序实现单选功能
2018/10/30 Javascript
Node.js 如何利用异步提升任务处理速度
2019/01/07 Javascript
vue基于两个计算属性实现选中和全选功能示例
2019/02/08 Javascript
[03:24]CDEC.Y赛前采访 努力备战2016国际邀请赛中国区预选赛
2016/06/25 DOTA
介绍一款python类型检查工具pyright(推荐)
2019/07/03 Python
Python高级编程之消息队列(Queue)与进程池(Pool)实例详解
2019/11/01 Python
python 如何去除字符串头尾的多余符号
2019/11/19 Python
简单了解python数组的基本操作
2019/11/26 Python
利用pandas将非数值数据转换成数值的方式
2019/12/18 Python
pytorch torch.nn.AdaptiveAvgPool2d()自适应平均池化函数详解
2020/01/03 Python
基于python实现模拟数据结构模型
2020/06/12 Python
Python高阶函数与装饰器函数的深入讲解
2020/11/10 Python
Python关于拓扑排序知识点讲解
2021/01/04 Python
详解window.open被浏览器拦截的解决方案
2019/07/18 HTML / CSS
伦敦高级内衣品牌：Agent Provocateur（大内密探）
2016/08/23 全球购物
优秀员工个人的自我评价
2013/11/29 职场文书
应届毕业生自我鉴定范文
2013/12/27 职场文书
委托书怎样写
2014/08/30 职场文书
委托书英文
2015/01/28 职场文书
PyMongo 查询数据的实现
2021/06/28 Python