版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/a820703048/article/details/78443615
背景
我们在开发Android应用的时候，很多的时候需要跟网页打交道，网页与原生Android之间的交互就涉及到Java与JS之间的相互方法
WebView的使用
我们在Android中如果希望展示一个网页，基本上都会使用WebView这个组件，它的基本使用也很简单，假如我们希望加载一下百度首页，可以像下面这样写： 首先在layout文件中进行声明
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<WebView
android:id="@+id/web_view"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</RelativeLayout>然后在java文件中进行使用
WebView webView = (WebView) findViewById(R.id.web_view);
webView.loadUrl("http://www.baidu.com");同时，WebView还允许我们对一些默认设置进行修改，例如，我们希望启动对javascript的支持并且可以进行缩放，就需要做如下设置：
// 启用javascript
webView.getSettings().setJavaScriptEnabled(true);
webView.getSettings().setUseWideViewPort(true);
//是否可以缩放
webView.getSettings().setSupportZoom(true);
webView.getSettings().setBuiltInZoomControls(true);
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.HONEYCOMB) {
getSettings().setDisplayZoomControls(false);
}
但是，如果我们想要在页面加载的时候处理各种通知、请求事件，或者监听页面的加载进度等，就需要用到另外两个类：WebViewClient 和 WebChromeClient。其中，WebViewClient 主要用来监听通知或请求事件，我们在开发中可能会用到的方法主要是下面几个：
onPageStarted
onPageFinished
onReceivedError
shouldOverrideUrlLoadingpublic class CustomWebClient extends WebChromeClient {
@Override public void onProgressChanged(WebView view, int newProgress) {
if (newProgress == 100) {
mProgressBar.setVisibility(GONE);
} else {
if (mProgressBar.getVisibility() == GONE) {
mProgressBar.setVisibility(VISIBLE);
}
mProgressBar.setProgress(newProgress);
}
super.onProgressChanged(view, newProgress);
}
}
除此之外，WebView还提供了直接运行javascript的功能，例如，我们可以简单的弹出一个对话框：
webView.loadUrl("javascript:alert(\"提示信息！\");");当然，如果我们想要执行js，那么必须满足两个条件，第一个是在设置中开启javascript支持，即需要调用setJavascriptEnabled(true)，第二个是需要设置WebChromeClient，两者缺一不可。
代码演示
1.首先来一段最最简单的jsp代码
<body>
<p>WebView与Javascript交互</p>
<div>
<button onClick="window.android.actionFromJs()">点击调用Android代码</button>
</div>
<br />
<div>
<button onClick="window.android.actionFromJsWithParam(' data come from Js')">点击调用Android代码并传递参数</button>
</div>
<br />
<div id="log_msg">调用打印信息</div>
</body>不传递参数:
<button onClick="window.android.actionFromJs()">点击调用Android代码</button>
将参数传递到android代码中
<button onClick="window.android.actionFromJsWithParam('data come from Js')">点击调用Android代码并传递参数</button> // 启用javascript
mWebView.getSettings().setJavaScriptEnabled(true);
/** 为webview添加注册js 接口回调监听.
*
* 参数一: 接口对象
* 参数二: 接口别名(别名让js代码使用)
* 如果别名写"haha". 那么js中就要写window.haha.方法名
*/
mWebView.addJavascriptInterface(this, "android");/**
* js调用此方法
*/
@android.webkit.JavascriptInterface
public void actionFromJs() {
runOnUiThread(new Runnable() {
@Override
public void run() {
Toast.makeText(MainActivity.this, "js调用了Android函数", Toast.LENGTH_SHORT).show();
String text = logTextView.getText() + "\njs调用了Android函数";
logTextView.setText(text);
}
});
}
/**
* js调用此方法. 并且将参数传递过来
*
* @param str js 传递过来的参数
*/
@android.webkit.JavascriptInterface
public void actionFromJsWithParam(final String str) {
runOnUiThread(new Runnable() {
@Override
public void run() {
Toast.makeText(MainActivity.this, "js调用了Android函数传递参数：" + str, Toast.LENGTH_SHORT).show();
String text = logTextView.getText() + "\njs调用了Android函数传递参数：" + str;
logTextView.setText(text);
}
});
}<html>
<head>
<script type="text/javascript">
// 无参方法
function actionFromNative() {
document.getElementById("log_msg").innerHTML += "<br\>Android调用了js函数";
}
//有参方法
function actionFromNativeWithParam(arg) {
document.getElementById("log_msg").innerHTML += ("<br\>Android调用了js函数并传递参数：" + arg);
}
</script>
</head>
<body>
<div id="log_msg">调用打印信息</div>
</body>
</html> /**
* 调用js.
* WebView.loadUrl("javascript:js中定义的方法")
*/
button.setOnClickListener(new Button.OnClickListener() {
public void onClick(View v) {
// 无参数调用 android端调用js 方法
mWebView.loadUrl("javascript:actionFromNative()");
// 传递参数调用
mWebView.loadUrl("javascript:actionFromNativeWithParam(" + "'come from Native'" + ")");
}
});/**
* 重写这个方法的话,加载页面就不会弹出浏览器打开了
*/
mWebView.setWebViewClient(new WebViewClient() {
@Override
public boolean shouldOverrideUrlLoading(WebView view, String url) {
view.loadUrl(url);
return true;
}
/**
* 页面加载完成回调
* @param view
* @param url
*/
@Override
public void onPageFinished(WebView view, String url) {
super.onPageFinished(view, url);
}
});