列举了 JSBridge 的几种内部实现逻辑。可以编译工程看代码 实际运行效果如下
- 这是首页的运行效果
- 这是 prompt 的运行效果
- 这是 Android 端收到的日志
mWebView.loadUrl("javascript:callJS()");
这个方法无法拿到返回值,webview 会刷新。
这个方法可以拿到返回值
mWebView.evaluateJavascript("javascript:callJS()", new ValueCallback<String>() {
@Override
public void onReceiveValue(String value) {
//此处为 js 返回的结果
System.out.println("return: " + value);
}
});
在 java 中有一个对象映射到 webview 里,webview 可以拿到这个 js 对象。注册在 window 上 在 java 端的代码
mWebView.addJavascriptInterface(new AndroidtoJs(), "test");
在 webview 中的 JS 端
function callAndroid(){
if(window.test){
test.hello("js调用了android中的hello方法");
}else{
console.log('error,test not exists.');
}
}
let btn1 = document.getElementById("btn1");
btn1.addEventListener('click',()=>{
callAndroid();
});
webview 中的 JS 发起 schema 请求,然后安卓端拦截到这个请求。
document.getElementById("btn1").addEventListener('click',()=>{
/*约定的url协议为:js://webview?arg1=111&arg2=222*/
document.location = "js://webview?arg1=111&arg2=222";
});
mWebView.setWebViewClient(new WebViewClient() {
@Override
public boolean shouldOverrideUrlLoading(WebView view, String url) {
Uri uri = Uri.parse(url);
if (uri.getScheme().equals("js")) {
if (uri.getAuthority().equals("webview")) {
HashMap<String, String> params = new HashMap<>();
Set<String> collection = uri.getQueryParameterNames();
System.out.println("js调用了Android的方法");
System.out.println("js调用了Android的方法:" + uri.toString());
}
return true;
}
return super.shouldOverrideUrlLoading(view, url);
}
});
通过 WebChromeClient 的 onJsAlert()、onJsConfirm()、onJsPrompt()方法回调拦截 JS 对话框 alert()、confirm()、prompt() 消息
webview 中调用函数 prompt,然后安卓端拦截
function callAndroid(){
var result=prompt("js://demo?arg1=111&arg2=222");
alert("demo " + result);
}
let btn1 = document.getElementById("btn1");
btn1.addEventListener('click',()=>{
callAndroid();
});
安卓端拦截请求 原理类似 也可以拦截到请求
mWebView.setWebChromeClient(new WebChromeClient() {
@Override
public boolean onJsPrompt(WebView view, String url, String message, String defaultValue, JsPromptResult result) {
System.out.println("js调用了Android的方法:"+message);
Uri uri = Uri.parse(message);
if (uri.getScheme().equals("js")) {
if (uri.getAuthority().equals("demo")) {
System.out.println("js调用了Android的方法");
HashMap<String, String> params = new HashMap<>();
Set<String> collection = uri.getQueryParameterNames();
result.confirm("js调用了Android的方法成功啦");
}
return true;
}
return super.onJsPrompt(view, url, message, defaultValue, result);
}
参考资料 (https://github.com/wendux/DSBridge-Android/blob/master/readme-chs.md)