1. 程式人生 > >微信公眾號開發(四) -- 自定義分享樣式

微信公眾號開發(四) -- 自定義分享樣式

1.微信的分享介面呼叫其實相當於是重寫了個介面,自定義的是分享樣式
2.位置還是右上角的三個點點

分享樣式

首先獲取jssdk
因為我的token是儲存在資料庫裡的,所以只要appid和token
沒有的話需要加一步獲取token值

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

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

  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&timestamp=$timestamp&url=$url";

    $signature = sha1($string);

    $signPackage = array(
      "appId"     => $this->appId,
      "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() {
      $accessToken = $this->access_token;
      $url = "https://api.weixin.qq.com/cgi-bin/ticket/getticket?type=jsapi&access_token=$accessToken";
      $res = json_decode($this->httpGet($url));
      $ticket = $res->ticket;

    return $ticket;
  }

  private function httpGet($url) {
    $curl = curl_init();
    curl_setopt($curl, CURLOPT_RETURNTRANSFER, true);
    curl_setopt($curl, CURLOPT_TIMEOUT, 500);
    curl_setopt($curl, CURLOPT_SSL_VERIFYPEER, false);
    curl_setopt($curl, CURLOPT_SSL_VERIFYHOST, false);
    curl_setopt($curl, CURLOPT_URL, $url);

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

    return $res;
  }
}

呼叫分享介面
因為wx.ready相當於載入頁面的同時就已經載入了,一定放在最外面。
還是右上角三個點點分享

<?php
require('jssdk.php');
$wechat = $db->getRow("SELECT access_token,appid FROM `wechat`");//從資料庫獲取appid和token
$jssdk = new JSSDK($wechat['appid'], $wechat['access_token']);
$signPackage = $jssdk->GetSignPackage();
?>

<script>
wx.config({
    debug: false, //除錯是否開啟
    appId: '<?php echo $signPackage["appId"];?>',
    timestamp: '<?php echo $signPackage["timestamp"];?>',
    nonceStr: '<?php echo $signPackage["nonceStr"];?>',
    signature: '<?php echo $signPackage["signature"];?>',
    jsApiList: [
                'checkJsApi',
                'onMenuShareTimeline',//
                'onMenuShareAppMessage',
                'onMenuShareQQ',
                'onMenuShareWeibo'
                ]
        
  });
window.share_config = {
	     "share": {
	        "imgUrl": 'http://jiashijia.137oa.com/<?= $data['headerUrl'] ?>',//分享圖,預設當相對路徑處理,所以使用絕對路徑的的話,“http://”協議字首必須在。
	        "desc" : '<?= $data['valuation'] ?>',//摘要,如果分享到朋友圈的話,不顯示摘要。
	        "title" : '家事佳推薦:<?= $data['uname'] ?>',//分享卡片標題
	        "link": 'http://<?= $_SERVER[HTTP_HOST].$_SERVER[REQUEST_URI] ?>',//分享出去後的連結,這裡可以將連結設定為另一個頁面。
	        "success":function(){//分享成功後的回撥函式
	        },
	        'cancel': function () { 
	            // 使用者取消分享後執行的回撥函式
	        }
	    }
	}; 
	wx.ready(function () {
	    wx.onMenuShareAppMessage(share_config.share);//分享給好友
	    wx.onMenuShareTimeline(share_config.share);//分享到朋友圈
	    wx.onMenuShareQQ(share_config.share);//分享給手機QQ

	    function weixinSendAppMessage(title,desc,link,imgUrl){
	    	WeixinJSBridge.invoke('sendAppMessage',{
	    	//"appid":appId,
	    	"img_url":imgUrl,
	    	//"img_width":"640",
	    	//"img_height":"640",
	    	"link":link,
	    	"desc":desc,
	    	"title":title
	    	});
	    }
	    
	});

</script>