這是乙個既直觀又很好的使用者體驗,但在實現過程中會遇到各種問題:
在ios9中如何處理universal link被使用者誤關的情況
如何解決android各種機型、各種第三方瀏覽器導致的相容問題等
下面是我一些個人的經驗分享。
這塊內容其實比較簡單,在網上都有很多資料可供查閱,就不再贅述。
因為ios9和之前的ios系統有區別,所以這裡我們也要區別對待。
ios7/ios8
ios中預設通過safari開啟url scheme,方法一般如下兩種:
iframe 方式:在 body 上新增 iframe,設定src屬性為跳轉的url scheme。
第一種情況:
或者
window.location.href = schemeurl;
後一種方法不會引起頁面可見的變化(例如頁面內容變成乙個新頁面),不會導致瀏覽器歷史記錄的變化,大致實現如下:
android
但這個方案在很多安卓機型上有問題,為保證可用,改用第一種方案:
$('a').click(function()
}, 1000);
return false;
}
或者換種方式:
但原理都是一樣,利用settimeout。但這其實不穩定,因為android是基於linux的時分復用的,settimeout的基準偏差可能會沒那麼大。
functioncheckopen(cb) else
}//啟動間隔20ms執行的定時器,並檢測累計消耗時間是否超過3000ms,超過則結束
var _count = 0, inthandle;
inthandle = setinterval(function()
}, 20);
}var ifr = document.createelement('iframe');
ifr.src = openurl;
ifr.style.display = 'none';
if (callback) );
}settimeout(function() , 2000);
}另外,可以通過document.hidden
或document.[webkit|moz|ms]hidden
來判斷頁面是否被置入後台(即應用被喚起),或visibilitychange
事件,但對於android 4.4版本一下則不支援。
ios9
$('a').click(function()
$('a').click(function() , 250);
settimeout(function() , 1000);
}
沒有完美的解決方案
但這裡有坑需要注意。
手機端網頁監測是否開啟鍵盤
做h5頁面經常會遇到頁面有輸入功能的 例如這種的 ps 測試機僅有一台mi4c 最開始想,鍵盤彈出應該占用了瀏覽器的視窗,所以彈出鍵盤時頁面的可用高度一定是變化的,換句話說就是彈出鍵盤導致瀏覽器的高度被壓縮。所以通過對比輸入框獲取焦點前後瀏覽器視窗高度的變化,可以判斷出鍵盤是否彈出。document...
手機app端,token的詳解
token是什麼?token是服務端生成的一串字串,以作客戶端進行請求的乙個令牌。當第一次登陸後,伺服器生成乙個token便將此token返回個客戶端,以後客戶端只需帶上這個token前來請求資料即可,無需再次帶上使用者名稱和密碼。如何使用token?兩種使用方式 1 用裝置號 裝置mac位址作為t...
手機app端,token的詳解
token是什麼?token是服務端生成的一串字串,以作客戶端進行請求的乙個令牌。當第一次登陸後,伺服器生成乙個token便將此token返回個客戶端,以後客戶端只需帶上這個token前來請求資料即可,無需再次帶上使用者名稱和密碼。如何使用token?兩種使用方式 1 用裝置號 裝置mac位址作為t...