非常早曾经写了一篇博客,总结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. 调用SMTP发送有附件的邮件

    using System; using System.Collections.Generic; using System.ComponentModel; using System.Data; usin ...

  2. php 计算函数执行时间的方法及获得微妙的方法

    // 获得微妙方法 function getMillisecond() { list($s1, $s2) = explode(' ', microtime()); return (float)spri ...

  3. opengl glEnableClientState() 和 glDisableClientState() 作用

    http://zhidao.baidu.com/link?url=c3m55lgpjhU1Rb7TEP-aTGQAX3-GrcBk5NaUC2UA1ZtQiCCtHJzB_KoG7pWvPEybfYv ...

  4. flask的orm框架(SQLAlchemy)-创建表

    # 转载请留言联系 ORM 是什么? ORM,Object-Relation Mapping.意思就是对象-关系映射.ORM 主要实现模型对象到关系数据库数据的映射. 优点 : 只需要面向对象编程, ...

  5. python的递归算法学习(2):具体实现:斐波那契和其中的陷阱

    1.斐波那契 什么是斐波那契,斐波那契额就是一个序列的整数的排序,其定义如下: Fn = Fn-1 + Fn-2 with F0 = 0 and F1 = 1 也就是,0,1,1,2,3,5,8,13 ...

  6. AC日记——Little Elephant and Function codeforces 221a

    A - Little Elephant and Function 思路: 水题: 代码: #include <cstdio> #include <iostream> using ...

  7. JDBC二部曲之_事物、连接池

    事务 事务概述 事务的四大特性(ACID) 事务的四大特性是: l  原子性(Atomicity):事务中所有操作是不可再分割的原子单位.事务中所有操作要么全部执行成功,要么全部执行失败. l  一致 ...

  8. servlet之request

    1. request的setAttribute与getAttribute方法一般都是成对出现的,首先通过setAttribute方法设置属性与属性值,然后通过getAttribute方法根据属性获取到 ...

  9. Python_Tips[2] -> 函数延后估值及字节码分析

    函数延后估值及字节码分析 在一个循环中定义了函数 f 但是并未对其进行调用,在循环结束后调用,此时i值为3故最终3个函数输出均为9.而非1, 4, 9. 这是由于在定义闭包函数 f 时,传入变量 i, ...

  10. SpringBoot日志管理

    一.简介 小张:开发一个大型系统:1.System.out.println(""):将关键数据打印在控制台:去掉?写在一个文件?2.框架来记录系统的一些运行时信息:日志框架 : z ...