微信公眾號h5頁面自定義分享


<!DOCTYPE html>
<html>

    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title></title>
    </head>
    transparent

    <body>
        <script src="https://code.jquery.com/jquery-3.1.1.min.js" type="text/javascript" charset="utf-8"></script>
        <script src="https://res.wx.qq.com/open/js/jweixin-1.2.0.js" type="text/javascript" charset="utf-8"></script>
        <script type="text/javascript">
            //            配置公總號自定義分享
            //            需要引入jauery
            $.ajax({
                method: 'GET',
                url: window.BASE_URL + 'api/v1/sharding/get',
                contentType: 'application/x-www-form-urlencoded',
                async: false,
                dataType: "json",
                data: {
                    url: location.href.split('#')[0],
                },
                success: function(data) {
                    console.log(data.data)
                    var signatures = data.data
                    wx.config({
                        debug: false, // 開啟調試模式,調用的所有api的返回值會在客戶端alert出來,若要查看傳入的參數,可以在pc端打開,參數信息會通過log打出,僅在pc端時才會打印。
                        appId: signatures.appid, // 必填,公眾號的唯一標識
                        timestamp: ((signatures.timeStamp).toString()).substring(0, 10), // 必填,生成簽名的時間戳<?= $data['timestamp']?>
                        nonceStr: signatures.nonce_str, // 必填,生成簽名的隨機串<?= $data['noncestr']?>
                        signature: (signatures.signature).toLowerCase(), // 必填,簽名<?= $data['signature']?>
                        jsApiList: ['openLocation', 'getLocation', 'translateVoice',
                            'onMenuShareTimeline',
                            'onMenuShareAppMessage',
                            'onMenuShareQQ',
                            'onMenuShareWeibo',
                            'onMenuShareTimeline',
                            'onMenuShareQZone'
                        ] // 這里先聲明我們要用到打開地圖的JS接口
                    });
                }
            });

            wx.ready(function() {
                wx.checkJsApi({
                    jsApiList: ['chooseImage'], // 需要檢測的JS接口列表,所有JS接口列表見附錄2,
                    success: function(res) {
                        // 以鍵值對的形式返回,可用的api值true,不可用為false
                        // 如:{"checkResult":{"chooseImage":true},"errMsg":"checkJsApi:ok"}
                    }
                });
                var shareUrl = 'https://www.gzkny.com/h5/ziyemian/souquan.html?openid=' + openid;
                var obj = { //朋友圈
                    title: '康尼雅口腔醫院', // 分享標題
                    desc: '', // 分享描述
                    link: shareUrl, // 分享鏈接,該鏈接域名或路徑必須與當前頁面對應的公眾號JS安全域名一致
                    // 該鏈接是重定向鏈接,因為需要獲取用戶code,但是該鏈接又無法直接寫微信獲取code的鏈接,
                    // 所以需要點擊后重新加載新的頁面,來實現重定向,重新打開獲取code的微信鏈接,實現獲取用戶信息的功能;
                    imgUrl: 'https://i.loli.net/2019/05/29/5ceded0eaa03e44687.jpg',
                    fail: function(res) {
                        alert(JSON.stringify(res));
                    }
                };
                var obj1 = { //好友
                    title: '康尼雅口腔醫院', // 分享標題
                    desc: '', // 分享描述
                    link: shareUrl, // 分享鏈接,該鏈接域名或路徑必須與當前頁面對應的公眾號JS安全域名一致
                    // 該鏈接是重定向鏈接,因為需要獲取用戶code,但是該鏈接又無法直接寫微信獲取code的鏈接,
                    // 所以需要點擊后重新加載新的頁面,來實現重定向,重新打開獲取code的微信鏈接,實現獲取用戶信息的功能;
                    imgUrl: 'https://i.loli.net/2019/05/29/5ceded0eaa03e44687.jpg', // 分享圖標
                    fail: function(res) {
                        alert(JSON.stringify(res));
                    }
                };
                // 2.1 監聽“分享給朋友”,按鈕點擊、自定義分享內容及分享結果接口
                wx.onMenuShareAppMessage(obj1);

                // 2.2 監聽“分享到朋友圈”按鈕點擊、自定義分享內容及分享結果接口
                wx.onMenuShareTimeline(obj);

                // 2.3 監聽“分享到QQ”按鈕點擊、自定義分享內容及分享結果接口
                wx.onMenuShareQQ(obj);

                // 2.4 監聽“分享到微博”按鈕點擊、自定義分享內容及分享結果接口
                wx.onMenuShareWeibo(obj);

                // 2.5 監聽“分享到QZone”按鈕點擊、自定義分享內容及分享接口
                wx.onMenuShareQZone(obj);
                // 7.2 獲取當前地理位置
                wx.getLocation({
                    type: 'wgs84', // 默認為wgs84的gps坐標,如果要返回直接給openLocation用的火星坐標,可傳入'gcj02'
                    success: function(res) {
                        var latitude = res.latitude; // 緯度,浮點數,范圍為90 ~ -90
                        var longitude = res.longitude; // 經度,浮點數,范圍為180 ~ -180。
                        var speed = res.speed; // 速度,以米/每秒計
                        var accuracy = res.accuracy; // 位置精度
                        var result = []
                        result.push(longitude)
                        result.push(latitude)
                        result = JSON.stringify(result);
                        localStorage.setItem("result", result);
                        longg()
                    }
                });
            });
        </script>
    </body>

</html>    

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM