微信小程序分享朋友圈功能的開(kāi)發(fā)詳解

2023-03-22    分類: 網(wǎng)站建設(shè)

一、微信小程序
在制作微信小程序的時(shí)候怎么將頁(yè)面分享到朋友圈或者朋友
1.onShareAppMessage分享給好友
/**
*分享當(dāng)前頁(yè)面
*/
onShareAppMessage(){
const_this=this;
return{
title:'xxxxxx',//標(biāo)題
path:"/pages/index/index?",//鏈接
imageUrl:"",//圖片鏈接,如果沒(méi)有這個(gè)參數(shù)默認(rèn)是微信小程序的logo
};
},

/**
2.分享到朋友圈,目前這個(gè)只有在安卓平臺(tái)支持
/**
*分享到朋友圈
*本接口為Beta版本,暫只在Android平臺(tái)支持,詳見(jiàn)分享到朋友圈(Beta)
*/
onShareTimeline(){
const_this=this;
return{
title:'xxxx',
path:"/pages/index/index?",};
},

上面兩個(gè)都是右上角 按鈕觸發(fā)的分享
自定義按鈕需要要 <button open-type=”share”> 觸發(fā)分享
<buttonclass="contact"open-type="share">
<imagesrc="{{api_url}}/images/home/icon19.png"style="width:84rpx;"mode="widthFix"></image>
<viewclass="name">分享</view>
</button>

分享圖

分享2

同樣觸發(fā)分享功能
手機(jī)網(wǎng)站應(yīng)用
在在制作手機(jī)網(wǎng)站應(yīng)用時(shí),用戶在可以通過(guò)微信瀏覽器訪問(wèn)。相比于普通瀏覽器的訪問(wèn)需要對(duì)接利用其自身的一些網(wǎng)頁(yè)接口。如支付接口就是其中的一種,本文介紹一下自定義微信瀏覽器的分享內(nèi)容如何處理。
更多網(wǎng)頁(yè)應(yīng)用可以查看
1、在微信公眾號(hào)管理平臺(tái)中,“設(shè)置”->“公眾號(hào)設(shè)置”->“功能設(shè)置”下的“JS接口安全域名”和“網(wǎng)頁(yè)授權(quán)域名”中填寫(xiě)自已的域名。
2、在微信公眾號(hào)管理平臺(tái)中,“開(kāi)發(fā)”->“基本配置”下設(shè)置“IP白名單”,服務(wù)器的ip如果不太清楚,可以在測(cè)試打出的信息中準(zhǔn)確知道具體是什么。
3、應(yīng)用,也可以到上面的地址中去下載demo。下面是TP的應(yīng)用。
1)在項(xiàng)目模塊下的Service文件夾中新建WxjssdkService.class.php用于js接口調(diào)用。其完整代碼為:
需要注意的是這里獲取的accessToken因?yàn)橛姓?qǐng)求次數(shù)的限制,所以一定要在服務(wù)器緩存起來(lái)。
classWxjssdkService{
/**
*微信配置信息
*/
function__construct(){
$jsConfig=array(
'APPID'=>D('Config')->get('wxpay_appid'),//'wx4***',//綁定支付的APPID(必須配置,開(kāi)戶郵件中可查看)
'APPSECRET'=>'******',//公眾帳號(hào)secert(僅JSAPI支付的時(shí)候需要配置,登錄公眾平臺(tái),進(jìn)入開(kāi)發(fā)者中心可設(shè)置),
);
$this->jsConfig=$jsConfig;
}
/**
*獲取簽名數(shù)據(jù)
*@paramstring$url
*@returnarray
*/
publicfunctiongetSignPackage($url=''){
$jsConfig=$this->jsConfig;
$jsapiTicket=$this->getJsApiTicket();
$protocol=(!empty($_SERVER['HTTPS'])&&$_SERVER['HTTPS']!=='off'||$_SERVER['SERVER_PORT']==443)?"https://":"http://";
$url=$url?$url:"$protocol$_SERVER[HTTP_HOST]$_SERVER[REQUEST_URI]";
$timestamp=time();
$nonceStr=$this->createNonceStr();
//這里參數(shù)的順序要按照key值A(chǔ)SCII碼升序排序
$string="jsapi_ticket=$jsapiTicket&noncestr=$nonceStr×tamp=$timestamp&url=$url";
$signature=sha1($string);
$signPackage=array(
"appId"=>$jsConfig['APPID'],
"nonceStr"=>$nonceStr,
"timestamp"=>$timestamp,
"url"=>$url,
"signature"=>$signature,
"rawString"=>$string
);
return$signPackage;
}
/**
*生成隨機(jī)串
*@paramint$length
*@returnstring
*/
privatefunctioncreateNonceStr($length=16){
$chars="abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789";
$str="";
for($i=0;$i<$length;$i++){
$str.=substr($chars,mt_rand(0,strlen($chars)-1),1);
}
return$str;
}
/**
*獲取票證
*@returnmixed
*/
privatefunctiongetJsApiTicket(){
//jsapi_ticket應(yīng)該全局存儲(chǔ)與更新,以下代碼以寫(xiě)入到文件中做示例
$data=S('wx_jsapi_ticket');
if(!$data){
$accessToken=$this->getAccessToken();
//如果是企業(yè)號(hào)用以下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){
S('wx_jsapi_ticket',$ticket,7000);//jsapi_ticket的有效期是7200秒(兩小時(shí))
}
}else{
$ticket=$data;
}
return$ticket;
}
/**
*獲取憑證
*@returnmixed
*/
privatefunctiongetAccessToken(){
$jsConfig=$this->jsConfig;
//access_token應(yīng)該全局存儲(chǔ)與更新,以下代碼以寫(xiě)入到文件中做示例
$data=S('wx_access_token');
if(!$data){
//如果是企業(yè)號(hào)用以下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=".$jsConfig['APPID']."&secret=".$jsConfig['APPSECRET'];
$res=json_decode($this->httpGet($url));
$access_token=$res->access_token;
if($access_token){
S('wx_access_token',$access_token,7000);//access_token的有效期是7200秒(兩小時(shí))
}
}else{
$access_token=$data;
}
return$access_token;
}
/**
*http獲取內(nèi)容
*@param$url
*@returnmixed
*/
privatefunctionhttpGet($url){
$curl=curl_init();
curl_setopt($curl,CURLOPT_RETURNTRANSFER,true);
curl_setopt($curl,CURLOPT_TIMEOUT,500);
//為保證第三方服務(wù)器與微信服務(wù)器之間數(shù)據(jù)傳輸?shù)陌踩?,所有微信接口采用https方式調(diào)用,必須使用下面2行代碼打開(kāi)ssl安全校驗(yàn)。
//如果在部署過(guò)程中代碼在此處驗(yàn)證失敗,請(qǐng)到http://curl.haxx.se/ca/cacert.pem下載新的證書(shū)判別文件。
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;
}
}
在控制器中即可使用:
$protocol=(!empty($_SERVER['HTTPS'])&&$_SERVER['HTTPS']!=='off'||$_SERVER['SERVER_PORT']==443)?"https://":"http://";
$sharelink=$protocol.$_SERVER['SERVER_NAME'].$_SERVER['REQUEST_URI'];
$signPackage=D('Wxjssdk','Service')->GetSignPackage($sharelink);
$this->signPackage=$signPackage;
在模板中可以輸出,僅以分享給朋友和微信朋友圈為例,此為公共文件,當(dāng)需要改變要分享的內(nèi)容時(shí)可在當(dāng)前頁(yè)中輸出下面的js變量覆蓋。
<script>
varwx_share_title=("undefined"!=typeofwx_share_title)?wx_share_title:'{$config.index_title}';//分享標(biāo)題
varwx_share_link=("undefined"!=typeofwx_share_link)?wx_share_link:'http://{$_SERVER[HTTP_HOST]}{$_SERVER[REQUEST_URI]}';//分享鏈接,該鏈接域名或路徑必須與當(dāng)前頁(yè)面對(duì)應(yīng)的公眾號(hào)JS安全域名一致
varwx_share_imgUrl=("undefined"!=typeofwx_share_imgUrl)?wx_share_imgUrl:"http://{:$_SERVER['SERVER_NAME']}/Uploads/mlogo/thumb/default.png";//分享圖標(biāo)
varwx_share_desc=("undefined"!=typeofwx_share_desc)?wx_share_desc:'{$config.index_keywords}';//分享描述
</script>
<scriptsrc="http://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>
<script>
wx.config({
debug:false,//開(kāi)啟調(diào)試模式
appId:'{$signPackage.appId}',//必填,公眾號(hào)的唯一標(biāo)識(shí)
timestamp:'{$signPackage.timestamp}',//必填,生成簽名的時(shí)間戳
nonceStr:'{$signPackage.nonceStr}',//必填,生成簽名的隨機(jī)串
signature:'{$signPackage.signature}',//必填,簽名,見(jiàn)附錄1
jsApiList:['onMenuShareTimeline','onMenuShareAppMessage']//必填,需要使用的JS接口列表,所有JS接口列表見(jiàn)附錄2
});
wx.ready(function(res){
wx.onMenuShareTimeline({
title:wx_share_title,
//分享標(biāo)題
link:wx_share_link,
//分享鏈接,該鏈接域名或路徑必須與當(dāng)前頁(yè)面對(duì)應(yīng)的公眾號(hào)JS安全域名一致
imgUrl:wx_share_imgUrl,
//分享圖標(biāo)
success:function(){
//用戶確認(rèn)分享后執(zhí)行的回調(diào)函數(shù)
},
cancel:function(){
//用戶取消分享后執(zhí)行的回調(diào)函數(shù)
}
});
wx.onMenuShareAppMessage({
title:wx_share_title,
//分享標(biāo)題
desc:wx_share_desc,
//分享描述
link:wx_share_link,
//分享鏈接,該鏈接域名或路徑必須與當(dāng)前頁(yè)面對(duì)應(yīng)的公眾號(hào)JS安全域名一致
imgUrl:wx_share_imgUrl,
//分享圖標(biāo)
type:'',
//分享類型,music、video或link,不填默認(rèn)為link
dataUrl:'',
//如果type是music或video,則要提供數(shù)據(jù)鏈接,默認(rèn)為空
success:function(){
//用戶確認(rèn)分享后執(zhí)行的回調(diào)函數(shù)
},
cancel:function(){
//用戶取消分享后執(zhí)行的回調(diào)函數(shù)
}
});
});

本文題目:微信小程序分享朋友圈功能的開(kāi)發(fā)詳解
新聞來(lái)源:http://muchs.cn/news5/246805.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供做網(wǎng)站、網(wǎng)站導(dǎo)航App開(kāi)發(fā)、響應(yīng)式網(wǎng)站網(wǎng)站排名、自適應(yīng)網(wǎng)站

廣告

聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請(qǐng)盡快告知,我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如需處理請(qǐng)聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來(lái)源: 創(chuàng)新互聯(lián)

成都網(wǎng)頁(yè)設(shè)計(jì)公司