PhoneGap Plugin(4):原生插件常用物件與JS函式呼叫

當我們在撰寫原生程式時,時常會針對 Activity/UIView 等物件做進一步的處理,然而在撰寫 Cordova Plugin 時,我們該如何取得這些物件呢?另一方面,如果 Plugin 另外開啟一個執行緒(thread)來工作,完成時該如何呼叫 PhoneGap 裡的 JavaScript(JS) 程式?本篇將針對這兩點做說明。

Android 插件常用物件

首先我們可以看到 CordovaPlugin 這個物件,裡面有列出插件可以實作的所有方法。initialize() 是插件初始化的階段,可以讓我們取得 webView 的物件。如果你的程式會使用到 Activity 或 Context,也可以趁著這個階段儲存至全域變數。

private Activity activity;
private Context context;
private CordovaWebView webView;

public void initialize(CordovaInterface cordova, CordovaWebView webView) {
    this.activity = cordova.getActivity();
    this.context = activity.getApplicationContext();
    this.webView = webView;
}

從 Android 插件呼叫 JavaScript 函式

利用上面第 6、8 行儲存的物件,我們可以寫一個方法來呼叫 JavaScript function。第 12 行傳入的是 function 的名稱,你會看到 16 行的寫法和 HTML 的 標籤一樣。如此一來插件與 PhoneGap 主程式之間的溝通,就不限於完成時的 callbackContext() 呼叫。

private void JScallback(final String js) {   //呼叫JavaScript
    activity.runOnUiThread(new Runnable() {
        @Override
        public void run() {
            webView.loadUrl("javascript:" + js);
        }
    });
}

從 iOS 插件呼叫 JavaScript 函式

iOS 的寫法比 Android 簡單許多。我們知道 iOS 在回傳插件的結果,是透過 commandDelegate 這個物件。翻開它的原始碼一看,會看到它有提供一個 evalJs 的方法可以直接呼叫,因此它的呼叫只需要下面 21 行就能完成。若是不需要回傳值,使用 23 行的語法即可。

NSString* myResult;
[self.commandDelegate evalJs:[NSString stringWithFormat: @"myJSfunction(%@)", myResult]];

[self.commandDelegate evalJs:@"myJSfunction()"];

這篇文章在我的草稿裡待了很久,因為我一直不曉得 iOS 要如何呼叫 JavaScript。後來是一位會寫 iOS 的同事幫忙查到的,沒想到這麼簡單。由於我自己目前只對 Android 比較熟悉,後續的分享可能只好以他為主。