最簡(jiǎn)單方法,自定義微信分享內(nèi)容!

為了上線一個(gè)公司的演示demo系統(tǒng),今天折騰了一下,嘗試了幾種不同的自定義微信分享內(nèi)容的方法,最后感覺(jué)php環(huán)境下設(shè)置是最方便、易懂的,適合新手配置。下面就做一個(gè)簡(jiǎn)單的記錄:

第一步:微信公眾平臺(tái)設(shè)置安全域名

JS接口安全域名

只有在微信平臺(tái)后臺(tái),添加需要自定義分享內(nèi)容頁(yè)面所在的域名為安全域名,分享接口才能順利的被調(diào)用。

第二步:獲取微信公眾號(hào)的AppID和AppSecret

AppID和AppSecret

注:AppSecret十分重要,千萬(wàn)不要泄露!

第三步:引入微信指定JS文件

在頁(yè)面文件中,引入:

<script type="text/javascript" src="https://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>

并在項(xiàng)目目錄中添加文件:

access_token.php、jsapi_ticket.php、jssdk.php

上述文件可從微信公眾平臺(tái)wiki下的demo中下載

第四步

將需要設(shè)置分享的頁(yè)面,改為 *.php的文件,并在開頭位置添加以下代碼:

<?php
require_once "jssdk.php";
$jssdk = new JSSDK("AppID", "AppSecret");
$signPackage = $jssdk->GetSignPackage();
?>

第五步:在頁(yè)面中配置分享內(nèi)容,代碼如下:

<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: [
                // 所有要調(diào)用的 API 都要加到這個(gè)列表中
                'checkJsApi', //判斷當(dāng)前客戶端版本是否支持指定JS接口
                'onMenuShareTimeline', //分享給好友
                'onMenuShareAppMessage', //分享到朋友圈
            ]
        });
        wx.ready(function() {
            // 在這里調(diào)用 API
            //自定義分享朋友圈
            wx.onMenuShareTimeline({
                title: '新零售場(chǎng)景化DEMO-企加云', // 分享標(biāo)題
                link: 'https://itrigger.cn/s-demo/m/', // 分享鏈接,該鏈接域名或路徑必須與當(dāng)前頁(yè)面對(duì)應(yīng)的公眾號(hào)JS安全域名一致
                imgUrl: 'https://itrigger.cn/s-demo/images/demo_share.jpg', // 分享圖標(biāo)
                success: function() {
                    // 用戶確認(rèn)分享后執(zhí)行的回調(diào)函數(shù)
                },
                cancel: function() {
                    // 用戶取消分享后執(zhí)行的回調(diào)函數(shù)
                }
            });

            //自定義分享給好友
            wx.onMenuShareAppMessage({
                title: '新零售場(chǎng)景化DEMO', // 分享標(biāo)題
                desc: '企加云-新零售智慧門店解決方案服務(wù)商', // 分享描述
                link: 'https://itrigger.cn/s-demo/m/', // 分享鏈接,該鏈接域名或路徑必須與當(dāng)前頁(yè)面對(duì)應(yīng)的公眾號(hào)JS安全域名一致
                imgUrl: 'https://itrigger.cn/s-demo/images/demo_share.jpg', // 分享圖標(biāo)
                type: 'link', // 分享類型,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ù)
                }
            });
        });
    </script>

以上只是常用的兩個(gè)調(diào)用,完整微信調(diào)用api可查看公眾平臺(tái)wiki

至此,微信自定義分享配置完畢。

幾個(gè)注意點(diǎn):
  • 如果網(wǎng)站頁(yè)面是https,那么因?yàn)榈奈⑿诺刂芬残枰臑閔ttps
  • 分享回調(diào)可用于統(tǒng)計(jì)等,可不填
  • 如果仍沒(méi)有自定義分享效果,在微信公眾平臺(tái)后臺(tái)添加IP白名單即可!
  • 因上述方法需要對(duì)每個(gè)頁(yè)面進(jìn)行單獨(dú)配置,只適合頁(yè)面較少的情況。
背景:B2B SaaS產(chǎn)品 創(chuàng)業(yè)公司;
人設(shè):產(chǎn)品轉(zhuǎn)崗的運(yùn)營(yíng)人;
目標(biāo):完善B2B SaaS產(chǎn)品運(yùn)營(yíng)體系,完成全年引流1000+Leads的目標(biāo);
地點(diǎn):浙江 · 杭州;
時(shí)間:2018年4月8日;
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡(jiǎn)書系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • Android 自定義View的各種姿勢(shì)1 Activity的顯示之ViewRootImpl詳解 Activity...
    passiontim閱讀 179,355評(píng)論 25 708
  • 轉(zhuǎn)載鏈接 注:本文轉(zhuǎn)載知乎上的回答 作者:初雪 鏈接:https://www.zhihu.com/question...
    pengshuangta閱讀 29,344評(píng)論 9 295
  • Spring Cloud為開發(fā)人員提供了快速構(gòu)建分布式系統(tǒng)中一些常見(jiàn)模式的工具(例如配置管理,服務(wù)發(fā)現(xiàn),斷路器,智...
    卡卡羅2017閱讀 136,711評(píng)論 19 139
  • 獨(dú)處時(shí)可以看出一個(gè)人的品質(zhì) 很顯然,我們都是一個(gè)喜歡欺騙自我的壞人。一邊討好自己,一邊卻在折磨自己。我絕對(duì)...
    諾承澤啊閱讀 274評(píng)論 0 0
  • 只有為了那些沒(méi)有希望的事情,我們才獲得希望 文/余大滿 我不知道自己算不算一個(gè)星戰(zhàn)迷,但在所有系列電影中,星球大戰(zhàn)...
    大滿書坊閱讀 1,048評(píng)論 0 0

友情鏈接更多精彩內(nèi)容