需求:
APP要用H5頁面做展示,而且要取得對應的商品ID,使用者點擊H5頁面跳回APP原生頁面。
方法:
先要判斷使用者是ios還是android裝置(這裡只考慮ios跟android,因為它兩個寫法還是有點不一樣,所以分開),然後禁止掉H5頁面的跳轉,取得點擊區域的ID,傳給APP。
ios:其中goDetail是ios他們要呼叫的方法,data就是ID值,type是類型有其它參數的時候可以傳給APP
var u = navigator.userAgent; //获取用户设备 var isIOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端 $("a").click(function(){ var href = $(this).attr("data-href"); if (isIOS && window.WebViewJavascriptBridge) { //ios app 设备才执行 $(this).attr("href","javascript:;");//禁止H5页面跳转 WebViewJavascriptBridge.callHandler('goDetail', {"data": href,'type':"1"}, function(){ }); return false; } });
android:在安卓程式碼裡面呼叫H5裡面寫的一個方法gotoAndroidApp(),然後他們取得goodsDetail參數的值,第一個為ID,第二個為type值,有其它參數的時候可以依序傳多個
// 安卓app才调用的方法 function gotoAndroidApp() { $("a").click(function(){ $(this).attr("href","javascript:;"); var href = $(this).attr("data-href"); window.androidVik.goodsDetail(href,1); return false; }); }
完整的案例:
##
对接app
以上是H5跟ios、android資料對接的方式的詳細內容。更多資訊請關注PHP中文網其他相關文章!