混合开发H5，Cordova交互

这篇文章这要书写几个页面的逻辑关键，谁关联着谁

先看一下创建后的文件层级关系

1.png

1.下图为config.xml的配置

<feature name="Identifer">
        <param name="ios-package" value="CordovaPlugin" />
    </feature>

2.下图为js调用getData的配置

cordova.define("com.test.client.web.plugin.cordova", function(require, exports, module) {
module.exports = {
getData: function(ocuID, success) {
        exec(success, null, "Identifer", "getData", [ocuID]);
    }    
 });
});

3.下图为plugin类 .h .m

#import "CDV.h"

@interface CordovaPlugin : CDVPlugin

- (void)getData:(CDVInvokedUrlCommand *)command;
@end

@implementation CordovaPlugin

- (void) getData:(CDVInvokedUrlCommand *)command
{

NSDictionary *dic;
    NSString *strJson = [dic JSONString];

//把获得的参数转成String类型，然后下面回调，给j's
[self.commandDelegate runInBackground:^{
        CDVPluginResult *result = [CDVPluginResult resultWithStatus:CDVCommandStatus_ERROR messageAsString:strJson];
        [self.commandDelegate sendPluginResult:result callbackId:command.callbackId];
    }];
}
//字典转json串
- (NSString *)JSONString
{
  return([JKSerializer serializeObject:self options:JKSerializeOptionNone encodeOption:(JKEncodeOptionAsString | JKEncodeOptionCollectionObj) block:NULL delegate:NULL selector:NULL error:NULL]);
}

4.cordova配置

cordova.define('cordova/plugin_ext_list', function(require, exports, module) {
               module.exports = [
              {
"file": "plugins/com.test.plugin.web.test/www/test.js",
"id": "com.test.client.web.plugin.cordova",
"clobbers": ["Identifer" ]
              }
];
module.exports.metadata = 
 // TOP OF METADATA
{
               
}
 // BOTTOM OF METADATA
});

5.js中的配置

5.png

把这些关联下，以前面数字为标记。
1的Identifer要与2的Identifer还有4图中的Identifer必须一致，并且要与最后图5中的保持一致（图5为js类）。
1的CordovaPlugin为当前项目的OC plugin类，所以要与3的类名一致。
2的exec里的getData参数其实就是上面说的项目OC plugin类里的方法，2的getData与3的方法相对应。
2代码的getData: function(ocuID, success)
这个getData 是h5的方法调取。
2和4的id：com.test.client.web.plugin.cordova必须一致。
4的file 是路径，不懂的可以回顶部看层级关系对应下就好。

2的代码就是顶部图中的test.js