前言


小的作为一个iOS程序猿,可能研究JavaScript以及H5相关的知识并不是为了真正的要去转行做这一方面,其实更多的为了要研究OC中的JavaScriptCore框架,JavaScriptCore框架主要是用来实现iOS与H5的交互.当然了,最早我曾经写过iOS浅谈webView的JS一种用法.(去掉web显示页的广告),这种算得上最简单的iOS与H5的交互了.现在混合编程越来越多,H5的相对讲多,所以研究JavaScriptCore框架是相当有必要的.好了不扯这些没用的了,来搞今天的主题—JavaScriptCore框架,首先来说说JavaScriptCore框架几个常用的类.

JavaScriptCore的类说明


#import  <JavaScriptCore/JavaScriptCore.h>

然后我们进入JavaScriptCore框架的JavaScriptCore.h,我们发现总共如下有几个类.

  • JSContext

JSContext代表一个JavaScript的执行环境的一个实例。所有JavaScript执行都是在上下文内进行。JSContext还用于管理对象的生命周期内JavaScript的虚拟机(API文档原文翻译)。作为上下文很多地方我们的都有可能使用过,比如CoreData,CoreGraphics等等,那么上下文对象到底是什么呢?你可以理解为是一个两者的连接桥梁,如图所示.

  • JSValue

JSValue的主要作用就是用来接收JSContext执行后的返回结果,当然了,JSValue可以是js的任意类型,例如,js中的变量,对象以及函数.下面我们就举个例子说明一下,例如我们现在需要从JSContext对象中接收到一个变量.我们可以如下所示.首先在

<script type="text/javascript">

var myObject = "myObject";

</script>

然后我们在OC的代码中如下表示,其中self.context代表着已经初始化完成的JSContext对象.

JSValue *myObject = self.context[@"myObject"];

当然了,我们如果需要在OC中使用JSValue对象,那么我们可能需要适当的转换一下他的类型,框架提供了很多方法.比如上面的例子我们想要打印的话就可以如下所示.

NSLog(@"%@",[myObject toString]);

  • JSManagedValue

JSManagedValue这个类其实到现在我还没有具体用到过.当时这里我也要根据API文档说明一下.JSManagedValue是JSValue的封装,用它可以解决JS和OC代码之间循环引用的问题,JSManagedValue最常用的用法就是安全的从内存堆区里面引用JSValue对象.如果JSValue存储在内存的堆区的方式是不正确的,很容易造成循环引用,然后导致JSContext对象不能正确的释放掉.

  • JSVirtualMachine

一个JSVirtualMachine对象其实代表着一个JavaScript对象空间或者一组执行资源。JSVirtualMachine支持线程安全锁,虚拟机,并发分配支持的JavaScript执行.也就说JSVirtualMachine用来管理整个JavaScript,当然了,这个类我也没有用到过.

  • JSExport

JSExport是一个协议,通过实现它可以完成把一个native对象暴漏给JS,当然了我们要指定native对象.比如我们指定native对象就是自身.如下所示.

self.context[@"native"] = self;

JavaScriptCore中JSContext对象的初始化


在进行iOS与H5的交互之前,我们需要做的是对JSContext对象进行初始化的设置,全程是在webView的– (void)webViewDidFinishLoad:(UIWebView *)webView这个代理方法中进行的.所以我们需要对webView进行初始化以及设置代理,这里就不过多的言语了.我们直接看一下在代理方法中如何对JSContext对象进行初始化设置.代码如下所示.

- (void)webViewDidFinishLoad:(UIWebView *)webView{

//对JSContext对象进行初始化

self.context = [webView valueForKeyPath:@"documentView.webView.mainFrame.javaScriptContext"];

//验证JSContext对象是否初始化成功

self.context.exceptionHandler = ^(JSContext *context, JSValue *exceptionValue)

{

context.exception = exceptionValue;

};

}

JavaScript调取OC代码


上一个模块我们已经对JSContext对象进行了初始化,那么要使用JavaScript调取OC代码主要有两种方式,一种是使用block(简单粗暴);另外一种是使用JSExport协议(决胜千里).

  • block方式

block方式比较简单,也是我比价推荐的一种,但是要注意防止循环引用问题的发生.首先我们先说一下不带有参数的函数调用,也就是说我们不需要从网页那边有参数的传值,比如跳转页面等等.代码如下所示.

HTML文件中的

标签的按钮代码

<button onclick="myAction();" style="">点击按钮返回上一个页面</button>

OC中在- (void)webViewDidFinishLoad:(UIWebView *)webView方法中对block块进行代码实现.

__weak typeof(self)temp = self;

self.context[@"myAction"] = ^(){

[temp.navigationController popViewControllerAnimated:YES];

};

接下来我们看一下,通过页面的传值,我们把H5标签的值作为参数进行传值操作,并且调用OC的block进行打印.

HTML文件中的

标签的div标签代码(一个输入框,一个按钮)

<input type="text" name="输入框" id="textField" placeholder="请输入要打印的信息" />

<button onclick="log(document.getElementById('textField').value);">打印输入框信息</button>

然后我们在OC的代码中实现以下block函数.其中string参数就是网页中输入框的值.

self.context[@"log"] = ^(NSString *string){

NSLog(@"%@",string);

};

效果图如下所示.坐标是手机模拟器,右边是Xcode控制台.

  • JSExport协议方式

通过实现JSExport协议方式进行OC与JS的交互,这里我只是简单的实现以下没有参数的函数调用.首先,我们在HTML文件中创建一个按钮用来调用OC中JSExport协议方法.

<button onclick="native.myLog();">调用OC中myLog方法</button>

我们需要把native对象指定为当前控制器,也就是自己.这句代码是在- (void)webViewDidFinishLoad:(UIWebView *)webView方法中实现的.

self.context[@"native"] = self;

然后我们要写一个继承于JSExport的协议,协议如下所示.这里我要做一下对JSExportAs(PropertyName,Selector)这个宏定义做一下解释,也就说在PropertyName代表着JS函数的名称,而Selector代表着OC的协议方法,要注意的是Selector必须要有参数,不管是否需要传值.(不知所以然.

浅谈 iOS 与 H5 的交互- JavaScriptCore 框架的更多相关文章

  1. 浅谈iOS视频开发

     浅谈iOS视频开发 这段时间对视频开发进行了一些了解,在这里和大家分享一下我自己觉得学习步骤和资料,希望对那些对视频感兴趣的朋友有些帮助. 一.iOS系统自带播放器 要了解iOS视频开发,首先我们从 ...

  2. 浅谈iOS中的userAgent

    浅谈iOS中的userAgent   User-Agent(用户代理)字符串是Web浏览器用于声明自身型号版本并随HTTP请求发送给Web服务器的字符串,在Web服务器上可以获取到该字符串. 在公司产 ...

  3. 浅谈iOS多线程

    浅谈iOS多线程 首先,先看看进程和线程的概念. 图1.1 这一块不难理解,重点点下他们的几个重要区别: 1,地址空间和资源:进程可以申请和拥有系统资源,线程不行.资源进程间相互独立,同一进程的各线程 ...

  4. iOS 开发与H5交互(JavaScriptCore框架的使用)

    现在的iOS项目中嵌入了越来越多的Web界面,当然是为了方便,那么为了迎合这一趋势,作为iOS开发程序员,我们必须要了解怎么样用OC去和这些Web界面进行交互.这里介绍的是JavaScriptCore ...

  5. 浅谈iOS中MVVM的架构设计与团队协作

    说到架构设计和团队协作,这个对App的开发还是比较重要的.即使作为一个专业的搬砖者,前提是你这砖搬完放在哪?不只是Code有框架,其他的东西都是有框架的,比如桥梁等等神马的~在这儿就不往外扯了.一个好 ...

  6. IOS中 浅谈iOS中MVVM的架构设计与团队协作

    今天写这篇文章是想达到抛砖引玉的作用,想与大家交流一下思想,相互学习,博文中有不足之处还望大家批评指正.本篇文章的内容沿袭以往博客的风格,也是以干货为主,偶尔扯扯咸蛋(哈哈~不好好工作又开始发表博客啦 ...

  7. 浅谈iOS中MVVM的架构设计与团队协作【转载】

    今天写这篇文章是想达到抛砖引玉的作用,想与大家交流一下思想,相互学习,博文中有不足之处还望大家批评指正.本篇文章的内容沿袭以往博客的风格,也是以干货为主,偶尔扯扯咸蛋(哈哈~不好好工作又开始发表博客啦 ...

  8. 浅谈iOS需要掌握的技术点

    鉴于很多人的简历中的技术点体现(很多朋友问我iOS需要知道注意哪些)! 技术点: 1.热更新 (及时解决线上问题) 2.runtime(json解析.数据越界.扩大button点击事件.拦截系统方法) ...

  9. 浅谈iOS网络编程之一入门

    计算机网络,基本上可以抽象是端的通信.实际在通讯中会用到不同的设备,不同的硬件中,为了能友好的传输信息,那么建立一套规范就十分必要了.先来了解一些基本概念 了解网络中传输的都是二进制数据流.  2.了 ...

随机推荐

  1. Python实现爬虫设置代理IP和伪装成浏览器的方法(转载)

    https://www.jb51.net/article/139587.htm chrome_options = webdriver.ChromeOptions() chrome_options.ad ...

  2. Kafka:ZK+Kafka+Spark Streaming集群环境搭建(八)安装zookeeper-3.4.12

    如何搭建配置centos虚拟机请参考<Kafka:ZK+Kafka+Spark Streaming集群环境搭建(一)VMW安装四台CentOS,并实现本机与它们能交互,虚拟机内部实现可以上网.& ...

  3. capwap学习笔记——初识capwap(三)

    2.5.6 CAPWAP状态机详解 2.5.6.1 Start to Idle 这个状态变迁发生在设备初始化完成. ¢  WTP: 开启CAPWAP状态机.     ¢  AC:  开启CAPWAP状 ...

  4. Oracle导入excel数据快速方法

    Oracle导入excel数据快速方法 使用PLSQL  Developer工具,这个可是大名鼎鼎的Oracle  DBA最常使用的工具.    在单个文件不大的情况下(少于100000行),并且目的 ...

  5. Windows上Boost的编译步骤

    一.FQ下载Boost最新版本 官网:http://www.boost.org/ 假设解压到:D:\Applicaton\DevTools\boost\boost_1_65_1 二.使用VS编译器 c ...

  6. spring boot 运行提示:Process finished with exit code 1

    spring boot 运行提示:Process finished with exit code 1 经检查发现是由于在application.properties配置文件中将某些自定义配置项移除了, ...

  7. 两个自定义对象List列表取交集(intersection)

    public static void main(String[] args) { List<Fpxx> list = ListUtils.intersection(getFpList1() ...

  8. HttpLuaModule——翻译(Nginx API for Lua)

    现在我已经将翻译的内容放到:http://wiki.nginx.org/HttpLuaModuleZh Nginx API for Lua Introduction 各种各样的*_by_lua和*_b ...

  9. 通过淘宝接口免费获取IP地址信息

    1.获取互联网访问IP信息 一般获取互联网访问的IP的相关信息一般都是收费接口,免费的接口不多,我使用到一个接口如下: http://ip.taobao.com/service/getIpInfo.p ...

  10. MVC+WCF框架下广告位管理——文件上传

    广告位是站点中不可缺少的内容之中的一个.也是能直接给我们站点带来经济收益的内容之中的一个. 好的广告位不仅不会强宾压主,而会为我们的站点锦上添花.起到画龙点睛的作用.因此设计好广告位也是开发过程中一大 ...