本篇主要讲的是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. centos查找文件\目录\内容命令

    1.查找文件 find / -name 'php.ini'12.查找目录 find / -name 'path' find / -name 'path' -type d13.查找内容 find . | ...

  2. JAVA中 PDF文件转成TIFF文件的2种方式

    由于在工作中使用到了PDF->TIFF的技术,所以稍微研究了一下实现方式,通过资料查阅,暂时发现了2种方式,2种方式有所区别:第一种方式转化后的tiff文件是黑白的,第二种方式转化后的tiff文 ...

  3. LoadRunner回放脚本时,显示浏览器的设置

    打开LoadRunner的VuGen,选择Tools-->General Options-->Display,在Display里将 Show browser during replay打钩 ...

  4. CodeForces - 862C Mahmoud and Ehab and the xor(构造)

    题意:要求构造一个n个数的序列,要求n个数互不相同,且异或结果为x. 分析: 1.因为0 ^ 1 ^ 2 ^ 3 ^ ... ^ (n - 3) ^ (n - 2) ^ (0 ^ 1 ^ 2 ^ 3 ...

  5. 并行执行 Job【转】

    有时,我们希望能同时运行多个 Pod,提高 Job 的执行效率.这个可以通过 parallelism 设置. 这里我们将并行的 Pod 数量设置为 2,实践一下: Job 一共启动了两个 Pod,而且 ...

  6. 手机连接jmeter录制脚本测试

    1.准备条件 电脑安装好jmeter,准备好一个手机 注意: 电脑和手机连接的网络要一致 手机设置代理协议前要先进入想要抓取的网站: http://39.107.96.138:3000/ 2.jmet ...

  7. Vue - 定义使用组件

    import Card from './components/Card.vue' Vue.component('m-card',Card)   // component是注册全局组件,在实例化VUE前 ...

  8. phpStudy隐藏后门预警

    1.事件背景 近日,使用广泛的PHP环境集成程序包phpStudy被公告疑似遭遇供应链攻击,程序包自带PHP的php_xmlrpc.dll模块隐藏有后门,安恒应急响应中心和研究院随即对国内下载站点提供 ...

  9. axios 如何取消已发送的请求?

    前言 最近在项目中遇到一个问题,在连续发送同一请求时,如果第二次请求比第一次请求快,那么实际显示的是第一次请求的数据,这就会造成数据和我选择的内容不一致的问题.解决的方案:在后续发送请求时,判断之前的 ...

  10. 一个自己实现的Vector 完善版本

    一个自己实现的Vector(只能处理基本类型数据) 转载自: https://www.ev0l.art/index.php/archives/22/ string 类型不行 bool char* in ...