一篇文章相识Js Bridge

2019年8月24日 217次阅读 来源: 杜文

《一篇文章相识Js Bridge》

什么是JS Bridge

在大多数APP开辟过程当中，都邑经由过程H5来完成部份功用，而Hybird APP基础90%以上都是H5。如今很少有纯原生的APP。然则，因为H5页面是内嵌到原生运用的WebView组件（一个阅读器内核）中，而手机阅读器Javascript引擎是在一个沙箱环境中运转，因而JavaScript的权限遭到严厉限定，比方没有当地文件读写权限、不能运用GPS、不能修正系统配置等。所以，假如JavaScript要用到这些受限的才时，就须要托付原生去完成，原生完成后，再将效果关照JavaScript，因而，JavaScript和原生之间就须要一个通讯的桥梁，而这个桥梁本质上就是原生的阅读器组件（我们一致称之为WebView）与Javascript 通讯的通道，平常称为 WebView JavaScript Bridge, 为了简朴，平常简称为 JS bridge。须要申明的是，原生不仅仅指挪动端（Android、IOS）上原生代码开辟的部份，它也可所以Windows、MAC上的，所以原生一词主要是为了辨别H5，而本文只议论挪动端的Js Bridge 。

挪动开辟的局势

今年来，动态化是挪动开辟的主流趋向，所谓动态化是指可以随时更新APP的才，这是为了战胜原生运用修正后必需重新发版的自然不足。现在动态化的手艺主要有四种：热补丁、夹杂开辟框架（React-Native、Weex等）、地道的Web APP、原生加H5（须要常常更新的部份用H5完成）。 个中热补丁手艺主要用于修复一些线上bug，不用于主流开辟，固然也有一些基于热补丁手艺的分包动态化计划，本文暂不议论。而盈余的三种计划，都是经由过程Javascript 和原生合营完成的，而它们都用到了 Js Bridge， 可见运用一个好的Js Bridge的主要性。而差异的夹杂开辟框架、Web APP中Js Bridge的完成和通讯协议都不雷同，固然，假如你运用的事这些开辟框架，你只须要相识响应框架下的通讯协议就行，这没有什么题目。 然则，关于采纳原生加H5的APP，就须要本身遴选一个适宜的Js Bridge了，那末关于开辟者来讲，什么是好的JavaScript Bridge?

什么是好的JS Bridge？

可用性

可以满足通讯需求、功用完美；固然，假如都不能用，照样回家洗洗睡吧~。

硬朗性

所谓硬朗就是经得住磨练，bug少、兼容性好、在种种情况下都能稳固运转。但是，恐怖的事，现有的着名开源js bridge 质量都存在着严峻题目，下面是我在两个着名Android JS Bridge开源库下提的题目:

  1. https://github.com/lzyzsd/JsB…
  2. https://github.com/jesse01/We…

可见，要想造一座好桥，照样不容易的。

跨平台

为了保证统一份Javascript代码既能同时在Android和IOS下一般运转，那末好的JavaScript Bridge 应当要能跨平台，如许才保证在Android和IOS和H5通讯协议一致。但是，现在Github上万star的 marcuswestin/WebViewJavascriptBridge 官方也只提供了IOS版，只管有一些第三方Android完成，但多数存在林林总总的题目，有的存在严峻bug，如 https://github.com/jesse01/We… , 有的和IOS版差异太大，如 https://github.com/fangj/WebV… 。

平安

平安是很主要的，如今有些Android完成中运用了 webview.addJavascriptInterface ，而在Android 4.2.2之前， webview.addJavascriptInterface 存在恣意代码实行破绽，这就会致使严峻的平安题目。

运用简朴

一个好东西应当是用起来简朴的。

关于JS Bridge来讲，运用简朴应当包含三个端：Android、IOS、 JavaScript， 也就是说不管关于哪一个端，用起来要充足的简朴，这很主要，如许可以防止大批的原生开辟和前端开辟的撕逼。

壮大

在满足可用性和运用简朴的基础上，功用要尽能够壮大。如今的许多完成，基础上只满足了可用性，而功用方面都比较弱，比方：

  1. 不支撑检测是不是存在某个API的要领；偶然跟着版本迭代不确定某个版本下是不是存在某个Native或Javascript要领（在版本迭代过程当中一些是新增加的）。
  2. 不支撑进度回调；现有JS Bridge基础都只支撑一次挪用一次返回，然则有些时刻，如js挪用原生下载文件功用的要领时，原生须要在下载过程当中将下载进度不断返回给js。
  3. 不支撑API治理；现有JS Bridge注册API时基础都是每一个API都须要零丁注册，如许在API多的情况下，不仅运用回异常贫苦，也不利于API分类治理。

福音

我给人人捅破了实际，也必需为人人重塑愿望！听不懂？那简朴来讲，就是前面都是铺垫，下面才是真正目标！

那末究竟有无一个可用、硬朗、跨平台、平安、运用简朴、壮大的现成的JS Bridge?

哈哈，固然是有的， 经由我夜以继日、四周阅读、煞费苦心、夜以继日，终究制造了这么一个硬朗、跨平台、平安、运用简朴、壮大的JS Bridge，那就是DSBridge，它有以下特性：

  1. Android、IOS、Javascript 三端易用，轻量且壮大、平安且硬朗。
  2. 同时支撑同步挪用和异步挪用
  3. 支撑以类的体式格局集合一致治理API
  4. 支撑API定名空间
  5. 支撑调试形式
  6. 支撑API存在性检测
  7. 支撑进度回调：一次挪用，屡次返回
  8. 支撑Javascript封闭页面事宜回调
  9. 支撑Javascript 模态/非模态对话框
  10. 支撑腾讯X5内核

固然得给出源码地点：

DSBridge for IOS：https://github.com/wendux/DSBridge-IOS

DSBridge for Android: https://github.com/wendux/DSBridge-Android

详情请参考Github文档，都有中文哦。

末了，假如你喜好DSBridge， 迎接star，不能多年辛劳无人知啊，哈哈。

    原文作者：杜文
    原文地址: https://segmentfault.com/a/1190000013415792
    本文转自网络文章，转载此文章仅为分享知识，如有侵权，请联系博主进行删除。
点赞