WebViewJavascriptBridge 项目介绍

在Obj-C 和 WKWebView, UIWebView 中的 Javascript之间传送信息的桥梁。

项目地址

如何使用

Javascript的介绍

    <script>
window.onerror = function(err) {
log('window.onerror: ' + err)
}
//下面的方法是必备
function setupWebViewJavascriptBridge(callback) {
if (window.WebViewJavascriptBridge) {
return callback(WebViewJavascriptBridge);
}
if (window.WVJBCallbacks) {
return window.WVJBCallbacks.push(callback);
}
window.WVJBCallbacks = [callback];
var WVJBIframe = document.createElement('iframe');
WVJBIframe.style.display = 'none';
WVJBIframe.src = 'wvjbscheme://__BRIDGE_LOADED__';
document.documentElement.appendChild(WVJBIframe);
setTimeout(function() {
document.documentElement.removeChild(WVJBIframe)
}, 0)
}
setupWebViewJavascriptBridge(function(bridge) {
var uniqueId = 1;
//打印方法
function log(message, data) {
var log = document.getElementById('log')
var el = document.createElement('div')
el.className = 'logLine'
el.innerHTML = uniqueId++ + '. ' + message + ':<br/>' + JSON.stringify(data)
if (log.children.length) {
log.insertBefore(el, log.children[0])
} else {
log.appendChild(el)
}
}
//JS 注册处理,名字需与 ObjC 一致
bridge.registerHandler('testJavascriptHandler', function(data, responseCallback) {
log('ObjC called testJavascriptHandler with', data)
var responseData = {
'Javascript Says': 'Right back atcha!'
}
log('JS responding with', responseData)
responseCallback(responseData)
}) document.body.appendChild(document.createElement('br')) var callbackButton = document.getElementById('buttons').appendChild(document.createElement('button'))
callbackButton.innerHTML = 'Fire testObjcCallback'
callbackButton.onclick = function(e) { // 点击按钮事件
e.preventDefault();
log('JS calling handler "testObjcCallback"');
// JS 向 ObjC 传数据的方式,callHandler(方法标识符, 数据, 回调)
bridge.callHandler('testObjcCallback', {
'foo': 'bar'
}, function(response) {
log('JS got response', response);
})
}
})
</script>

ObjC 中的使用介绍

引入头文件

#import "WebViewJavascriptBridge.h"

声明变量

@property WebViewJavascriptBridge* bridge;

实现方法

if (_bridge) { return; }

    UIWebView* webView = [[UIWebView alloc] initWithFrame:self.view.bounds];
[self.view addSubview:webView]; [WebViewJavascriptBridge enableLogging]; _bridge = [WebViewJavascriptBridge bridgeForWebView:webView];
[_bridge setWebViewDelegate:self]; [_bridge callHandler:@"testJavascriptHandler" data:@{@"foo":@"before ready"}]; [_bridge registerHandler:@"testObjcCallback" handler:^(id data, WVJBResponseCallback responseCallback) {
NSLog(@"testObjcCallback called: %@", data);
NSString *strDD = [NSString stringWithFormat:@"hello world: %@",data];
responseCallback(strDD);
}];

WebViewJavascriptBridge的使用说明的更多相关文章

  1. WebViewJavascriptBridge使用说明(iOS)

    由于现在很多产品都是有安卓版跟ios版,就意味着同一样东西要出两套,由两组人去完成,不仅增加了开发成本,也大大加剧了维护成本.聪明的coder想出了跨平台的思路,用html写页面,分别用webview ...

  2. OC-JS交互(WebViewJavascriptBridge使用说明)

    首先确保一份已经配好功能的html文件. 1.初始化一个webview(viewdidload) UIWebView* webView = [[UIWebView alloc] initWithFra ...

  3. Android混合开发之WebViewJavascriptBridge实现JS与java安全交互

    前言: 为了加快开发效率,目前公司一些功能使用H5开发,这里难免会用到Js与Java函数互相调用的问题,这个Android是提供了原生支持的,不过存在安全隐患,今天我们来学习一种安全方式来满足Js与j ...

  4. Atitit.项目修改补丁打包工具 使用说明

    Atitit.项目修改补丁打包工具 使用说明 1.1. 打包工具已经在群里面.打包工具.bat1 1.2. 使用方法:放在项目主目录下,执行即可1 1.3. 打包工具的原理以及要打包的项目列表1 1. ...

  5. objC与js通信实现--WebViewJavascriptBridge

    场景   在移动端开发中,最为流行的开发模式就是hybmid开发,在这种native和h5的杂糅下,既能在某些需求中保证足够的性能,也可以在某些列表详情的需求下采用h5的样式控制来丰富内容.但是在大型 ...

  6. awk使用说明

    原文地址:http://www.cnblogs.com/verrion/p/awk_usage.html Awk使用说明 运维必须掌握的三剑客工具:grep(文件内容过滤器),sed(数据流处理器), ...

  7. WebViewJavascriptBridge源码探究--看OC和JS交互过程

    今天把实现OC代码和JS代码交互的第三方库WebViewJavascriptBridge源码看了下,oc调用js方法我们是知道的,系统提供了stringByEvaluatingJavaScriptFr ...

  8. “我爱背单词”beta版发布与使用说明

    我爱背单词BETA版本发布 第二轮迭代终于画上圆满句号,我们的“我爱背单词”beta版本已经发布. Beta版本说明 项目名称 我爱背单词 版本 Beta版 团队名称 北京航空航天大学计算机学院  拒 ...

  9. Oracle 中 union 和union all 的简单使用说明

    1.刚刚工作不久,经常接触oracle,但是对oracle很多东西都不是很熟.今天我们来了解一下union和union all的简单使用说明.Union(union all): 指令的目的是将两个 S ...

随机推荐

  1. HTML(四)

    html表格 table常用标签 1.table标签:声明一个表格 2.tr标签:定义表格中的一行 3.td和th标签:定义一行中的一个单元格,td代表普通单元格,th表示表头单元格 table常用属 ...

  2. 用单进程、多线程并发、多线程分别实现爬一个或多个网站的所有链接,用浏览器打开所有链接并保存截图 python

    #coding=utf-8import requestsimport re,os,time,ConfigParserfrom selenium import webdriverfrom multipr ...

  3. numpy中的广播机制

    广播的引出 numpy两个数组的相加.相减以及相乘都是对应元素之间的操作. import numpy as np x = np.array([[2,2,3],[1,2,3]]) y = np.arra ...

  4. 在极算云安装pytorch0.4.1环境

    1.  已经安装了anaconda.然后就可以创建你自己的环境了(你最好一定要指定个python版本,如下, 我指定为python3.6, 如果需要的话你也可以指定其他python版本,并不是说ana ...

  5. java中 Java.lang.Long.parseLong()方法

    这是在刷杭电一道水题中遇到的,当时用java没思路,便查了查题解,用到了Java.lang.Long.parseLong()方法 题目链接:http://acm.hdu.edu.cn/showprob ...

  6. python之函数第二篇

    一.名称空间与作用域 名称空间分类: 内置名称空间 import this dir(buil-in) 查看全部内置 全局名称空间 局部名称空间 在函数体内等 查询全局和局部 globals()方法可以 ...

  7. 深入理解javascript构造函数和原型对象

    ---恢复内容开始--- 对象,是javascript中非常重要的一个梗,是否能透彻的理解它直接关系到你对整个javascript体系的基础理解,说白了,javascript就是一群对象在搅..(哔! ...

  8. What is the NETStandard.Library metapackage?

    In my last post, I took a quick look at the Microsoft.AspNetCore meta package. One of the libraries ...

  9. drawRect中抗锯齿

    在开始之前,我们需要创建一个DrawRectView 其初始代码为 // // DrawRectView.h // CGContextSetShouldAntialias // // Created ...

  10. Springboot 之 多配置文件

    六.Springboot 之 多配置文件   说明:在程序开发过程中可能会有这样的需求:开发和部署的配置信息可能会不同,以传统的方式就是在配置文件里面写好配置,在部署的时候再去修改这些配置,这样肯定会 ...