上一篇介绍了Cordova开发环境搭建以及使用,不过该文是依赖CordovaLib.xcodeproj工程的也就是说必须要导入相关的工程以及文件,而我一直比较不喜欢这种方式,于是尝试只导入我需要的模块文件来构建我们的App,过程就不多说了,来看看成过吧(只是一个简单的登录示例)。
1 新建一工程命名Cordova
导入我们需要的文件如图
有一部分文件夹和文件涉及到公司信息了,所有打个码。下面介绍一下各文件:
代号 | 介绍 |
---|---|
1 | 存放html文件 |
2 | js文件,h5与原生交互用得到,想用cordova必须要懂点js |
3 | 是cordova的一些类文件(忘了展开了,一会附图吧),有一些会报错需要导入#import <Foundation/Foundation.h> |
4 | js执行文件 |
5 | js执行文件 |
6 | 原生类文件h5调用 |
这里就是你自己创建的类6(见上图)。
如果是加载本地文件,路径一定要设置正确才能加载出来。需求不一样这里就说怎么加载html了。到此基本配置完成
开始写代码
我们的html同事提供一个plugin.js文件,这个文件很重要,这是h5调用原生方法的入口,我们h5同事提供了这样一个方法:
var Utils = (function() {
/*
* apiGateWayPost 请求原声数据
* @param {object} success
**/
var __apiGatePost = function(serviceName, para, success, onErr) {
if(isH5Test) {
var ajax = new MYAJAX(serviceName, para, success,onErr);
} else {
loadShow();
var __data = {
"method": serviceName,
"para": para
};
function onAPISuceess(data) {
loadHide();
success(data);
}
function onErr(data) {
loadHide();
}
CDVOriginalPort('apiGateWayPost', __data, onAPISuceess, onErr);
}
}
}
文件4里面依然是js执行代码:
function CDVOriginalPort(RequestType, RequestData, fun_callbackSuccess, fun_callbackFail) {
if (RequestType == "apiGateWayPost") { //post请求
pact_apiGateWayPost(RequestData, fun_callbackSuccess, fun_callbackFail);
}
}
//post请求
function pact_apiGateWayPost(RequestData, fun_callbackSuccess, fun_callbackFail) {
oldAlert('111');
Pact.apiGateWayPost(RequestData, fun_callbackSuccess, fun_callbackFail);
}
文件5还是js执行代码:
cordova.define("cordova-plugin-Pact.Pact", function(require, exports, module) {
var exec = require('cordova/exec');
module.exports = {
apiGateWayPost: function(RequestData, onSuccess, onError) {
oldAlert('222');
exec(onSuccess, onError, "Pact", "apiGateWayPost", [RequestData]);
},
}
}
文件4和文件5是需要我们原生和h5人员沟通之后,我们来维护的。
看我们原生类6中的代码:
- (void)apiGateWayPost:(CDVInvokedUrlCommand *)command {
NSDictionary *old_dic = [command.arguments lastObject];
NSString *method = old_dic[@"method"];
NSMutableDictionary *para = old_dic[@"para"];
UIAlertController *alert = [UIAlertController alertControllerWithTitle:@"提示" message:@"333" preferredStyle:UIAlertControllerStyleAlert];
UIApplication *app = [UIApplication sharedApplication];
AppDelegate *delegate = (AppDelegate*)app.delegate;
[delegate.window.rootViewController presentViewController:alert animated:YES completion:nil];
}
这里我并没有做什么处理,只是给个提示框能不能走到这里而已,只要走到这个方法就说明h5已经可以调用我们原生的方法了,既然这样剩下的就要看我们心情来处理了,嘿嘿。
如果需要给h5传值的话可以在上方法中实现:
[self.commandDelegate runInBackground:^{
CDVPluginResult *result = [CDVPluginResult resultWithStatus:CDVCommandStatus_OK messageAsDictionary:nil];
[self.commandDelegate sendPluginResult:result callbackId:command.callbackId];
}];
具体怎么传还要看具体情况了,看效果:[图片上传中...(ACA719F3-88BB-41F2-8D49-F943C54C9F1E.png-a0c1e9-1517565156197-0)]
整个流程大体就是这样了,因为工程里面涉及一些公司信息,没有上传demo,以后时间可以补发一份,看完依然有疑问的小伙伴可以私下找我。个人感觉这种方式比起上一篇文章说的集成方式要省事一些,个人感觉哈。
谢谢各位捧场啦。先写到这里,先写到这里~