麻豆小视频在线观看_中文黄色一级片_久久久成人精品_成片免费观看视频大全_午夜精品久久久久久久99热浪潮_成人一区二区三区四区

首頁 > 編程 > HTML > 正文

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

2024-08-26 00:20:33
字體:
來源:轉載
供稿:網友

小編接到領導任務,寫h5移動端活動頁面,點擊頁面內容調取ios和Android開發自己寫的分享功能(包括微信、微信朋友圈、QQ、QQ空間等),包括用戶未登錄,讓其登錄后才能分享,分享成功后發起請求給予優惠券功能,下面是所得到的經驗,僅供參考。

建議不要使用ShareSDK

直接上干貨:不用引用其他庫

var u = navigator.userAgent;//判斷手機類型    //---------------------------------------安卓手機-------------------------------------------------------//    if (u.indexOf('Android') > -1 || u.indexOf('Linux') > -1) { //安卓機        var callbackButton = document.getElementById('btnImg'); //獲取節點        callbackButton.onclick = function (e) {            e.preventDefault(); //阻止原本作用            if (userId == null) { //看是否登錄,如果沒登錄                WebViewJavascriptBridge.callHandler('loginAction', function (response) {})//這里是h5頁面調取安卓的登錄方法            } else {//已經登陸了                WebViewJavascriptBridge.callHandler('shareAction', { //h5頁面調取安卓的方法,進行分享傳給android的參數,                    "content": "你請客,我買單,呼朋喚友一起去(趣)約車", // 分享的文字                    "pictureLinking": "http://yueche-1254224848.cossh.myqcloud.com/che/%E5%B0%8F%E5%9B%BE.jpg", // 分享的圖片Url                    "title": "趣約車-星海廣場站等你", //分享的標題                    "pictureUrl": "http://agent.qyueche.com/sup/ShareSdk/xing.html", //分享的網址鏈接                    "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回調的方法,                // alert(data)                if (data == 1) { //若果分享成功                    $.ajax({ //請求接口去領券                        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) { //領取成功                            swal(data.message);                        },                        error: function (XMLHttpRequest, textStatus, errorThrown) { //領取失敗                            swal('領取失敗!');                        }                    })                } else { //分享失敗                    swal('分享失敗!');                }            })            bridge.registerHandler('loginComplete', function (data, responseCallback) { //ios登錄的方法,                userId = data;            })        })    } else if (u.indexOf('iPhone') > -1) {         //---------------------------------------蘋果手機-------------------------------------------------------//        // swal("蘋果手機");        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回調的方法,                if (data.code == 1) { //若果分享成功                    $.ajax({ //請求接口去領券                        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) { //領取成功                            swal(data.message);                        },                        error: function (XMLHttpRequest, textStatus, errorThrown) { //領取失敗                            swal('領取失敗!');                        }                    })                } else { //分享失敗                    swal('分享失敗!');                }            })            bridge.registerHandler('loginComplete', function (data, responseCallback) { //ios登錄的方法,                userId = data.userId;            })            var callbackButton = document.getElementById('btnImg'); //獲取節點            callbackButton.onclick = function (e) { //點擊事件                e.preventDefault(); //阻止原本作用                if (userId == null) { //看是否登錄                    bridge.callHandler('loginAction', function (response) {})                } else {                    bridge.callHandler('shareAction', { //傳給ios的參數                        "content": "你請客,我買單,呼朋喚友一起去(趣)約車", // 分享的文字                        "pictureLinking": "http://yueche-1254224848.cossh.myqcloud.com/che/%E5%B0%8F%E5%9B%BE.jpg", // 分享的圖片Url                        "title": "趣約車-星海廣場站等你", //分享的標題                        "pictureUrl": "http://agent.qyueche.com/sup/ShareSdk/xing.html", //分享的網址鏈接                        "platform": ["2", "3"] //1新浪微博2微信好友3微信朋友圈4QQ好友5QQ空間6短信                    }, function (response) {})                }            }        })    }

總的來說,安卓和ios的代碼相似度很高,但是代碼碼放的位置不一樣,這點要注意,callHandler是頁面調取ios或安卓的方法,registerHandler是ios和安卓調取頁面的方法

html5調用app,html5,app分享

圖片中紅框的位置的方法名由h5頁面開發者與ios和安卓人員商量定制。

以上就是本文的全部內容,希望對大家的學習有所幫助,也希望大家多多支持VeVb武林網。


注:相關教程知識閱讀請移步到HTML教程頻道。
發表評論 共有條評論
用戶名: 密碼:
驗證碼: 匿名發表
主站蜘蛛池模板: 色综合网在线观看 | 欧美高清第一页 | 国产做爰全免费的视频黑人 | julieann艳星激情办公室 | av在线一区二区三区四区 | 91在线视频播放 | 国产一级做a爰片在线看 | 久久久久99精品 | 一级免费大片 | 国产成人精品一区二区仙踪林 | 男女生羞羞视频网站在线观看 | 成人在线观看小视频 | av在线免费网 | 免费看性xxx高清视频自由 | 91精品久久久久久久久久久 | 久久性生活免费视频 | 色屁屁xxxxⅹ在线视频 | 国产69精品久久99不卡免费版 | 免费毛片在线视频 | 在线播放黄色网址 | 日本欧美一区二区三区视频麻豆 | 色妞视频男女视频 | 日本不卡一区二区在线观看 | 黄色免费在线视频网站 | 国产一级毛片不卡 | 国产一级淫片在线观看 | 国产99久久久久 | 精品国产精品久久 | 国产亚洲精品久久久久久久久 | 日韩精品网站在线观看 | 精品久久一区二区 | 92自拍视频| 久久久久国产精品久久久久 | 久久中文免费 | 国产精品久久久久久久久久iiiii | 国产精品99久久久久久大便 | 美女黄色影院 | 国产羞羞视频在线免费观看 | 国产自在线 | 国产精品久久久久久影视 | 国产精品成年片在线观看, 激情小说另类 |