Android JSBridge的原理与实现

1

jsbridge://className:port/methodName?jsonObj

1

jsbridge://className:callbackAddress/methodName?jsonObj

1

jsbridge://Logger:callbackAddress/log?{"msg":"native log"}

1

2

3

4

5

{

    "code":500,

    "msg":"method is not exist",

    "result":null

}

1

2

3

4

5

6

7

8

9

10

11

12

{

    "code":0,

    "msg":"ok",

    "result":{

        "key1":"returnValue1",

        "key2":"returnValue2",

        "key3":{

            "nestedKey":"nestedValue"

            "nestedArray":["value1","value2"]

        }

    }

}

1

mWebView.loadUrl("javascript:JSBridge.onFinish(port,jsonObj);");

1

JSBridge.register("jsName",javaClass.class)

1

2

public interface IBridge{

}

1

2

3

public static void methodName(WebView web view,JSONObject jsonObj,Callback callback){

}

1

JSBridge.call(className,methodName,params,callback)

1

jsbridge://className:callbackAddress/methodName?jsonObj

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

37

38

39

40

41

42

43

44

(function (win) {

    var hasOwnProperty = Object.prototype.hasOwnProperty;

    var JSBridge = win.JSBridge || (win.JSBridge = {});

    var JSBRIDGE_PROTOCOL = 'JSBridge';

    var Inner = {

        callbacks: {},

        call: function (obj, method, params, callback) {

            console.log(obj+" "+method+" "+params+" "+callback);

            var port = Util.getPort();

            console.log(port);

            this.callbacks[port] = callback;

            var uri=Util.getUri(obj,method,params,port);

            console.log(uri);

            window.prompt(uri, "");

        },

        onFinish: function (port, jsonObj){

            var callback = this.callbacks[port];

            callback & callback(jsonObj);

            delete this.callbacks[port];

        },

    };

    var Util = {

        getPort: function () {

            return Math.floor(Math.random() * (1  30));

        },

        getUri:function(obj, method, params, port){

            params = this.getParam(params);

            var uri = JSBRIDGE_PROTOCOL + '://' + obj + ':' + port + '/' + method + '?' + params;

            return uri;

        },

        getParam:function(obj){

            if (obj & typeof obj === 'object') {

                return JSON.stringify(obj);

            } else {

                return obj || '';

            }

        }

    };

    for (var key in Inner) {

        if (!hasOwnProperty.call(JSBridge, key)) {

            JSBridge[key] = Inner[key];

        }

    }

})(window);

1

2

public interface IBridge {

}

1

2

3

4

5

6

7

public class JSBridgeWebChromeClient extends WebChromeClient {

    @Override

    public boolean onJsPrompt(WebView view, String url, String message, String defaultValue, JsPromptResult result) {

        result.confirm(JSBridge.callJava(view, message));

        return true;

    }

}

1

2

3

4

5

WebView mWebView = (WebView) findViewById(R.id.webview);

WebSettings settings = mWebView.getSettings();

settings.setJavaScriptEnabled(true);

mWebView.setWebChromeClient(new JSBridgeWebChromeClient());

mWebView.loadUrl("file:///android_asset/index.html");

1

JSBridge.register("jsName",javaClass.class)

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

public class JSBridge {

    private static Map> exposedMethods = new HashMap();

    public static void register(String exposedName, Class extends IBridge> clazz) {

        if (!exposedMethods.containsKey(exposedName)) {

            try {

                exposedMethods.put(exposedName, getAllMethod(clazz));

            } catch (Exception e) {

                e.printStackTrace();

            }

        }

    }

    private static HashMapgetAllMethod(Class injectedCls) throws Exception {

        HashMap mMethodsMap = new HashMap();

        Method[] methods = injectedCls.getDeclaredMethods();

        for (Method method : methods) {

            String name;

            if (method.getModifiers() != (Modifier.PUBLIC | Modifier.STATIC) || (name = method.getName()) == null) {

                continue;

            }

            Class[] parameters = method.getParameterTypes();

            if (null != parameters & parameters.length == 3) {

                if (parameters[0] == WebView.class && parameters[1] == JSONObject.class && parameters[2] == JSCallback.class) {

                    mMethodsMap.put(name, method);

                }

            }

        }

        return mMethodsMap;

    }

}

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

public static String callJava(WebView webView, String uriString) {

        String methodName = "";

        String className = "";

        String param = "{}";

        String port = "";

        if (!TextUtils.isEmpty(uriString) & uriString.startsWith("JSBridge")) {

            Uri uri = Uri.parse(uriString);

            className = uri.getHost();

            param = uri.getQuery();

            port = uri.getPort() + "";

            String path = uri.getPath();

            if (!TextUtils.isEmpty(path)) {

                methodName = path.replace("/", "");

            }

        }

        if (exposedMethods.containsKey(className)) {

            HashMapString, Method> methodHashMap = exposedMethods.get(className);

            if (methodHashMap != null & methodHashMap.size() != 0 && methodHashMap.containsKey(methodName)) {

                Method method = methodHashMap.get(methodName);

                if (method != null) {

                    try {

                        method.invoke(null, webView, new JSONObject(param), new Callback(webView, port));

                    } catch (Exception e) {

                        e.printStackTrace();

                    }

                }

            }

        }

        return null;

    }

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

public class Callback {

    private static Handler mHandler = new Handler(Looper.getMainLooper());

    private static final String CALLBACK_JS_FORMAT = "javascript:JSBridge.onFinish('%s', %s);";

    private String mPort;

    private WeakReference mWebViewRef;

    public Callback(WebView view, String port) {

        mWebViewRef = new WeakReference(view);

        mPort = port;

    }

    public void apply(JSONObject jsonObject) {

        final String execJs = String.format(CALLBACK_JS_FORMAT, mPort, String.valueOf(jsonObject));

        if (mWebViewRef != null & mWebViewRef.get() != null) {

            mHandler.post(new Runnable() {

                @Override

                public void run() {

                    mWebViewRef.get().loadUrl(execJs);

                }

            });

        }

    }

}

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

public class BridgeImpl implements IBridge {

    public static void showToast(WebView webView, JSONObject param, final Callback callback){

        String message = param.optString("msg");

        Toast.makeText(webView.getContext(), message, Toast.LENGTH_SHORT).show();

        if (null != callback) {

            try {

                JSONObject object = new JSONObject();

                object.put("key", "value");

                object.put("key1", "value1");

                callback.apply(getJSONObject(0, "ok", object));

            } catch (Exception e) {

                e.printStackTrace();

            }

        }

    }

    private static JSONObject getJSONObject(int code, String msg, JSONObject result) {

        JSONObject object = new JSONObject();

        try {

            object.put("code", code);

            object.put("msg", msg);

            object.putOpt("result", result);

            return object;

        } catch (JSONException e) {

            e.printStackTrace();

        }

        return null;

    }

}

1

JSBridge.register("bridge", BridgeImpl.class);

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

html>

head>

    meta charset="utf-8">

    title>JSBridgetitle>

    meta name="viewport"

          content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1, user-scalable=no"/>

    script src='/images/loading.gif' data-original="file:///android_asset/JSBridge.js" type="text/javascript">script>

    script type="text/javascript">

    script>

    style>

    style>

head>

body>

div>

    h3>JSBridge 测试h3>

div>

ul >

    li>

        div>

            button onclick="JSBridge.call('bridge','showToast',{'msg':'Hello JSBridge'},function(res){alert(JSON.stringify(res))})">

                测试showToast

            button>

        div>

    li>

    br/>

ul>

body>

html>

1

mWebView.loadUrl("file:///android_asset/index.html");