EasyBridge:一种简单的js-bridge设计方案
EasyBridge是一个简单易用的js-bridge的工具库,提供了日常开发中,JavaScript与Java之间通讯的能力,与其他常见的js-bridge工具库实现方案不同,EasyBridge具备以下几个特点:
- 基于Android
WebView
的addJavascriptInterface
特性实现 - 提供了基于接口粒度的安全管理接口
- 轻量级,并且简单易用。以这个工具库作为依赖,只需要编写实际通讯接口
Principle
目前混合开发的方案包括:
- JSBridge
- Cordova
- React Native
- Flutter
EasyBridge就是一种简单的JSBridge解决方案。在众多的解决方案中,基本都是在利用系统的WebView
所开放的接口,打开Java与JavaScript通讯的渠道,这些方案的实现原理分别包括:
- 拦截
onJsPrompt()
方法当
WebView
中的页面调用了JavaScript当中的window.prompt()
方法的时候,这个方法会被回调。而且这个方法不仅能获取到JavaScript传递过来的string字符串内容,同时也能返回一段string字符串内容被JavaScript接收到,是一个相当适合构建bridge的入口方法。 - 拦截
shouldOverrideUrlLoading()
方法当页面重新load URL或者页面的iframe元素重新加载新的URL的时候,这个方法被回调。
addJavascriptInterface()
接口这个接口简单却强大,通过这个接口,我们能够直接把Java中定义的对象在JavaScript中映射出一个对应的对象,使其直接调用Java当中的方法,但是,在android 4.1及之前的版本存在着严重的漏洞,所以一直被忽视。
EasyBridge在众多的解决方案中,最终了选择了addJavascriptInterface()
接口作为方案的基础,主要基于以下几点考量:
- 目前Android版本已经到了9.0版本,市面上Android4.4之前的版本手机占有率已经很低,很多业务都已经把最低兼容版本定在了4.2以上,在这种情况下可以不考量4.1以下存在的漏洞问题;
addJavascriptInterface()
能够提供最简单的同步调用addJavascriptInterface()
与evaluateJavascript()
/loadUrl
结合,能够带来更加简单的异步调用的解决方案
方案结构
EasyBridge的方案结构如下图所示:
EasyBridge总共会向页面中注入两个JavaScript对象,:
- easyBridge
在页面加载到25%以上的时候(
onProgressChanged()
),通过执行工具库中的一个js文件注入的。这个对象主要的作用是定义了业务页面的JavaScript代码调用native的Java代码的规范入口,对象中定义的一个最关键的函数就是callHandler(handlerName, args, callback)
,这就是桥梁的入口。实际上在这个方法的内部,最终就是通过下面的_easybridge对象进入到Java代码层。 - _easybridge
通过
addJavascriptInterface()
映射和注入的一个对象,这个对象提供了实质的入口方法enqueue()
,在这个方法当中代码的路线从JavaScript层进入到了Java层,开启了两者的交互。
接口分发
实际上,我们可以通过@JavascriptInterface
注解开放很多的接口给JavaScript层调用,也可以通过addJavascriptInterface()
映射多个Java对象到JavaScript层,但是为了维护简单和通讯方便,EasyBridge的设计只提供了一个入口和一个出口。所有需要开放给JavaScript层的功能,都是通过构建接口实例进行处理。
接口的定义如下:
public interface BridgeHandler {String getHandlerName();void onCall(String parameters, ResultCallBack callBack);SecurityPolicyChecker securityPolicyChecker();
}
实际的工作流程如下图所示:
最开始初始化的时候需要注册所有可以被JavaScript层调用的业务接口。在运行的过程中,enqueue()
入口当中会根据协议定义,通过接口名称找到对应的处理接口实例,并触发接口响应。并且最终的接口响应都在入口处进行回传。因此,实际上,_easybridge对象(在Java层中,其实是EasyBridge
的实例)就是一个枢纽站,做任务的分派和结果的传递。
安全控制
EasyBridge的安全检查通过实现下面的接口对象来完成:
public interface SecurityPolicyChecker {boolean check(String url, String parameters);
}
内部提供了两级的安全控制策略,分别对应全局的安全控制策略和基于接口粒度的安全控制策略:
全局安全控制策略
在EasyBridgeWebView
对象当中,持有SecurityPolicyChecker
用于进行全局的安全检查。全局的安全检查在EasyBridge的内部发生在以下两个时机:
- Java注入bridge的时候
根据当前加载的页面url和参数信息,判断是否需要在页面中注入bridge。如果被安全规则拦截,则之前通过
addJavaScriptInterface()
注入的对象会被移除,也不会向页面中注入bridge对象,确保安全。 - JavaScript调用具体的Java接口的时候
在执行具体的Java开放的接口方法之前, 也会先触发全局的安全检查规则。
基于接口粒度的安全控制策略
每一个BridgeHandler
实例也都会持有一个SecurityPolicyChecker
的实例,用于针对具体的开发接口设置安全检查规则。每一个接口在接收到分派的指令之前,会先调用其安全控制策略,根据当前加载的页面地址以及传入的指令参数判断是否需要进行指令的分派,否则将会直接命令安全受限,错误返回,结果调用。
Feture
✔️ 注入jsbridge重试机制
✔️ 使用apt技术注册handler
✔️ JavaScript调用Java功能
✔️ Java调用JavaScript功能
✔️ 安全控制策略
关于EasyBridge的feature的详细说明以及整个工具库的使用,可以参考我的GitHub仓库中的说明。
整个工具库比较简单和小巧,欢迎大家对这种实现方案存在的问题提出改进的意见,谢谢
EasyBridge:一种简单的js-bridge设计方案相关推荐
- js 倒计时 php,2种简单的js倒计时实现方法
本文主要为大家详细介绍了2个简单js倒计时方式,一是带天数的倒计时,二是单纯分钟和秒倒计时,具有一定的参考价值,感兴趣的小伙伴们可以参考一下,希望能帮助到大家. 一般倒计时的时间都是后台传来的然后渲染 ...
- javascript js jsp接收servlet传送的数组ArrayList的一种简单的非ajax方法
这里提供一种简单的接收servlet传来动态数组ArrayList的方法:c标签foreach 首先需在jsp的开始部分加 <%@ taglib uri="http://java.su ...
- java判断回文字符串几种简单的实现
11年it研发经验,从一个会计转行为算法工程师,学过C#,c++,java,android,php,go,js,python,CNN神经网络,四千多篇博文,三千多篇原创,只为与你分享,共同成长,一起进 ...
- 【页面传值6种方式】- 【JSP 页面传值方法总结:4种】 - 【跨页面传值的几种简单方式3种】...
页面传值--最佳答案6种方式: 一. 使用QueryString变量 QueryString是一种非常简单也是使用比较多的一种传值方式,但是它将传递的值显示在浏览器的地址栏中,如果是传递一个或多个安全 ...
- html js脚本限制 正则,简单谈谈JS中的正则表达式
1.正则表达式包括两部分 ①定义正则表达式的规则: ②正则表达式的模式(i/g/m): 2.声明正则表达式 ① 字面量声明: var reg = /表达式规则/表达式模式: eg:var reg = ...
- 【干货】JS版汉字与拼音互转终极方案,附简单的JS拼音输入法
转自:小茗同学的博客:小茗同学博客 网上关于JS实现汉字和拼音互转的文章很多,但是比较杂乱,都是互相抄来抄去,而且有的不支持多音字,有的不支持声调,有的字典文件太大,还比如有时候我仅仅是需要获取汉字拼 ...
- 模拟电路--一种简单的无源限幅电路的设计
一种简单的无源限幅电路的设计 设计需求 设计方案 仿真结果 设计需求 有很多地方需要对输入端或者输出端的信号进行限幅.最近在做的一个电路对输入端有比较严格的信号幅度限制,所以需要在电路的输入端加上一个 ...
- laytpl语法_浅谈laytpl 模板空值显示null的解决方法及简单的js表达式
浅谈laytpl 模板空值显示null的解决方法及简单的js表达式 laytpl 模板语法 {{ d.field }} 输出一个普通字段,不转义html 官方的说明 但d.field 为空时会显示nu ...
- Ajax提交Form表单的两种简单方式
在现在的项目开发中,ajax的应用是必不可免的,最为基本的就是利用ajax的异步处理方式来向后台提交数据.关于ajax提交表单我利用到了两种简单的方式. 方法一## 先获取表单里面的数据,再通过aja ...
最新文章
- 7-18 银行业务队列简单模拟 (25 分)
- <X86汇编语言:实模式到保护模式>四十四 协同式任务切换
- kafka修改分区数_大数据技术:解析SparkStreaming和Kafka集成的两种方式
- vue 传参 微信_vue-router 你可能忽略的知识点
- ip地址自动切换器_网络IP切换器IPProviders下载_IPProviders官方版下载1.1.22
- Intel 64/x86_64/IA-32/x86处理器 - SIMD指令集 - SSE扩展(3) - MXCSR寄存器详解
- C# WinForm开发系列 - 开篇
- SQL Server Express无法建立ODBC问题(错误代码67 和17)
- Ubuntu18.04系统中python3.7安装MultiNEAT库
- 基于51单片机模拟交通灯程序
- Elipse-基本使用
- Android APP功能测试(个人总结完整版)
- Ebbinghaus English Memory ( 艾宾浩斯英语记忆 ) 程序 之 设计思路 与 代码实现
- 垃圾分类小程序拍照识别垃圾分类微信小程序开发源码
- 密码学的发展(第二篇:恩尼格码机)
- 待机、休眠、睡眠的区别(整理)
- java请假系统毕业设计_毕业设计学生管理请假系统.doc
- directadmin安装多个php,DirectAdmin安装记录(2018更新)
- Docker mongo:5.0
- 德语计算机相关的动词,德语常用计算机词汇汇总