摘要
看了不少别人写的博客或者论坛, 关于 iOS 与 html5 交互方法大概主要有 5 种方式:
- 1.利用WKwebView进行交互 (系统API) 2.利用UIWebView进行交互 (系统API) 3.苹果的javascriptcore.framework框架;
- 4.跨平台cordova框架;
- 5.oc第三方WebViewJavascriptBridge
今天主要介绍前两种, 后三种大家有兴趣的自己查看资料.
下面我们来介绍第一种方式:
1. 利用 WKWebView 进行交互效果图
通过本篇文章,至少可以学习到:
- 1. OC如何给JS注入对象及JS如何给iOS发送数据2. JS调用alert、confirm、prompt时,不采用JS原生提示,而是使用iOS原生来实现3. 如何监听web内容加载进度、是否加载完成4. 如何通过js来跳转到iOS指定的页面上
如何处理去跨域问题
创建配置类
在创建 WKWebView 之前,需要先创建配置对象,用于做一些配置:
配置偏好设置
偏好设置也没有必须去修改它,都使用默认的就可以了,除非你真的需要修改它:
配置 web 内容处理池
其实我们没有必要去创建它,因为它根本没有属性和方法:
- web内容处理池,由于没有属性可以设置,也没有方法可以调用,不用手动创建.
配置 Js 与 Web 内容交互
WKUserContentController 是用于给 JS 注入对象的,注入对象后,JS 端就可以使用:
- window.webkit.messageHandlers..postMessage()
来调用发送数据给 iOS 端,比如:
AppModel 就是我们要注入的名称,注入以后,就可以在 JS 端调用了,传数据统一通过 body 传,可以是多种类型,只支持 NSNumber, NSString, NSDate, NSArray,NSDictionary, and NSNull 类型。
下面我们配置给 JS 的 main frame 注入 AppModel 名称,对于 JS 端可就是对象了:
当 JS 通过 AppModel 发送数据到 iOS 端时,会在代理中收到:
所有 JS 调用 iOS 的部分,都只可以在此处使用哦。当然我们也可以注入多个名称(JS 对象),用于区分功能。
创建 WKWebView
加载 H5 页面
配置代理
如果需要处理 web 导航条上的代理处理,比如链接是否可以跳转或者如何跳转,需要设置代理;而如果需要与在 JS 调用 alert、confirm、prompt 函数时,通过 JS 原生来处理,而不是调用 JS 的 alert、confirm、prompt 函数,那么需要设置 UIDelegate,在得到响应后可以将结果反馈到 JS 端:
添加对 WKWebView 属性的监听
然后我们就可以实现 KVO 处理方法,在 loading 完成时,可以注入一些 JS 到 web 中。这里只是简单地执行一段 web 中的 JS 函数:
WKUIDelegate
与 JS 原生的 alert、confirm、prompt 交互,将弹出来的实际上是我们原生的窗口,而不是 JS 的。在得到数据后,由原生传回到 JS:
WKNavigationDelegate
如果需要处理 web 导航操作,比如链接跳转、接收响应、在导航开始、成功、失败等时要做些处理,就可以通过实现相关的代理方法:
JS 端代码
2. 利用 UIWebView 进行交互
大家都知道 UIWebView 是最常见的 SDK, 平时项目中我们用的也比较多, 它有一个 stringByEvaluatingJavaScriptFromString 方法可以将 javascript 嵌入页面中,通过这个方法我们可以在 iOS 中与 UIWebView 中的网页元素交互. 下面就来详细介绍一下它的具体操作步骤. 首先我们来加载一个网页, 看看他的源码:
创建 UIWebView
加载 URL
效果图
获取当前页面的 URL
获取页面的 title
修改 HTML 元素标签的值
插入 js 代码
提交表单
就爱阅读 www.92to.com 网友整理上传, 为您提供最全的知识大全, 期待您的分享,转载请注明出处。
来源: