非常早曾经写了一篇博客,总结cordova插件怎么调用到原生代码:cordova调用过程,只是写得太水。基本没有提到原理。近期加深了一点理解,又一次补充说明一下

js调用native

以下是我们产品中的代码片段:

datePicker.show(options, function (date) {
var month = date.getMonth() + 1;
callback(null, date.getFullYear() + "-" + month + "-" + date.getDate());
});

cordova插件终于表现出来的都是js接口,而且调用者全然不须要知道自己在调用一个cordova插件

可是在不论什么cordova js方法内部,最后一定会调用cordova.exec函数:

cordova.exec(successCallback, errorCallback, "DatePicker", "show", []);

然后就进入了关键的cordova.exec函数。这是cordova框架的js端的最后一环。就是由它完毕对ios native的调用

在exec函数里,首先会推断平台。可能是android,ios或者wp,其它平台本文省略。假设是ios平台,cordova会採用下面2种方式的一种。来与ios native code交互

通过iframe

cordova.exec往当前的html中插入一个不可见的iframe,从而向UIWebView请求载入一个特殊的URL。这个URL里当然就包括了要调用的native plugin的类名,方法名,參数,回调函数等信息

接下来。因为被请求载入URL,于是UIWebViewDelegate的这种方法被调用:

- (BOOL)webView:(UIWebView*)theWebView shouldStartLoadWithRequest:(NSURLRequest*)request navigationType:(UIWebViewNavigationType)navigationType

这里就进入了native側,从request里就拿到了js端传过来的信息,然后调用到native plugin

通过XHR

还有一种方式,cordova.exec里直接发起一个XHR请求,被native側的NSURLProtocol拦截,于是调用到这个native方法:

+ (BOOL)canInitWithRequest:(NSURLRequest*)theRequest

也进入了native側。然后以相同的方式调用到native plugin

在2种方式中,cordova会优先选择XHR方式。仅仅有当XHR方式不可用时,才会使用iframe的方式。

只是不管怎么样。这2种方法都为从js到native打开了一条通道,剩下的就是传递參数和路由的问题了

native调用js

还有一条通道就简单的多,由于iOS提供了原生支持,所以不须要想特别的办法。即通过UIWebView的这种方法:

- (NSString *)stringByEvaluatingJavaScriptFromString:(NSString *)script;

看一下cordova框架native側的代码,我去掉了凝视和无关代码:

- (void)evalJsHelper:(NSString*)js
{
if (![NSThread isMainThread] || !_commandQueue.currentlyExecuting) {
[self performSelectorOnMainThread:@selector(evalJsHelper2:) withObject:js waitUntilDone:NO];
} else {
[self evalJsHelper2:js];
}
}
- (void)evalJsHelper2:(NSString*)js
{
NSString* commandsJSON = [_viewController.webView stringByEvaluatingJavaScriptFromString:js];
}

能够看到,正是通过UIWebView提供的这种方法完毕的,可是,一定运行在main thread

同步和异步的问题

从上面的分析能够发现。从js调用native,2种方式都必然是异步的。而从native回到js。却是一个同步的方法,并且是跑在主线程里

调用cordova插件的代码,对返回值的处理一定要放在回调函数里。由于结果是异步返回的。同一时候,回调函数的运行时间不能太长,否则会堵塞native主线程

參考

本文參考了下面2篇文章,都写得非常好:

iOS版PhoneGap原理分析

浅析Cordova for iOS

cordova与ios native code交互的原理的更多相关文章

  1. Cordova - 与iOS原生代码交互1(通过JS调用Swift方法)

    在前面的文章中介绍的了如何使用Cordova进行跨平台应用的开发,使用Cordova的话基本上就不需要在写系统原生代码了,只要通过编写html页面和js方法即可. 但在有些特殊情况下,还是是需要htm ...

  2. 优秀开源代码解读之JS与iOS Native Code互调的优雅实现方案

    简介 本篇为大家介绍一个优秀的开源小项目:WebViewJavascriptBridge. 它优雅地实现了在使用UIWebView时JS与ios 的ObjC nativecode之间的互调,支持消息发 ...

  3. Hybrid----优秀开源代码解读之JS与iOS Native Code互调的优雅实现方案-备

    本篇为大家介绍一个优秀的开源小项目:WebViewJavascriptBridge. 它优雅地实现了在使用UIWebView时JS与ios 的ObjC nativecode之间的互调,支持消息发送.接 ...

  4. Cordova - 与iOS原生代码交互2(使用Swift开发Cordova的自定义插件)

    在前一篇文章中我介绍了如何通过 js 与原生代码进行交互(Cordova - 与iOS原生代码交互1(通过JS调用Swift方法)),当时是直接对Cordova生成的iOS工程项目进行编辑操作的(添加 ...

  5. webview的javascript与Native code交互

    http://my.oschina.net/u/1376187/blog/172296 项目中使用了webview显示网页,其中需要网页和native方法有交互,搜索到一篇文章,转发分享一下: === ...

  6. [Cordova] 无法编译Visual Studio项目里Plugin副本的Native Code

    [Cordova] 无法编译Visual Studio项目里Plugin副本的Native Code 问题情景 开发Cordova Plugin的时候,开发的流程应该是: 建立Cordova Plug ...

  7. [原]iOS中 Web 页面与 Native Code 的一种通信方式

    在 iOS 开发中,Web 页面与 Native Code 通信可以分为两个方面: 1.Native Code 调用 Web 页面的方法:主要是调用页面中的 Javascript 函数. 2.Web ...

  8. [转]iOS hybrid App 的实现原理及性能监测

    转自:http://www.cocoachina.com/ios/20151118/14270.html iOS hybrid App 的实现原理及性能监测 2015-11-18 11:39 编辑:  ...

  9. React Native 从入门到原理一

    React Native 从入门到原理一 React Native 是最近非常火的一个话题,介绍如何利用 React Native 进行开发的文章和书籍多如牛毛,但面向入门水平并介绍它工作原理的文章却 ...

随机推荐

  1. 从jscript脚本混淆说起

    转载:http://www.freebuf.com/column/144897.html 脚本病毒是一个一直以来就存在,且长期活跃着的一种与PE病毒完全不同的一类病毒类型,其制作的门槛低.混淆加密方式 ...

  2. 如何防止Android反编译

    转自: http://my.eoe.cn/sandking/archive/19772.html http://www.cnblogs.com/zdz8207/archive/2012/01/28/d ...

  3. Fastjson.tojsonString中$ref对象重复引用问题

    import java.util.ArrayList; import java.util.List; import com.alibaba.fastjson.JSON; import com.alib ...

  4. protobuf 中的嵌套消息的使用 主要对set_allocated_和mutable_的使用

    protobuf的简单的使用,不过还留下了一个问题,那就是之前主要介绍的都是对简单数据的赋值,简单数据直接采用set_xx()即可,但是如果不是简单变量而是自定义的复合类型变量,就没有简单的set函数 ...

  5. c# GDI画图 双缓冲画图分析

    双缓冲绘图分析  1.Windows 绘图原理  我们在 Windows 环境下看到各种元素,如菜单.按钮.窗口.图像,从根本上说,都是“画”出来的.这时的屏幕,就相当于一块黑板,而 Windows ...

  6. Express定制参数解析错误响应值

    Nodejs的Express框架本身所提供的东西并没有其它框架那么多.其中的一个问题就是对于请求数据的解析. express中的请求对象并没有未经过解析的请求体,几乎所有的请求体都要经过类似于body ...

  7. 我使用的Sublime插件及配置

    我使用的Sublime插件及配置 增强型插件 Package Control 快捷键ctrl+~,调出命令行,运行: import urllib.request,os,hashlib; h = '29 ...

  8. 获取a'p'p签名

    1.第一种方式 https://open.weixin.qq.com/cgi-bin/showdocument?action=dir_list&t=resource/res_list& ...

  9. 允许root用户登录ssh

    使用普通用户登录Ubuntu系统,打开命令行窗口 更改root用户密码,命令:sudo passwd root 首先输入当前用户的密码 然后输入root账户的密码 确认root用户的密码 编辑ssh的 ...

  10. HDU 4417 Super Mario (划分树)(二分)

    Super Mario Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others)Total ...