本篇主要讲的是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与原生的交互一的更多相关文章

  1. iOS下JS与原生的交互二

    本篇主要讲的是UIWebView和JS的交互,UIWebView和JS交互的详解https://www.cnblogs.com/llhlj/p/6429431.html 一. WKWebView调用J ...

  2. iOS下JS与原生OC互相调用(总结)

    这是去年总结的一篇文章,也一并先放到这个目录下好了. iOS开发免不了要与UIWebView打交道,然后就要涉及到JS与原生OC交互,今天总结一下JS与原生OC交互的两种方式. JS调用原生OC篇 方 ...

  3. iOS下JS与OC互相调用(一)--UIWebView 拦截URL

    最近准备把之前用UIWebView实现的JS与原生相互调用功能,用WKWebView来替换.顺便搜索整理了一下JS 与OC 交互的方式,非常之多啊.目前我已知的JS 与 OC 交互的处理方式: * 1 ...

  4. iOS下JS与OC互相调用(五)--UIWebView + WebViewJavascriptBridge

    WebViewJavascriptBridge是一个有点年代的JS与OC交互的库,使用该库的著名应用还挺多的,目前这个库有7000+star.我去翻看了它的第一版本已经是4年前了,在版本V4.1.4以 ...

  5. iOS下JS与OC互相调用(四)--JavaScriptCore

    前面讲完拦截URL的方式实现JS与OC互相调用,终于到JavaScriptCore了.它是从iOS7开始加入的,用 Objective-C 把 WebKit 的 JavaScript 引擎封装了一下, ...

  6. iOS下JS与OC互相调用

    背景情况: app项目中有几个界面是需要经常变动的(不仅是内容还有UI布局等),比如活动宣传界面就是属于这一类.但是由于AppStore提交审核也是需要时间的,就算审核快,也不至于每次都为了这点事频繁 ...

  7. iOS开发--JS调用原生OC篇

    JS调用原生OC篇 方式一(反正我不用) 第一种方式是用JS发起一个假的URL请求,然后利用UIWebView的代理方法拦截这次请求,然后再做相应的处理. 我写了一个简单的HTML网页和一个btn点击 ...

  8. iOS下JS与OC互相调用(六)--WKWebView + WebViewJavascriptBridge

    上一篇文章介绍了UIWebView 如何通过WebViewJavascriptBridge 来实现JS 与OC 的互相调用,这一篇来介绍一下WKWebView 又是如何通过WebViewJavascr ...

  9. iOS下JS与OC互相调用(八)--Cordova详解+实战

    扯两句,可以跳过 由于项目中Cordova相关功能一直是同事在负责,所以也没有仔细的去探究Cordova到底是怎么使用的,又是如何实现JS 与 OC 的交互.所以我基本上是从零开始研究和学习Cordo ...

随机推荐

  1. Jquery所有Dom操作汇总

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  2. Matplotlib 安装

    章节 Matplotlib 安装 Matplotlib 入门 Matplotlib 基本概念 Matplotlib 图形绘制 Matplotlib 多个图形 Matplotlib 其他类型图形 Mat ...

  3. Spring中获取web项目的根目录

    spring 在 org.springframework.web.util 包中提供了几个特殊用途的 Servlet 监听器,正确地使用它们可以完成一些特定需求的功能; WebAppRootListe ...

  4. Java入门基础(类的方法)

    方法 1.添加方法 方法表示一个类能做什么.在Java里,方法和属性属于对等的术语,在一个类中,不仅可以添加属性,还可以添加方法. 类 { 属性:描述“我有什么” 方法:描述“我能做什么” } 例子: ...

  5. msf生成软件

    生成软件后门程序的命令 win7获取 生成内网软件 启动kali上的http服务 systemctl start apache2 开始msf控制台 msfconsole 使用监听模块 并查看配置  s ...

  6. OBU设备非接触式读卡方案:SI522

    传统收费站将成历史!全部转为ETC系统 当高速人工收费已经成为我们驾驶出行的习惯后,我们发现,高速人工收费带来低效率.长等待以及落后性等缺点逐渐给人们出行带来不便.伴随着我国汽车保有量的逐年递增,高速 ...

  7. 文本情感分析(二):基于word2vec、glove和fasttext词向量的文本表示

    上一篇博客用词袋模型,包括词频矩阵.Tf-Idf矩阵.LSA和n-gram构造文本特征,做了Kaggle上的电影评论情感分类题. 这篇博客还是关于文本特征工程的,用词嵌入的方法来构造文本特征,也就是用 ...

  8. [笔记]ul>li>a做分布时, 让其居中显示效果

    结构: <div id="page"> <ul> <li><a href="#">首页</a>< ...

  9. 015.Delphi插件之QPlugins,FMX插件窗口

    内嵌FMX的插件窗口,效果还是很可以的.退出时,会报错,很诡异啊. 主窗口代码如下 unit Frm_Main; interface uses Winapi.Windows, Winapi.Messa ...

  10. eshop2-linux 软件源配置 and 建议

    1. 阿里云源配置:http://mirrors.aliyun.com/ 2. 源配置 2.1 sudo mv /etc/yum.repos.d/CentOS-Base.repo /etc/yum.r ...