如何使用JavaScript調(diào)用手機平臺上的原生API

這篇文章主要為大家展示了“如何使用JavaScript調(diào)用手機平臺上的原生API”，內(nèi)容簡而易懂，條理清晰，希望能夠幫助大家解決疑惑，下面讓小編帶領(lǐng)大家一起研究并學(xué)習(xí)一下“如何使用JavaScript調(diào)用手機平臺上的原生API”這篇文章吧。

您也許會有一些需求，需要在您的前端應(yīng)用里使用到手機平臺的一些原生API，比如使用手機Mobile操作系統(tǒng)提供的傳感器(Sensor)。這些任務(wù)是JavaScript不能直接完成的，必須借助Cordova里Custom Plugin（自定義插件）來完成。注意看下圖紅色高亮的Custom Plugin，起到了一個橋梁的作用，溝通了Cordova應(yīng)用中的前端JavaScript代碼和手機操作系統(tǒng)中的原生API。

我們現(xiàn)在就來做一個實際的例子，我們選擇Android平臺為例。我在Android平臺用Java實現(xiàn)兩個整數(shù)相加，來模擬Android平臺上的native API。我將會在我的前端應(yīng)用里用JavaScript代碼來調(diào)用我在Android平臺上用Java實現(xiàn)的這個加法器。

1. 先使用npm安裝Cordova插件管理器。

命令行：npm -g install plugman

插件管理器成功下載后，就可以用它創(chuàng)建一個自定義插件了。

命令行：plugman create -name Adder -plugin_id jerry.adder -plugin_version 1.0,0

這個命令會自動創(chuàng)建一個名叫Adder的插件，插件id為jerry.adder, 版本號為1.0.0。

plugman會自動生成很多插件能夠工作的資源文件，全部放在名為Adder的文件夾內(nèi)。

2. 我希望這個Adder插件在安卓平臺上工作，因此進入Adder文件夾，添加該插件對Android平臺的支持：plugman platform add –platform_name android

執(zhí)行完畢后，Adder文件夾下自動生成子文件夾src/android和插件實現(xiàn)文件Adder.java。現(xiàn)在我可以在里面開始寫代碼了。

用Java實現(xiàn)兩個整數(shù)的加法運算。操作數(shù)都是通過JavaScript用參數(shù)args傳入的，計算結(jié)果通過回調(diào)上下文CallbackContext返回給JavaScript端。

public class Adder extends CordovaPlugin {    @Override
    public Boolean execute(String action, JSONArray args, CallbackContext callbackContext) throws JSONException {        if (action.equals("performAdd")) {            int arg1 = args.getint(0);            int arg2 = args.getint(1);            int result = arg1 + arg2;
            callbackContext.success("result calculated in Java: " + result);            return true;
        }        return false;
    }
}

3. 插件實現(xiàn)完畢，可以開始打包了。使用命令行plugman createpackagejson ./

這個命令會自動生成一個package.json文件。

Once done, the package.json file is generated within plugin folder.

把這個自定義的插件安裝到Cordova應(yīng)用去，命令行：cordova plugin add Adder。

一切正常的話，能看到BUILD SUCCESSFUL的提示。

如何用前端應(yīng)用的JavaScript消費這個Java實現(xiàn)的插件呢？

在你Cordova項目文件夾<project folder>/platforms/android/assets/www/js的index.js里，將下列JavaScript代碼粘貼進去：

var app = {initialize: function() {    document.addEventListener('deviceready', this.onDeviceReady.bind(this), false);
}
,onDeviceReady: function() {    this.receivedEvent('deviceready');
}
,receivedEvent: function(id) {    function success(result){        debugger;
        alert("Jerry plugin result: " + result);
    }
    ;
    setTimeout( function(){
        Cordova.exec(success, null, "Adder", "performAdd", [10,20]);
    }
    , 10000);
}
}
;
app.initialize();

關(guān)鍵代碼就這一句：Cordova.exec(success, null, "Adder", "performAdd", [10,20]);

意思是調(diào)用名為Adder的插件，執(zhí)行插件暴露的performAdd方法，傳入兩個參數(shù)10和20進去。Java插件的計算結(jié)果通過JavaScript回調(diào)函數(shù)success返回到前端應(yīng)用中，用alert打印出結(jié)果。

使用cordova compile打包Cordova應(yīng)用，生成APK文件。執(zhí)行該應(yīng)用，能觀察到10和20兩個操作數(shù)傳入到Java實現(xiàn)的插件中，結(jié)果30返回到前端并通過alert彈窗顯示，我們的自定義插件開發(fā)成功！

最后一步就是命令行cordova compile, 生成了最終的APK文件，然后就可以安裝到安卓手機上了。

以上是“如何使用JavaScript調(diào)用手機平臺上的原生API”這篇文章的所有內(nèi)容，感謝各位的閱讀！相信大家都有了一定的了解，希望分享的內(nèi)容對大家有所幫助，如果還想學(xué)習(xí)更多知識，歡迎關(guān)注億速云行業(yè)資訊頻道！