URL Scheme的使用

xcm發表於2018-02-24

前言:

最近公司業務發展迅速,要求在各種手機瀏覽器中、各種app的webview中開啟移動手廳app客戶端。

什麼是 URL Scheme?

android中的scheme是一種頁面內跳轉協議,是一種非常好的實現機制,通過定義自己的scheme協議,可以非常方便跳轉app中的各個頁面;通過scheme協議,伺服器可以定製化告訴App跳轉那個頁面,可以通過通知欄訊息定製化跳轉頁面,可以通過H5頁面跳轉頁面等。

URL Scheme應用場景:

客戶端應用可以向作業系統註冊一個 URL scheme,該 scheme 用於從瀏覽器或其他應用中啟動本應用。通過指定的 URL 欄位,可以讓應用在被調起後直接開啟某些特定頁面,比如商品詳情頁、活動詳情頁等等。也可以執行某些指定動作,如完成支付等。也可以在應用內通過 html 頁來直接呼叫顯示 app 內的某個頁面。綜上URL Scheme使用場景大致分以下幾種:

  • 伺服器下發跳轉路徑,客戶端根據伺服器下發跳轉路徑跳轉相應的頁面
  • H5頁面點選錨點,根據錨點具體跳轉路徑APP端跳轉具體的頁面
  • APP端收到伺服器端下發的PUSH通知欄訊息,根據訊息的點選跳轉路徑跳轉相關頁面
  • APP根據URL跳轉到另外一個APP指定頁面

問題

  1. 某些瀏覽器或webview支援iframe中src方式,還有些不支援
  2. 某些瀏覽器或webview支援a標籤中href方式,還有些不支援會報這個錯 net::ERR_UNKNOWN_URL_SCHEME

解決思路和程式碼

  1. 需要去騰訊開放平臺註冊一個URL Scheme
  2. 經過測試ios 9系統以上版本 safari 不支援iframe的方式跳轉。所以ios系統 都用a標籤的方式來做吧。
  3. 如果有業務是一進頁面需要拉起客戶端需要寫一個定時器例如3秒以後還沒有喚起app就執行下載app的操作。如何監聽到app被喚起可以在頁面中使用window監聽pagehide事件,在監聽事件中來清除那個下載app的定時器。
window.addEventListener('pagehide', function() {
                //清理下載app的定時器
            }, false);
複製程式碼
  1. 安卓webview中最好用iframe的方式跳轉,使用a標籤方式如果沒有安裝要拉起的app會報ERR_UNKNOWN_URL_SCHEME的錯。

相關文章