微信分享時沒有縮圖時的解決方案!
阿新 • • 發佈:2019-01-06
其實之前微信分享都是預設抓取頁面第一張圖片的,後來隨著微信的版本升級,也防止那種誘導式分享,騰訊遮蔽了這一功能,目前僅在PC版本是自動抓取,所以手機版微信分享帶縮圖及簡介的話就要使用jssdk。我之前也是不會,後來網上看到了一大神寫的,參照他的,自己寫了一下這個功能。這個是基於ecshop寫的
商品詳情頁程式碼:
<script type="text/javascript" src="http://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>
<script type="text/javascript">
wx.config({
debug: false , // 開啟除錯模式,呼叫的所有api的返回值會在客戶端alert出來,若要檢視傳入的引數,可以在pc端開啟,引數資訊會通過log打出,僅在pc端時才會列印。
appId: "{$signPackage.appId}", // 必填,公眾號的唯一標識
timestamp: "{$signPackage.timestamp}", // 必填,生成簽名的時間戳
nonceStr: "{$signPackage.nonceStr}", // 必填,生成簽名的隨機串
signature: "{$signPackage.signature}",// 必填,簽名,見附錄1
jsApiList: ['onMenuShareTimeline', 'onMenuShareAppMessage'] // 必填,需要使用的JS介面列表,所有JS介面列表見附錄2
});
wx.ready(function(){
//IOS系統分享時讀取圖片路徑會出現問題 用 encodeURI 來處理下
var img_url = encodeURI("http://{$smarty.server.SERVER_NAME}{$goods_share_img}");
//分享到朋友圈
wx.onMenuShareTimeline({
title: "{$goods.goods_style_name}" , // 分享標題
link: "http://{$smarty.server.SERVER_NAME}{$smarty.server.REQUEST_URI}", // 分享連結,該連結域名或路徑必須與當前頁面對應的公眾號JS安全域名一致
imgUrl: img_url, // 分享圖示
success: function () {
alert('已分享');
},
cancel: function () {
alert('已取消');
}
});
//分享給微信好友
wx.onMenuShareAppMessage({
title: "{$goods.goods_style_name}", // 分享標題
desc: "{$goods.goods_style_name}", // 分享描述
link: "http://{$smarty.server.SERVER_NAME}{$smarty.server.REQUEST_URI}", // 分享連結,該連結域名或路徑必須與當前頁面對應的公眾號JS安全域名一致
imgUrl: img_url, // 分享圖示
type: '', // 分享型別,music、video或link,不填預設為link
dataUrl: '', // 如果type是music或video,則要提供資料鏈接,預設為空
success: function () {
alert('已分享');
},
cancel: function () {
alert('已取消');
}
});
});
</script>
PHP指令碼程式碼:
// 微信分享 start
//把要用全部封裝一個方法裡,方便模版中使用
function getSignPackage() {
$jsapiTicket = getJsApiTicket();
$protocol = (!empty($_SERVER['HTTPS']) && $_SERVER['HTTPS'] !== 'off' || $_SERVER['SERVER_PORT'] == 443) ? "https://" : "http://";
$url = "$protocol$_SERVER[HTTP_HOST]$_SERVER[REQUEST_URI]";
$timestamp = time();
$nonceStr = createNonceStr();
$string = "jsapi_ticket=$jsapiTicket&noncestr=$nonceStr×tamp=$timestamp&url=$url";
$signature = sha1($string);//生成簽名
$signPackage = array(
"appId" => 'wxf888b6qb96c0cf91', //自己公眾號的AppId,我這裡隨便寫一個
"nonceStr" => $nonceStr,
"timestamp" => $timestamp,
"signature" => $signature
);
return $signPackage;
}
//生成隨機字串
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;
}
//獲取jsapi_ticket
function getJsApiTicket() {
$data = $_SESSION['jsapiticket_all'];
if ($data['expire_time'] < time()) {
$accessToken = getAccessToken();
$url = "https://api.weixin.qq.com/cgi-bin/ticket/getticket?type=jsapi&access_token=$accessToken";
$res = json_decode(httpGet($url));
foreach ($res as $k=>$v){
$all[$k] = $v;
}
$ticket = $all['ticket'];
if ($ticket) {
$_SESSION['jsapiticket_all']['expire_time'] = time() + 7000;
$_SESSION['jsapiticket_all']['jsapi_ticket'] = $ticket;
}
} else {
$ticket = $_SESSION['jsapiticket_all']['jsapi_ticket'];
}
return $ticket;
}
//獲取AccessToken
function getAccessToken() {
$data = $_SESSION['access_token_all'];
if ($data['expire_time'] < time()) {
$url = "https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=wxb338b6a276c0cf25&secret=28cafa17194e9241e6685260b7ebef89";
$res = json_decode(httpGet($url));
foreach ($res as $k=>$v){
$all[$k] = $v;
}
$access_token = $all['access_token'];
if ($access_token) {
$_SESSION['access_token_all']['expire_time'] = time() + 7000;
$access_token = $all['access_token'];
$_SESSION['access_token_all'] =$all;
}
} else {
$access_token = $_SESSION['access_token_all']['access_token'];
}
return $access_token;
}
//安全處理
function httpGet($url) {
$curl = curl_init();
curl_setopt($curl, CURLOPT_RETURNTRANSFER, true);
curl_setopt($curl, CURLOPT_TIMEOUT, 500);
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;
}
$smarty->assign('signPackage',getSignPackage()); //賦值到模板
// 微信分享end