iOS下JS与原生的交互一
本篇主要讲的是UIWebView和JS的交互,在下一节会有wkWebView和JS交互的详解https://www.cnblogs.com/llhlj/p/9144110.html
JS调用原生OC
方式一:url拦截,这里略过
注意:在iOS中拦截到的url scheme将全部转化为小写;
html中需要设置编码,否则中文参数可能会出现编码问题;
JS用打开一个iFrame的方式替代直接用document.location的方式,document.location 有一个很严重的问题,就是如果我们连续 2 次改 document.location 的话,在 delegate 方法中,只能截获后面那次请求,前一次请求由于很快被替换掉,所以被忽略掉。
方式二:通过JavaScriptCore(iOS 7之后),用来做JS交互,因此JS与原生OC交互也变得简单了许多。
//获取js上下文,及本地添加js调用方法,一般情况下都放在-(void)webViewDidFinishLoad:(UIWebView *)webView方法里。
-(void)webViewDidFinishLoad:(UIWebView *)webView{
//获取js上下文
self.jscontext = [webView valueForKeyPath:@"documentView.webView.mainFrame.javaScriptContext"];
//添加js代用方法
self.jscontext[@"octestFunc"]= ^(){
//oc逻辑
NSArray *array = [JSContext currentArguments];
for (NSString *value in array) {
NSLog(@"收到js值:%@",value);
}
return @"oc";//也可以没有返回值
};
//异常处理 当oc本地调用的js方法不存时,会打印异常信息,注意只有通过上下文调用的才会异常处理如oc调用js方式2、3
self.jscontext.exceptionHandler = ^(JSContext* context,JSValue *exceptionValue){
NSLog(@"异常信息:%@", exceptionValue);
};
}
方式三:同方式二相似,通过JSExport协议
自定义协议
@protocol JSObjcDelegate<JSExport>//自定义协议
//自定义交互方法
-(id)getMessage:(id)msg;
@end
@interface WebViewController ()<UIWebViewDelegate,JSObjcDelegate>
@property(nonatomic,strong)UIWebView *webView;
@property(nonatomic,strong)JSContext *jscontext;
@end
设置代理
-(void)webViewDidFinishLoad:(UIWebView *)webView{
//获取js上下文
self.jscontext = [webView valueForKeyPath:@"documentView.webView.mainFrame.javaScriptContext"];
//设置代理
self.jscontext[@"ios"]= self;
//异常处理 当oc本地调用的js方法不存时,会打印异常信息,注意只有通过上下文调用的才会异常处理如oc调用js方式2、3
self.jscontext.exceptionHandler = ^(JSContext* context,JSValue *exceptionValue){
NSLog(@"异常信息:%@", exceptionValue);
};
}
代理方法的实现
//代理方法的实现
-(id)getMessage:(id)message{
NSLog(@"getMessage-------%@",message);
return @"oc";//返回值可以没有
}
OC调用JS
-(void)callJSFunc{
//方式1
// NSString *jsText = [NSString stringWithFormat:@"ocCallJSFunc('%@')",@"哈哈"];
// id value = [self.webView stringByEvaluatingJavaScriptFromString:jsText];//也可能没有返回值
// NSLog(@"value-----%@",value);
//方式2
// JSValue *callback = self.jscontext[@"ocCallJSFunc"];
// id value2 = [callback callWithArguments:@[@"222"]];
// NSLog(@"value2-----%@",value2);
//方式3
NSString *jsText = @"ocCallJSFunc('222')";
id value3 = [self.jscontext evaluateScript:jsText];
NSLog(@"value3-----%@",value3);
}
注意:stringByEvaluatingJavaScriptFromString是一个同步的方法,使用它执行JS方法时,如果JS 方法比较耗的时候,会造成界面卡顿。
官方推荐使用WKWebView(ios8)的evaluateJavaScript:completionHandler:代替这个方法。
iOS下JS与原生的交互一的更多相关文章
- iOS下JS与原生的交互二
本篇主要讲的是UIWebView和JS的交互,UIWebView和JS交互的详解https://www.cnblogs.com/llhlj/p/6429431.html 一. WKWebView调用J ...
- iOS下JS与原生OC互相调用(总结)
这是去年总结的一篇文章,也一并先放到这个目录下好了. iOS开发免不了要与UIWebView打交道,然后就要涉及到JS与原生OC交互,今天总结一下JS与原生OC交互的两种方式. JS调用原生OC篇 方 ...
- iOS下JS与OC互相调用(一)--UIWebView 拦截URL
最近准备把之前用UIWebView实现的JS与原生相互调用功能,用WKWebView来替换.顺便搜索整理了一下JS 与OC 交互的方式,非常之多啊.目前我已知的JS 与 OC 交互的处理方式: * 1 ...
- iOS下JS与OC互相调用(五)--UIWebView + WebViewJavascriptBridge
WebViewJavascriptBridge是一个有点年代的JS与OC交互的库,使用该库的著名应用还挺多的,目前这个库有7000+star.我去翻看了它的第一版本已经是4年前了,在版本V4.1.4以 ...
- iOS下JS与OC互相调用(四)--JavaScriptCore
前面讲完拦截URL的方式实现JS与OC互相调用,终于到JavaScriptCore了.它是从iOS7开始加入的,用 Objective-C 把 WebKit 的 JavaScript 引擎封装了一下, ...
- iOS下JS与OC互相调用
背景情况: app项目中有几个界面是需要经常变动的(不仅是内容还有UI布局等),比如活动宣传界面就是属于这一类.但是由于AppStore提交审核也是需要时间的,就算审核快,也不至于每次都为了这点事频繁 ...
- iOS开发--JS调用原生OC篇
JS调用原生OC篇 方式一(反正我不用) 第一种方式是用JS发起一个假的URL请求,然后利用UIWebView的代理方法拦截这次请求,然后再做相应的处理. 我写了一个简单的HTML网页和一个btn点击 ...
- iOS下JS与OC互相调用(六)--WKWebView + WebViewJavascriptBridge
上一篇文章介绍了UIWebView 如何通过WebViewJavascriptBridge 来实现JS 与OC 的互相调用,这一篇来介绍一下WKWebView 又是如何通过WebViewJavascr ...
- iOS下JS与OC互相调用(八)--Cordova详解+实战
扯两句,可以跳过 由于项目中Cordova相关功能一直是同事在负责,所以也没有仔细的去探究Cordova到底是怎么使用的,又是如何实现JS 与 OC 的交互.所以我基本上是从零开始研究和学习Cordo ...
随机推荐
- 创建Git本地仓库
一.获取Git仓库 安装好Git后即可创建Git本地仓库,开始项目的版本管理.有两种方法取得Git项目仓库:1.在现有项目或目录下导入所有文件到Git中:2.从一个服务器克隆一个现有的Git仓库. 1 ...
- greenplum 数组操作
参考:http://gpdb.docs.pivotal.io/4390/admin_guide/query/topics/functions-operators.html Table 4. Advan ...
- 初学微信小程序——配置问题(1)
一.注册: 微信小程序账号注册:登录https://mp.weixin.qq.com 点击“立即注册”->”小程序” 注册完成后,下载微信小程序开发者工具: 依次点击:“首页”->“文档 ...
- P1068 万绿丛中一点红
P1068 万绿丛中一点红 转跳点:
- chart 模板【转】
Helm 通过模板创建 Kubernetes 能够理解的 YAML 格式的资源配置文件,我们将通过例子来学习如何使用模板. 以 templates/secrets.yaml 为例: 从结构看,文件的内 ...
- 洛谷P4427 [BJOI2018]求和
\(\Large\textbf{Description: } \large{一颗n个节点的树,m次询问,每次查询点i到点j的路径上所有节点点深度的k次方的和并对998244353取模(1\leq n, ...
- linux 下office软件推荐
概述 最近想使用LINUX下搭建服务器,所以查找一些需要用的软件. linux下最好的office解决办法 其实因为我是不怎么使用office的,我也不知道不同office有什么不一样,直到有一次写奖 ...
- sourcetree的安装
参考博文: SourceTree安装教程和GitLab配置详解 关于Atlassian无法注册的问题 SourceTree跳过Atlassian账号,免登陆,跳过初始设置 sourcetree跳过注册 ...
- Unity Reflection Probe使用入门
贴官方API的说法: 反射探头: 一个反射探头很像一个相机,捕获了周围所有方向的球形视图.然后将捕获的图像存储为Cubemap,可由具有反射材料的对象使用.在给定场景中可以使用多个反射探测器,可以将对 ...
- 阿里云安装配置nginx
一.简介 Nginx是一款轻量级的网页服务器.反向代理服务器.相较于Apache.lighttpd具有占有内存少,稳定性高等优势.它最常的用途是提供反向代理服务. 二 .安装 1.准备工作 Nginx ...