共计 2736 个字符，预计需要花费 7 分钟才能阅读完成。
使用 js 关闭当前页面 , 一般想到的都是 window.close() , 但是该方法只能关闭通过 window.open() 打开的页面
所以针对这种情况 , 只能分情况去解决 .
在微信 , 支付宝 , app 中打开外部链接 , 都是使用 webview 打开页面的 , 所以需要 app 提供映射方法 .
对于微信 , 支付宝 , 我们能通过开放平台找到对应的方法.
微信:
window.WeixinJSBridge.call(‘closeWindow’)
支付宝:
window.AlipayJSBridge.call(‘closeWebview’)
对应一般的 app , 需要开发者封装可以让 js 调用的方法 . (以下就是 js 和 app 的交互方法)
Javascript 调用 Java 方法
以 Android 的 Toast 的为例，下面看下如何从 Javascript 代码中调用系统的 Toast。先定义一个 AndroidToast 的 Java 类, 它有一个 show 的方法用来显示 Toast:
public class AndroidToast {
@JavascriptInterface
public void show(String str) {
Toast.makeText(MainActivity.this, str, Toast.LENGTH_SHORT).show();
}
}
再对 WebView 进行设置，开启 JavaScipt，注册 JavascriptInterface 的方法：
private void initView() {
webView = (WebView) findViewById(R.id.webView);
WebSettings webSettings = webView.getSettings();
webSettings.setJavaScriptEnabled(true);
webSettings.setDefaultTextEncodingName(“UTF-8”);
webView.addJavascriptInterface(new AndroidToast(), “AndroidToast”);
webView.loadUrl(“file:///android_asset/index.html”);
}
addJavascriptInterface 的作用是把 AndroidToast 类映射为 Javascript 中的 AndroidToast。这样就可以在 JavaScript 中调用 Java 中的方法了。在 Javascript 中调用 Java 代码:
function toastClick(){
window.AndroidToast.show(‘from js’);
}
通过 window 属性可以找到映射的对象 AndroidToast, 直接调用它的 show 方法即可。注意这里传输的数据只能是基本数据类型和 string, 可以传输 string 就意味着可以使用 json 传输结构化数据。这里调用的方法并没有返回值，如果需要在 JavaScript 中需要得到返回值怎么办呢？JavaScript 调用 Java 有返回值如果想从 Javascript 调的方法里面获取到返回值，只需要定义一个带返回值的 @JavascriptInterface 方法即可:
public class AndroidMessage {
@JavascriptInterface
public String getMsg() {
return “form java”;
}
}
添加 Javascript 的映射:webView.addJavascriptInterface(new AndroidMessage(), “AndroidMessage”); 在 JavaScript 直接调用：
function showAlert(){
var str=window.AndroidMessage.getMsg();
console.log(str);
}
这样就完成了有返回值的方法调用。还有一种场景是，在 Java 中主动触发 JavaScript 方法，就需要在 Java 中调用 JavaScript 方法了。Java 调用 JavaScript 方法
Java 在调用 JavaScript 方法的时候，需要使用 WebView.loadUrl() 方法，它可以直接在页面里执行 JavaScript 方法。首先定义一个 JavaScript 方法给 Java 调用：
function callFromJava(str){
console.log(str);
}
在 Java 中直接调用该方法:
public void javaCallJS(){
webView.loadUrl(“javascript:callFromJava(‘call from java’)”);
}
可以在 loadUrl 中给 Javascript 方法直接传参，如果 JavaScript 方法有返回值，使用 WebView.loadUrl() 是无法获取到返回值的，需要 JavaScript 返回值给 Java 的话，可以定义一个 Java 方法提供给 JavaScript 调用，然后 Java 调用 JavaScript 之后，JavaScript 触发该方法把返回值再传递给 Java。注意 WebView.loadUrl() 必须在 Ui 线程中运行，不然会会报错。
以下是项目中用到的具体代码:
var isLppzApp = false
var ua = navigator.userAgent.toLowerCase()
var uaApp = ua ? ua.match(/BeStore/i) : ” // match 方法返回的是对象
var uaAndroid = /android/i.test(ua) // test 返回的是 true/false
var uaIos = /iphone|ipad|ipod/i.test(ua)
if (uaApp.toString() === ‘bestore’) {// 必须将 match 返回的对象转成字符串
isLppzApp = true
} else {
isLppzApp = false
}
if (window.WeixinJSBridge) {
window.WeixinJSBridge.call(‘closeWindow’) // 微信
} else if (window.AlipayJSBridge) {
window.AlipayJSBridge.call(‘closeWebview’) // 支付宝
} else if (isLppzApp && uaAndroid) {
window.obj.closePageLppzRequest(”) // 安卓 app
} else if (isLppzApp && uaIos) {
window.webkit.messageHandlers.closePageLppzRequest.postMessage(”) //ios app
}
