微信分享接口示例（设置标题、缩略图、连接、描述）

原文连接:https://blog.csdn.net/qq_34543438/article/details/78254667

前几天因为项目所需要实现微信分享接口，在网上搜了一大堆，实现办法大致分为两种，第一：在body之后加一个img标签并且设置display:none,这种方法感觉不科学所以我没有测试过。第二：使用微信的分享接口，但在网上也没用找到完整的示例，还是自己折腾吧，请看下面。

第一步：

先登录微信公众平台进入“公众号设置”的“功能设置”里填写“JS接口安全域名”。
注：认证帐号才有分享权限

第二步

创建一个demo.php文件和wxshare.js

demo.php

<?php

 // 步骤1.设置appid和appsecret
    private $WX_APPID="wx9b1ec4fef5bf666";
    private $WX_SECRET="8e3e63698ddac81947f52b0a7be45b6666";

    // 步骤2.生成签名的随机串
    function nonceStr($length){
        $str = '0123456789abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ';//62个字符
        $strlen = 62;
        while($length > $strlen){
            $str .= $str;
            $strlen += 62;
        }
        $str = str_shuffle($str);
        return substr($str,0,$length);
    }

    // 步骤3.获取access_token
    function getAccessToken()
    {
        $result = self::http_get('https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid='.$this->WX_APPID.'&secret='.$this->WX_SECRET);
        $json = json_decode($result, true);
//        var_dump($json);exit;
        return $json['access_token'];
    }

    function http_get($url){
        $oCurl = curl_init();
        if(stripos($url,"https://")!==FALSE){
            curl_setopt($oCurl, CURLOPT_SSL_VERIFYPEER, FALSE);
            curl_setopt($oCurl, CURLOPT_SSL_VERIFYHOST, FALSE);
            curl_setopt($oCurl, CURLOPT_SSLVERSION, 1); //CURL_SSLVERSION_TLSv1
        }
        curl_setopt($oCurl, CURLOPT_URL, $url);
        curl_setopt($oCurl, CURLOPT_RETURNTRANSFER, 1 );
        $sContent = curl_exec($oCurl);
        $aStatus = curl_getinfo($oCurl);
        curl_close($oCurl);
        if(intval($aStatus["http_code"])==200){
            return $sContent;
        }else{
            return false;
        }
    }

    // 步骤4.获取ticket
    function ticket()
    {
        $url = "https://api.weixin.qq.com/cgi-bin/ticket/getticket?type=jsapi&access_token=".self::getAccessToken();
        $res = json_decode(self::http_get($url));
        return $res->ticket;
    }

    // 步骤5.生成wx.config需要的参数
    function share()
    {
        $surl = 'http://'.$_SERVER['HTTP_HOST'].$_SERVER['REQUEST_URI'];
//        var_dump(self::getAccessToken());exit;
        return self::getWxConfig(self::ticket(), $surl, time(), self::nonceStr(16));
    }

    function getWxConfig($jsapiTicket,$url,$timestamp,$nonceStr) {
        $string = "jsapi_ticket=$jsapiTicket&noncestr=$nonceStr&timestamp=$timestamp&url=$url";
        $signature = sha1 ( $string );
        $WxConfig["appId"] = $this->WX_APPID ;
        $WxConfig["nonceStr"] = $nonceStr;
        $WxConfig["timestamp"] = $timestamp;
        $WxConfig["url"] = $url;
        $WxConfig["signature"] = $signature;
        $WxConfig["rawString"] = $string;
        return $WxConfig;
    }

?>

网页部分:

<!DOCTYPE html>

<head>

<title>Share Demo</title>

</head>

<body>

</body>

// 步骤6.调用JS接口

wx.config({

debug: false,
    appId: '<?php echo $detail["share"]["appId"]; ?>',
    timestamp: '<?php echo $detail["share"]["timestamp"]; ?>',
    nonceStr: '<?php echo $detail["share"]["nonceStr"]; ?>',
    signature: '<?php echo $detail["share"]["signature"]; ?>',
    jsApiList: [
        'checkJsApi',
        'onMenuShareTimeline',
        'onMenuShareAppMessage',
        'onMenuShareQQ',
        'onMenuShareWeibo',
        'onMenuShareQZone',
    ]
});
var wstitle = "<?php echo $detail['act_ext2']; ?>号选手:<?php echo $detail['act_name']; ?>";
var wsdesc = "<?php echo $detail['act_beta']; ?>";
var wslink = "<?php echo $detail['share']['url']; ?>";
var wsimg = "http://<?php echo $detail['share_pic']; ?>";

</script>

</html>

wxshare.js

wx.ready(function () {
// 分享到朋友圈
wx.onMenuShareTimeline({
title: wstitle,
link: wslink,
imgUrl: wsimg,
success: function () {
alert('分享成功');
},
cancel: function () {
}
});
// 分享给朋友
wx.onMenuShareAppMessage({
title: wstitle,
desc: wsdesc,
link: wslink,
imgUrl: wsimg,
success: function () {
alert('分享成功');
},
cancel: function () {
}
});
// 分享到QQ
wx.onMenuShareQQ({
title: wstitle,
desc: wsdesc,
link: wslink,
imgUrl: wsimg,
success: function () {
alert('分享成功');
},
cancel: function () {
}
});
// 微信到腾讯微博
wx.onMenuShareWeibo({
title: wstitle,
desc: wsdesc,
link: wslink,
imgUrl: wsimg,
success: function () {
alert('分享成功');
},
cancel: function () {
}
});
// 分享到QQ空间
wx.onMenuShareQZone({
title: wstitle,
desc: wsdesc,
link: wslink,
imgUrl: wsimg,
success: function () {
alert('分享成功');
},
cancel: function () {
}
});
});

大功告成！

微信分享接口示例（设置标题、缩略图、连接、描述）

猜你喜欢