主頁(yè) > 知識(shí)庫(kù) > html5調(diào)用app分享功能示例(WebViewJavascriptBridge)

html5調(diào)用app分享功能示例(WebViewJavascriptBridge)

熱門(mén)標(biāo)簽:云南大理400電話申請(qǐng)官方 當(dāng)涂高德地圖標(biāo)注 南寧點(diǎn)撥外呼系統(tǒng)哪家公司做的好 江蘇智能電銷(xiāo)機(jī)器人哪家好 成都智能外呼系統(tǒng)平臺(tái) 鎮(zhèn)江智能外呼系統(tǒng)有效果嗎 四川點(diǎn)撥外呼系統(tǒng) 電銷(xiāo)機(jī)器人電話用什么卡 黃島區(qū)地圖標(biāo)注

小編接到領(lǐng)導(dǎo)任務(wù),寫(xiě)h5移動(dòng)端活動(dòng)頁(yè)面,點(diǎn)擊頁(yè)面內(nèi)容調(diào)取ios和Android開(kāi)發(fā)自己寫(xiě)的分享功能(包括微信、微信朋友圈、QQ、QQ空間等),包括用戶未登錄,讓其登錄后才能分享,分享成功后發(fā)起請(qǐng)求給予優(yōu)惠券功能,下面是所得到的經(jīng)驗(yàn),僅供參考。

建議不要使用ShareSDK

直接上干貨:不用引用其他庫(kù)

var u = navigator.userAgent;//判斷手機(jī)類(lèi)型
    //---------------------------------------安卓手機(jī)-------------------------------------------------------//
    if (u.indexOf('Android') > -1 || u.indexOf('Linux') > -1) { //安卓機(jī)
        var callbackButton = document.getElementById('btnImg'); //獲取節(jié)點(diǎn)
        callbackButton.onclick = function (e) {
            e.preventDefault(); //阻止原本作用
            if (userId == null) { //看是否登錄,如果沒(méi)登錄
                WebViewJavascriptBridge.callHandler('loginAction', function (response) {})//這里是h5頁(yè)面調(diào)取安卓的登錄方法
            } else {//已經(jīng)登陸了
                WebViewJavascriptBridge.callHandler('shareAction', { //h5頁(yè)面調(diào)取安卓的方法,進(jìn)行分享傳給android的參數(shù),
                    "content": "你請(qǐng)客,我買(mǎi)單,呼朋喚友一起去(趣)約車(chē)", // 分享的文字
                    "pictureLinking": "http://yueche-1254224848.cossh.myqcloud.com/che/%E5%B0%8F%E5%9B%BE.jpg", // 分享的圖片Url
                    "title": "趣約車(chē)-星海廣場(chǎng)站等你", //分享的標(biāo)題
                    "pictureUrl": "http://agent.qyueche.com/sup/ShareSdk/xing.html", //分享的網(wǎng)址鏈接
                    "platform": ["2", "3"] //1新浪微博2微信好友3微信朋友圈4QQ好友5QQ空間6短信
                }, function (response) {})
            }
        }
        function connectWebViewJavascriptBridge(callback) {//這里是分享成功后
            if (window.WebViewJavascriptBridge) {
                callback(WebViewJavascriptBridge)
            } else {
                document.addEventListener(
                    'WebViewJavascriptBridgeReady'
                    , function() {
                        callback(WebViewJavascriptBridge)
                    },
                    false
                );
            }
        }
        connectWebViewJavascriptBridge(function(bridge) {
            bridge.init(function(message, responseCallback) {
               
            });
            bridge.registerHandler('shareComplete', function (data, responseCallback) { //ios回調(diào)的方法,
                // alert(data)
                if (data == 1) { //若果分享成功
                    $.ajax({ //請(qǐng)求接口去領(lǐng)券
                        type: "get",
                        contentType: "application/x-www-form-urlencoded",
                        // url: "http://main.qyueche.com/api/coupon/receiveCoupon?userId=" + userId +
                        //  "&takeCouponType=2&couponId=176",
                        url: "http://dev.qyueche.cn/api/coupon/receiveCoupon?userId=" + userId +
                            "&takeCouponType=2&couponId=187",
                        data: {},
                        dataType: "json",
                        success: function (data) { //領(lǐng)取成功
                            swal(data.message);
                        },
                        error: function (XMLHttpRequest, textStatus, errorThrown) { //領(lǐng)取失敗
                            swal('領(lǐng)取失敗!');
                        }
                    })
                } else { //分享失敗
                    swal('分享失敗!');
                }
            })
            bridge.registerHandler('loginComplete', function (data, responseCallback) { //ios登錄的方法,
                userId = data;
            })
        })
    } else if (u.indexOf('iPhone') > -1) { 
        //---------------------------------------蘋(píng)果手機(jī)-------------------------------------------------------//
        // swal("蘋(píng)果手機(jī)");
        function setupWebViewJavascriptBridge(callback) {
            if (window.WebViewJavascriptBridge) {
                return callback(WebViewJavascriptBridge);
            }
            if (window.WVJBCallbacks) {
                return window.WVJBCallbacks.push(callback);
            }
            window.WVJBCallbacks = [callback];
            var WVJBIframe = document.createElement('iframe');
            WVJBIframe.style.display = 'none';
            WVJBIframe.src = 'https://__bridge_loaded__';
            document.documentElement.appendChild(WVJBIframe);
            setTimeout(function () {
                document.documentElement.removeChild(WVJBIframe)
            }, 0)
        }
        setupWebViewJavascriptBridge(function (bridge) {
            bridge.registerHandler('shareComplete', function (data, responseCallback) { //ios回調(diào)的方法,
                if (data.code == 1) { //若果分享成功
                    $.ajax({ //請(qǐng)求接口去領(lǐng)券
                        type: "get",
                        contentType: "application/x-www-form-urlencoded",
                        // url: "http://main.qyueche.com/api/coupon/receiveCoupon?userId=" + userId +
                        //  "&takeCouponType=2&couponId=176",
                        url: "http://dev.qyueche.cn/api/coupon/receiveCoupon?userId=" + userId +
                            "&takeCouponType=2&couponId=187",
                        data: {},
                        dataType: "json",
                        success: function (data) { //領(lǐng)取成功
                            swal(data.message);
                        },
                        error: function (XMLHttpRequest, textStatus, errorThrown) { //領(lǐng)取失敗
                            swal('領(lǐng)取失敗!');
                        }
                    })
                } else { //分享失敗
                    swal('分享失敗!');
                }
            })
            bridge.registerHandler('loginComplete', function (data, responseCallback) { //ios登錄的方法,
                userId = data.userId;
            })
            var callbackButton = document.getElementById('btnImg'); //獲取節(jié)點(diǎn)
            callbackButton.onclick = function (e) { //點(diǎn)擊事件
                e.preventDefault(); //阻止原本作用
                if (userId == null) { //看是否登錄
                    bridge.callHandler('loginAction', function (response) {})
                } else {
                    bridge.callHandler('shareAction', { //傳給ios的參數(shù)
                        "content": "你請(qǐng)客,我買(mǎi)單,呼朋喚友一起去(趣)約車(chē)", // 分享的文字
                        "pictureLinking": "http://yueche-1254224848.cossh.myqcloud.com/che/%E5%B0%8F%E5%9B%BE.jpg", // 分享的圖片Url
                        "title": "趣約車(chē)-星海廣場(chǎng)站等你", //分享的標(biāo)題
                        "pictureUrl": "http://agent.qyueche.com/sup/ShareSdk/xing.html", //分享的網(wǎng)址鏈接
                        "platform": ["2", "3"] //1新浪微博2微信好友3微信朋友圈4QQ好友5QQ空間6短信
                    }, function (response) {})
                }
            }
        })
    }

總的來(lái)說(shuō),安卓和ios的代碼相似度很高,但是代碼碼放的位置不一樣,這點(diǎn)要注意,callHandler是頁(yè)面調(diào)取ios或安卓的方法,registerHandler是ios和安卓調(diào)取頁(yè)面的方法

圖片中紅框的位置的方法名由h5頁(yè)面開(kāi)發(fā)者與ios和安卓人員商量定制。

以上就是本文的全部?jī)?nèi)容,希望對(duì)大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。

標(biāo)簽:淮安 佳木斯 酒泉 廣西 咸寧 南京 十堰 西寧

巨人網(wǎng)絡(luò)通訊聲明:本文標(biāo)題《html5調(diào)用app分享功能示例(WebViewJavascriptBridge)》,本文關(guān)鍵詞  html5,調(diào)用,app,分享,功能,;如發(fā)現(xiàn)本文內(nèi)容存在版權(quán)問(wèn)題,煩請(qǐng)?zhí)峁┫嚓P(guān)信息告之我們,我們將及時(shí)溝通與處理。本站內(nèi)容系統(tǒng)采集于網(wǎng)絡(luò),涉及言論、版權(quán)與本站無(wú)關(guān)。
  • 相關(guān)文章
  • 下面列出與本文章《html5調(diào)用app分享功能示例(WebViewJavascriptBridge)》相關(guān)的同類(lèi)信息!
  • 本頁(yè)收集關(guān)于html5調(diào)用app分享功能示例(WebViewJavascriptBridge)的相關(guān)信息資訊供網(wǎng)民參考!
  • 推薦文章