编写规则
具体规则参见官网文档,比较清晰,有示例。
详情参考:
Plugin Development Guide
iOS Plugin Development Guide
Android Plugin Development Guide
一、Cordova-Plugin的组成部分
./cordova-plugin-network-information/
|-src/ ................................. 插件原生部分代码
| |-android/ .......................... Android 平台
| | '-NetworkManager.java*
| |-browser/ .......................... 浏览器 平台
| | '-network.js
| '-ios/ .............................. iOS 平台
| |-CDVConnection.h
| |-CDVConnection.m
| |-CDVReachability.h
| '-CDVReachability.m
|-tests/ ............................... 测试
| |-plugin.xml
| '-tests.js
|-www/ ................................. 与原生桥接的 JS,如果不同平台代码有差异,这个文件夹下,也可以再分平台
| |-android/
| |-ios/
| |-Connection.js
| '-network.js
|-package.json ......................... 描述文件(用于在代码库注册关键字、描述依赖等)
`-plugin.xml ........................... 配置文件(安装插件时,会安装到平台的 config.xml 中)
二、插件中,负责桥接部分的 JS
可以多个平台共用,如有区别,也可以每个平台分开编写
cordova.define("mytestplg.ttt", function(require, exports, module) {
var exec = require('cordova/exec');
// 成功回调函数
function successCallback(oo) {
alert('ok ' + oo);
}
// 失败回调函数
function failureCallback(ee) {
alert('err ' + ee);
}
// 这里用于编写对外提供的调用方法
var myJSObj = {
myAdd: function(arg1, arg2) {
alert('exec');
//!!!重要!exec 是调用的核心方法,这里 exec 的五个参数:
var ret = exec(
successCallback, // 成功回调函数
failureCallback, // 失败回调函数
"MyPlugin2", // config.xml 中对应 feature 的 name
"doMyAdd", // iOS 中为调用的具体方法名,通过 runtime 执行;Android中会执行固定方法,但是会把这个值作为参数传入,原生 Android 代码根据参数值来做区分执行
[arg1, arg2] // 参数数组
);
alert('rrr ' + ret);
return ret;
},
vv: 'abc'
};
module.exports = myJSObj;
});
三、插件配置文件 plugin.xml
插件配置文件,安装时,根据配置,做相应平台的设置
-
header-file
、source-file
标签:插件原生代码路径,用于将文件复制到各个工程原生代码中 -
config-file
标签:用于指定配置文件 -
feature
标签:重要!!!用于指定各平台插件的配置方案,安装时,会把相应平台的配置,插入各个平台的config.xml
。插件负责桥接的 JS 中,exec
的第三个参数,就是feature
的name
,feature
中,会指定插件加载的具体类 -
js-module
标签:指定平台桥接 JS 的文件 -
clobbers
标签:指定平台桥接 JS 中输出的对象注入的全局变量。由于这个变量由 HTML 开发人员在各平台统一调用,所以该值尽量要在各平台保持一致,这部分会被插入到cordova_plugins.js
中,格式如下:
/**
cordova_plugins.js
此文件由命令行根据配置文件自动生成,不用修改。
这里只做格式展示。
*/
cordova.define('cordova/plugin_list', function(require, exports, module) {
module.exports = [{
"file": "plugins/mytestplg/www/ttt.js", //js接口文件
"id": "mytestplg.ttt", //标识
"pluginId": "mytestplg-ttt", //标识
"clobbers": [
"ttt" //注入到浏览器中的变量名
]
}];
});
<!-- plugin.xml,此文件需要插件开发时自行编写,与插件一起提供 -->
<?xml version="1.0" encoding="UTF-8"?>
<plugin id="mocha-plugin-demo" version="0.1.0" xmlns="http://apache.org/cordova/ns/plugins/1.0">
<name>Plugin Demo</name>
<author>Mocha</author>
<description>插件演示</description>
<license>MIT</license>
<keywords>cordova, javascript</keywords>
<repo/>
<issue/>
<!-- android -->
<platform name="android">
<source-file src="src/android/WebViewBack.java" target-dir="src/com/mochasoft/cordova/plugins/webback"/>
<config-file parent="/*" target="res/xml/config.xml">
<feature name="WebViewBack">
<param name="android-package" value="com.mochasoft.cordova.plugins.webback.WebViewBack"/>
</feature>
</config-file>
<js-module name="webviewback" src="www/android/goback.js">
<clobbers target="WebViewBack"/>
</js-module>
</platform>
<!-- ios -->
<platform name="ios">
<header-file src="src/ios/WebGoBack.h"/>
<source-file src="src/ios/WebGoBack.m"/>
<config-file parent="/*" target="config.xml">
<feature name="WebViewBack">
<param name="ios-package" value="WebGoBack"/>
<param name="onload" value="true"/>
</feature>
</config-file>
<js-module name="webviewback" src="www/ios/webviewback.js">
<clobbers target="WebViewBack"/>
</js-module>
</platform>
</plugin>
四、原生插件编写(iOS)
插件的实现,继承关系,返回值方式
插件继承自 CDVPlugin
/**
插件原生相关代码
*/
// ========================== MyPlugin.h ==================================
@interface MyPlugin : CDVPlugin
- (void)myInvokeMethod:(CDVInvokedUrlCommand *)command; // 具体执行的方法
@end
// ========================== MyPlugin.m ==================================
@interface MyPlugin ()
@end
@implementation MyPlugin
// 具体执行方法的实现
- (void)myInvokeMethod:(CDVInvokedUrlCommand *)command {
// 通过command变量获取参数方式:
id argument = [command argumentAtIndex:0 withDefault:@(50)];
//初始化用于保存结果的 Dictionary
NSMutableDictionary *result_dict = [NSMutableDictionary dictionary];
CDVPluginResult *pluginResult = nil;
if (执行成功) {
// 配置成功时的 result_dict
pluginResult = [CDVPluginResult resultWithStatus:CDVCommandStatus_OK
messageAsDictionary:result_dict];
}else {
NSString *errMsg = [self getErrorMsg:self.errCode];
// 配置失败时的 result_dict
pluginResult = [CDVPluginResult resultWithStatus:CDVCommandStatus_ERROR
messageAsDictionary:result_dict];
}
// 执行回调
[self.commandDelegate sendPluginResult:pluginResult
callbackId:command.callbackId];
}
@end