iOS7之后JavaScript与Objective-C之间的通信
http://www.cocoachina.com/ios/20150906/13320.html
最近公司用Ping++集成了第三方支付,并且微信端也集成了这个功能,而微信付款时需要调用原生的支付宝支付或者微信支付,由此引出了JS调用OC方法的问题。
Js -> Native
以前传统的做法是根据url字符串来做特殊匹配,从而完成一些特定的工作譬如
|
1
2
3
4
5
6
7
8
9
10
11
12
|
- (BOOL)webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationType{ NSString *requestString = [[request URL] absoluteString]; NSString *scheme = @"js-pingpp"; NSString *protocol = [NSString stringWithFormat:@"%@://", scheme]; if ([requestString hasPrefix:protocol]) { //调用相应支付Api /*do something*/ return NO; } return YES;} |
但是iOS7之后, iOS 7 引入了 JavaScriptCore 库,它把 WebKit 的 JavaScript 引擎用 Objective-C 封装,让JavaScript与Objective-C之间的通信变的非常简单。首先导入JavaScriptCore.framework框架, 然后
JS端:
|
1
|
TXBB_IOS_SDK.callPay(charge, this.success, this.cancel); |
OC端:
.h中引入头文件,并实现协议和对应的方法
.m中在webViewDidFinishLoad中给context赋值,并把self指针给TXBB_IOS_SDK,JS端即可经过TXBB_IOS_SDK.callPay调用起Native方法
|
1
2
3
4
5
6
7
8
9
10
11
12
|
-(void)webViewDidFinishLoad:(UIWebView *)webView{ self.context = [webView valueForKeyPath:@"documentView.webView.mainFrame.javaScriptContext"]; self.context[@"TXBB_IOS_SDK"] = self;}#pragma mark - JSExport Methods- (void)callPay:(NSString *)charge success:(NSString *) success cancel:(NSString *)cancel { ... [Pingpp createPayment:charge appURLScheme:@"msc" withCompletion:completion];} |
Native -> Js
OC端调用JS代码则只需通过context调用evaluateScript方法即可,下列代码即会用JS显示Hello World,而在iOS7.0之前你可能通过[webView stringByEvaluatingJavaScriptFromString:@"document.title"]方法来获取WebView的title。
|
1
2
3
4
5
6
|
-(void)webViewDidFinishLoad:(UIWebView *)webView { JSContext *context=[webView valueForKeyPath:@"documentView.webView.mainFrame.javaScriptContext"]; NSString *alertJs=@"alert('Hello Word')"; [context evaluateScript:alertJs];} |
最后
JS和OC通信还有个非常著名的第三方库WebViewJavascriptBridge,如果你的项目需要支持iOS6之前的系统,你可以通过这个项目实现JS和OC的通信。
iOS7之后JavaScript与Objective-C之间的通信的更多相关文章
- WebBrowser一点心得,如果在Javascript和Winform代码之间实现双向通信
原文:WebBrowser一点心得,如果在Javascript和Winform代码之间实现双向通信 最近工作需要,学习了一下winform内嵌webbrowser控件,然后与htm页面中的javasc ...
- JavaScript中进制之间的转换
JavaScript中进制之间的转换 //十进制转其他 var x = 100; alert(x); alert(x.toString(2)); //转2进制 alert(x.toString(8)) ...
- C#与Javascript变量、函数之间的相互调用
原文地址:http://blog.csdn.net/wonsoft/article/details/2595743 C#与Javascript变量.函数之间的相互调用 一.javascript调用C ...
- JavaScript中基本数据类型之间的转换
在JavaScript中共有六种数据类型,其中有五种是基本数据类型,还有一种则是引用数据类型.五种基本数据类型分别是:Number 数值类型.String 字符串类型.Boolean 布尔类型, nu ...
- Vue 组件&组件之间的通信 之 非父子关系组件之间的通信
Vue中不同的组件,即使不存在父子关系也可以相互通信,我们称为非父子关系通信: 我们需要借助一个空Vue实例,在不同的组件中,使用相同的Vue实例来发送/监听事件,达到数据通信的目的: 实例: 初始加 ...
- Vue 组件&组件之间的通信 父子组件的通信
在Vue的组件内也可以定义组件,这种关系成为父子组件的关系: 如果在一个Vue实例中定义了component-a,然后在component-a中定义了component-b,那他们的关系就是: Vue ...
- AngularJS实战之Controller之间的通信
我们时常会在不同controller之间进行通信,接下来就介绍三种controller之间的通信方式 一.使用$on.$emit和$broadcast进行controller通信 虽然AngularJ ...
- angular开发控制器之间的通信
一.指令与控制器之间通信,无非是以下几种方法: 基于scope继承的方式 基于event传播的方式 service的方式(单例模式) 二.基于scope继承的方式: 最简单的让控制器之间进行通信的方法 ...
- JS观察者设计模式:实现iframe之间快捷通信
观察者设计模式又称订阅发布模式,在JS中我们习惯叫做广播模式,当多个对象监听一个通道时,只要发布者向该通道发布命令,订阅者都可以收到该命令,然后执行响应的逻辑.今天我们要实现的就是通过观察者设计模式, ...
随机推荐
- 冒泡排序算法[C++]
冒泡排序应该是最容易实现的一种排序算法了.其基本思想是:依次比较相邻的两个数,将小数放在前面,大数放在后面.即在第一趟:首先比较第1个和第2个数,将小数放前,大数放后.然后比较第2个数和第3个数,将小 ...
- Eclipse:Eclipse插件开发全套教程
分享是美德,作者为Eclipse核心工程师之一,全英文版,有不明白的地方欢迎探讨和咨询. http://www.vogella.com/tutorials/eclipse.html
- 【html、CSS、javascript-12】jquery-效果
一.jQuery 效果- 隐藏和显示 通过 jQuery,您可以使用 hide() 和 show() 方法来隐藏和显示 HTML 元素: $("#hide").click(func ...
- BZOJ 1099 树网的核
题面 解题思路 搞了三个多小时.... noip时的数据很水,直接暴力n^3过. 我们考虑优化,首先可以贪心,我们要在直径上选肯定越插长越好,所以n^2其实就可以解决.但这还不够,根据直径的最长性,我 ...
- 使用原生ajax及其简单封装
原生ajax配置详解 // 原生ajax // 1. 创建ajax对象 if(window.XMLHttpRequest){ // // IE7+, Firefox, Chrome, Opera, S ...
- jmeter的组件介绍--框架
测试计划(test plan):用于存放测试脚本的容器. 线程(threads):通过java多线程来实现模拟多用户操作,只有在线程组下才能添加sample(各种协议的请求),因此线程是必须的. 取样 ...
- OpenLayers修改要素
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...
- Apache-Shiro分布式环境配置(与redis集成)(转)
原文戳我 前段时间项目要用到权限控制的相关模块,经过讨论决定采用Apache下面的Shiro开源框架进行身份校验与权限控制,因项目需部署在集群环境下,所以需要分布式的支持,故配置了Redis作为权限数 ...
- 2018-2-13-wpf-PreviewTextInput-在鼠标输入获得-_u0003
title author date CreateTime categories wpf PreviewTextInput 在鼠标输入获得 � lindexi 2018-2-13 17:23:3 +08 ...
- tcpdump命令介绍
命令格式为:tcpdump [-nn] [-i 接口] [-w 储存档名] [-c 次数] [-Ae] [-qX] [-r 文件] [所欲捕获的数据内容] 参数: -nn,直接以 IP 及 Port ...