h5跳轉到app的實現

       隨着業務的增長，可能存在這麼一種需求，就是須要從h5中直接跳轉到app。若是沒有安裝app的話，則提示到應用市場或者app store下載安裝。不過問題就在這個地方，單純的用h5是沒有方法判斷是否安裝過app的，不過這些是難不倒程序員的，他們一般會用這種代碼來解決

1 window.location.href = 'app的協議'；
2 
3 setTimeout(function() {
4 window.location.href = 'app的下載地址'
5 }，500)

      其實代碼很簡單，先去跳轉公司無線組app的自定義的schema協議；若是沒有安裝的app的話，第一行的代碼是不生效的，而後500ms跳轉到app的下載地址，一般是是藉助tx的親兒子應用寶或者app store 的下載鏈接。不過這種實現方式也是有問題的，由於你在微信中或者qq中即便安裝app的話，也不會跳轉到app中的，由於你司的app的schema協議是禁止跳轉的，除非加入了白名單。若是沒加入微信的白名單的話，解決方法一般在h5頁面某個地方加上一個簡單的tips.提示用瀏覽器打開這個頁面。若是安裝了app，在瀏覽器能夠正確的打開app的。固然，這是安裝了app的狀況，當沒有安裝app的話，上訴代碼在微信是沒有任何問題的，反正又無法跳schema的，跳轉到app的下載地址確定是萬無一失的。可是咱們在上一步提示用戶在瀏覽器打開頁面，這時候問題又來了。這時候會出現一個討厭的框框，這種框框是沒有啥好辦法禁止的。產生的緣由嘛。就是那個schema協議搞得鬼。這時候咱們的解決方式，就是在上一步的tip中提示‘若是安裝了app的話，用瀏覽器打開’，哈哈，這麼簡單的嘛，其實不少公司都是這麼作的，簡單直接。目前咱們的公司就是這種方式。或者直接給兩個按鈕算了。一個打開，一個下載。有些時候，化繁爲簡何嘗不是一種合適的方式。

     那麼有其餘的方式來解決嘛。按理說是有的。上文說到微信禁止了app的schema協議。其實有一種協議，微信是沒有禁止的，那就是universal links。關於怎麼配置的話其實不是咱們前端工程工做範疇的，甚至有寫無線端開發也是一臉懵逼，有興趣可直接百度。另外的一種方式是利用iframe,不過這種方式在ios9以上是不能成功的。因此這種方式也能夠直接pass。