Shulou(Shulou.com)06/02 Report--

This article mainly shows you "how to use JavaScript to call native API on mobile platform". The content is easy to understand and clear. I hope it can help you solve your doubts. Let me lead you to study and learn this article "how to use JavaScript to call native API on mobile platform".

You may have some needs to use some of the native API of the mobile platform in your front-end applications, such as using the Sensor provided by the mobile phone's Mobile operating system. These tasks cannot be done directly by JavaScript and must be accomplished with the help of Custom Plugin (custom plug-ins) in Cordova. Note that the red and highlighted Custom Plugin below acts as a bridge between the front-end JavaScript code in the Cordova application and the native API in the mobile operating system.

Let's do a practical example now. let's choose the Android platform as an example. I use Java to add two integers on the Android platform to simulate native API on the Android platform. I will use JavaScript code in my front-end application to call the adder I implemented in Java on the Android platform.

1. First install the Cordova plug-in manager using npm.

Command line: npm-g install plugman

After the plug-in manager has been successfully downloaded, you can use it to create a custom plug-in.

Command line: plugman create-name Adder-plugin_id jerry.adder-plugin_version 1.0

This command automatically creates a plug-in called Adder with the plug-in id jerry.adder and version number 1.0.0.

Plugman automatically generates many resource files that the plug-in can work on, all in a folder called Adder.

two。 I want this Adder plug-in to work on Android, so go to the Adder folder and add the plug-in's support for the Android platform: plugman platform add-platform_name android

After the execution is finished, the subfolder src/android and plug-in implementation file Adder.java are automatically generated under the Adder folder. Now I can start writing code in it.

Use Java to realize the addition operation of two integers. The operands are passed in through JavaScript with the parameter args, and the result of the calculation is returned to the JavaScript side through the callback context CallbackContext.

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. The plug-in is implemented and ready to be packaged. Use the command line plugman createpackagejson. /

This command automatically generates a package.json file.

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

Install this custom plug-in to the Cordova application, command line: cordova plugin add Adder.

If everything is all right, you can see the hint of BUILD SUCCESSFUL.

How to use the JavaScript of the front-end application to consume the plug-in implemented by Java?

In the index.js of your Cordova project folder / platforms/android/assets/www/js, paste the following JavaScript code in:

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 Magazine 20]);}, 10000);}; app.initialize ()

The key code is this sentence: Cordova.exec (success, null, "Adder", "performAdd", [10mem20])

It means to call a plug-in named Adder and execute the performAdd method exposed by the plug-in, passing in two parameters 10 and 20. The calculation result of the Java plug-in is returned to the front-end application through the JavaScript callback function success, and the result is printed out with alert.

Use cordova compile to package Cordova applications and generate APK files. When executing the application, we can observe that the operands 10 and 20 are passed into the plug-in implemented by Java, and the result 30 is returned to the front end and displayed through the alert pop-up window that our custom plug-in has been developed successfully!

The final step is the command line cordova compile, which generates the final APK file, which can then be installed on the Android phone.

The above is all the content of the article "how to use JavaScript to call native API on mobile platform". Thank you for reading! I believe we all have a certain understanding, hope to share the content to help you, if you want to learn more knowledge, welcome to follow the industry information channel!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.