NE JSBridge 接入与使用

by hzwusibo 20180605

在Android中，Webview所实现的java与js的交互存在一些安全问题，并且这样的使用方式，没法让一套H5同时适配Android和iOS两个平台，因此需要有一个中间组件来实现js与本地的代码的交互，也就是JsBridge。

我们项目使用的是基于  “开源Jsbridge“（https://github.com/lzyzsd/JsBridge）改造的 NEJSBridge（暂未对外https://g.hz.netease.com/WM-Android/NEJSBridge  ）， 使用大体差不多（稍有区别）。

一、(区别)接入：

1、接入

开源Jsbridge：

NEJSBridge：

a、 导入jsbridge_1.0.jar

b、在assets里面放入NEJSBridge.js

c、混淆说明  -dontwarn com.netease.jsbridge.**

2、使用 自定义webview 继承BridgeWebView ，或者直接使用BridgeWebView

3、 (区别)  NEJSBridge  比  “开源Jsbridge"  支持原有的 WebViewClient的功能（增加了老的url拦截方式，能兼容了老的url一套），  这样既可以支持Jsbridge 又可以 支持url方式 

关键代码：

JSBridge占用了WebViewClient 使用BridgeClient代替，监听BridgeWebView的载入和url捕获。

在shouldOverrideUrlLoading还可以以老的方式处理，具体处理在appendHMC方法中

4. JavaScript调Java

      ”functionInJs“是JavaScript和java约定的口令，JavaScript调了”functionInJs“，java就知道要执行什么，

data是JavaScript传给Java的参数， callback是java返回给JavaScript的参数。

或者 使用封装好的 new NEJBHandler()

5、java调JavaScript 

同理”functionInJs“是JavaScript和java约定的口令，中间参数是 java传给JavaScript的参数，callback相反。

例如app端主动分享，分享完成java调JavaScript，传递分享完成信息。

二、调用封装

      在项目中对Jsbridge的使用，进行了封装。 以BrowserActivity的获取当前登录的token为例， 如果是公共的方法可以写在继承自BridgeWebView的自定义webview中（这里为 NeteaseWebview ）。

1、先声明与JavaScript的定义 （与前端约定）

2、加入mJsSupportList 列表

在BrowserActivity初始化时候（onCreate（） ），把JSSupportList注册到webview中。

3、handleJsCommand方法中 处理所有mJsSupportList 支持的方法， 其中 JsAction是事件，data是JavaScript传给java的数据，callback是返回。 JsAction对比 是什么事件，执行相应的方法。

4.  将取到的token传递给当前的页面（JavaScript），使用callbackFunc。

5. 如果token还需要向后台取后，才能返回给前端（异步），可以使用以下方法。

声明 callback

在handleJsCommand 方法中， 存入jsAction和callbackFunc到 map中

在网络回调获取token后，通过map取得callbackfunction， 返回token给JavaScript。

三、调试

    Jsbridge的调试也是比较麻烦的，需要前端的配合，可以让前端准备一个测试界面，客户端首先通过测试界面，在进行联调

比如这样的测试界面

前端：

通过所有测试界面，在进行联调。