微信端調用第三方app實例，實現了本地沒有app跳轉到下載頁面，安裝了app直接喚起app解決方案共享，親測可用

一、需求分析

       1、實現app之間的通信有多種方式

       單從前端角度來看，需要利用IOS 與 Android  都支持一種叫做 URL scheme 協議的鏈接。比如網易新聞客戶端的協議爲 newsapp://xxxxx  採用URL Scheme鏈接方式解決即可，

        2、什麼是URL Scheme？

        URL Scheme就是一個可以讓app相互之間可以跳轉的對外接口，爲方便app之間互相調用而設計的。通過給APP定義一個唯一的URL路徑來從外部快速的打開這個指定的APP，每個app的URL Scheme都是不一樣的，如果存在一樣的URL Scheme，那麼系統就會響應先安裝那個app的URL Scheme，因爲後安裝的app的URL Scheme被覆蓋掉了，是不能被調用的。

這個協議不需要前端去實現，只需要將協議放在 a 標籤的 href 屬性裏，或者使用 location.href 與 iframe 來實現激活這個鏈接。

        3、URL Scheme有哪些應用？

1、  第三方分享的SDK就是通過這種方式來實現分享的，我們將需要分享的數據傳遞給SDK，SDK通過OpenURL來打開第三方應用傳遞數據，返回時SDK來處理OpenUrl的參數，實現查看分享的回調。

2、  調用微信、支付寶等客戶端完成支付的功能。

3、  第三方應用調用系統所帶的地圖軟件。

4、 從瀏覽器中某一頁面的點擊事件可以打開對應客戶端的某一個界面，就是通過APP協議 URL Scheme:// + 參數 來完成喚醒跳轉客戶端界面的。

  二、代碼實現(以稅務局app爲參考)

當納稅人在微信端發起授權時，直接喚起電子稅務局APP進行授權URLScheme爲：taxsdapp://taxbs:9999，URL路徑爲：icbc/oauth (銀行簡稱/操作)

未編碼的授權URLScheme爲：

taxsdapp://taxbs:9999/icbc/oauth?params="{"yhdm":"402455350018","cpmc":"產品名稱"稅e貸":"產品編碼","syd01":"簽名":”402455350018syd0110013”}"

編碼後的授權URLScheme爲： 

taxsdapp://taxbs:9999/icbc/oauth?params=InsieWhkbSI6IumTtuihjOS7o+eggSIsImNwbWMiOiLkuqflk4HlkI3np7AiLCJjcGJtIjoi5Lqn5ZOB57yW56CBIiwic2lnbmF0dXJlIjoi562+5ZCNIn0iIA==

 

<a  ’href="taxsdapp://taxbs:9999/icbc/oauth?params=eyJ5aGRtIjoic2RueCIsImNwbWMiOiLnqI5l6LS3IiwiY3BibSI6InRheDAxIiwic2lnbmF0dXJlIjoiOTU1NTVjM2Q1ZGJjOTg4NzRlMTFiNTE4YzQxOWM3OGZiNTM0YjBkZCJ9"> </a>

給a標籤一個點擊事件，如果本地安裝了相應的app則提示用戶是否打開

如果本地沒有安裝對應的app則通過

document.hidden H5新增的api

判斷當前頁面是否處於隱藏狀態，false則頁面處於隱藏狀態，並且在3秒內跳轉到APP下載頁面

Let hidden = window.document.hidden || window.doument.mozHidden || window.document.webkitHidden

setTimeout(function(){

             !hidden && setTimeout(function(){

                   if (new Date() - clickedAt < 3000){ 

                       window.location = 'http://etax.shandong.chinatax.gov.cn/ydsw_webservice/qyd_ydsw.jsp'; 

                   } 

             }, 500);      

         }, 500)