JS調用App方法及App調用JS方法

標籤：通過   擴大   sage   業務   bsp   忽略   pos   catch   就是   

做App內嵌H5項目時，經常會遇到js與App的互動，最普遍的就是方法的互相調用，那麼如何?方法的互相調用呢？

 

寫在前面：

　　如果只是小項目且後期擴大的可能性不大的時候，可以忽略，可如果是長期項目的話，那麼就需要考慮以下一些問題了。

　　1. 方法命名規範。

      　 如果考慮到以後會有大量的方法，那麼正常化的命名就很重要了，正常化的命名，既保證了名字的唯一性又保證了代碼的可讀性方便開發過程，也方便後期維護。

　  　 舉個栗子，  如果現在有一個方法，是關閉webview, js調用app的方法， 如果直接叫closePage， 那麼根本看不出來是要調用App的方法，混亂且有可能被其他命名覆蓋，那麼如果叫 JAMS__closePage ，即所有的js 與App的互動的方法都加 JAMS 那麼就很容易分辨了，且不易重名。

       2.安全性。

　　  如果在你的App內能開啟其他的網頁連結，那麼這些介面的安全性也是需要考慮的，即保證在指定的webview或者授權的webview內這些方法才能被調用，這點很重要。

　　  第一種方法是app內判斷webview地址來源，來匹配對用方法的使用權，顯然這個每次添加新頁及方法的時候，App都需要修改授權列表。

　　  第二種方法是，App開啟webview的時候，如果是自己的業務H5那麼調用的時候可以傳入一個token,每次調用方法時都校正token。

 

一， js調用App 方法

　　假設方法名為  JAMS__mark

 

　　android 系統：

　　　　window.android.JAMS__mark(params)   // @params為傳入的參數， app內可以收到 　　ios 系統：                 　　　　window.webkit.messageHandlers.closePage.postMessage(params)   // @params為傳入的參數， app內可以收到

       

然後可以封裝一下 像這樣

export function JAMS__mark() {    if (/android/i.test(navigator.userAgent)) {        try {            window.android.JAMS__mark(params)        } catch (e) {            console.log(e)        }    } else if (/ios|iphone|ipod|pad/i.test(navigator.userAgent)) {        try {            window.webkit.messageHandlers.JAMS__mark.postMessage(params)        } catch (e) {            console.log(e)        }    }}

 

 

 

二、 App調用js方法

 

App調用js 方法需要js將方法掛載在window下，這樣App才能調用到方法，

假設方法名叫    JAMS__success

 

window.JAMS__success = function () {

　　// do some thing

　　// if need some params ,you can alse return it

　　return params;

}

需要主要的是如果需要返回一些資料給App，那麼這些資料不能夠通過非同步來擷取，也不能夠有阻斷進程的語句如alert，否者，app將不能夠擷取到正確參數，而是得到 undefined，  例如在方法裡加個alert(‘1‘), 而 return 在 alert語句後。

 

（完）

 

JS調用App方法及App調用JS方法