Android WebView的使用方法及与JS 相互调用

发布时间 - 2026-01-11 02:33:58    点击率:

Android WebView的使用方法及与JS 相互调用

1、添加网络权限

<uses-permission android:name="android.permission.INTERNET" />

2、WebSettings 对访问页面进行设置。

WebView mWebView = new WebView(this);
 
WebSettings webSettings = mWebView .getSettings();//支持获取手势焦点,输入用户名、密码或其他
 
mWebView.requestFocusFromTouch();
 
webSettings.setJavaScriptEnabled(true); //支持js
 
webSettings.setUseWideViewPort(true); //将图片调整到适合webview的大小 
 
webSettings.setLoadWithOverviewMode(true); // 缩放至屏幕的大小
 
webSettings.setSupportZoom(true); //支持缩放,默认为true。是下面那个的前提。
 
webSettings.setBuiltInZoomControls(true); //设置内置的缩放控件。
 
webSettings.setDisplayZoomControls(false); //隐藏原生的缩放控件
 
webSettings.setLayoutAlgorithm(LayoutAlgorithm.SINGLE_COLUMN); //支持内容重新布局 
 
webSettings.supportMultipleWindows(); //多窗口 
 
webSettings.setCacheMode(WebSettings.LOAD_CACHE_ELSE_NETWORK); //关闭webview中缓存 
 
webSettings.setAllowFileAccess(true); //设置可以访问文件 
 
webSettings.setNeedInitialFocus(true); //当webview调用requestFocus时为webview设置节点
 
webSettings.setJavaScriptCanOpenWindowsAutomatically(true); //支持通过JS打开新窗口 
 
webSettings.setLoadsImagesAutomatically(true); //支持自动加载图片
 
webSettings.setDefaultTextEncodingName("utf-8");//设置编码格式

3、页面加载方式

//加载一个网页:
 
mWebView.loadUrl();
 
//加载apk包中的一个html页面
 
mWebView.loadUrl();
 
//加载手机本地的一个html页面的方法:
 
mWebView.loadUrl("content://com.android.htmlfileprovider/sdcard/test.html");

4、WebView 的两个重要方法 WebViewClient 和 WebChromeClient

WebViewClient就是帮助WebView处理各种通知、请求事件的。

//打开网页时不调用系统浏览器, 而是在本WebView中显示:
mWebView.setWebViewClient(new WebViewClient(){   
 
 @Override
  public boolean shouldOverrideUrlLoading(WebView view, String url) {
    view.loadUrl(url); 
    return true;
  }
});
//将上面定义的webviewclinet设置给webview 
mWebView.setWebViewClient(webViewClient);

下面介绍 WebView 的一些事件:

WebViewClient mWebViewClient = new WebViewClient() 
{ 
  shouldOverrideUrlLoading(WebView view, String url); 
  //在网页上的所有加载都经过这个方法,这个函数我们可以做很多操作。
  //比如获取url,查看url.contains(“add”),进行添加操作
  shouldOverrideKeyEvent(WebView view, KeyEvent event);
  //重写此方法才能够处理在浏览器中的按键事件。
  onPageStarted(WebView view, String url, Bitmap favicon) ;
  //这个事件就是开始载入页面调用的,我们可以设定一个loading的页面,告诉用户程序在等待网络响应。
  onPageFinished(WebView view, String url);
  //在页面加载结束时调用。同样道理,我们可以关闭loading 条,切换程序动作。
  onLoadResource(WebView view, String url) ;
  // 在加载页面资源时会调用,每一个资源(比如图片)的加载都会调用一次。
  onReceivedError(WebView view, int errorCode, String description, String failingUrl);
  // (报告错误信息)
  doUpdateVisitedHistory(WebView view, String url, boolean isReload);
  //(更新历史记录)
  onFormResubmission(WebView view, Message dontResend, Message resend);
  //(应用程序重新请求网页数据)
  onReceivedHttpAuthRequest(WebView view, HttpAuthHandler handler, String host,String realm);
  //(获取返回信息授权请求)
  onReceivedSslError(WebView view, SslErrorHandler handler, SslError error); 
  //重写此方法可以让webview处理https请求。
  onScaleChanged(WebView view, float oldScale, float newScale); 
  // (WebView发生改变时调用)
  onUnhandledKeyEvent(WebView view, KeyEvent event); 
  //(Key事件未被加载时调用) 
}

WebChromeClient是辅助WebView处理Javascript的对话框,网站图标,网站title,加载进度等。

WebChromeClient mWebChromeClient = new WebChromeClient() {
 
  //获得网页的加载进度,显示在右上角的TextView控件中
  @Override
  public void onProgressChanged(WebView view, int newProgress) {
    if (newProgress < 100) {
      String progress = newProgress + "%";
    } else {
    }
  }
  //获取Web页中的title用来设置自己界面中的title
  //当加载出错的时候,比如无网络,这时onReceiveTitle中获取的标题为 找不到该网页,
  //因此建议当触发onReceiveError时,不要使用获取到的title
  @Override
  public void onReceivedTitle(WebView view, String title) {
    MainActivity.this.setTitle(title);
  }
  @Override
  public void onReceivedIcon(WebView view, Bitmap icon) {
    //
  }
  @Override
  public boolean onCreateWindow(WebView view, boolean isDialog, boolean isUserGesture, Message resultMsg) {
    //
    return true;
  }
  @Override
  public void onCloseWindow(WebView window) {
  }
  //处理alert弹出框,html 弹框的一种方式
  @Override
  public boolean onJsAlert(WebView view, String url, String message, JsResult result) {
    //
    return true;
  }
  //处理confirm弹出框
  @Override
  public boolean onJsPrompt(WebView view, String url, String message, String defaultValue, JsPromptResult 
      result) {
    //
    return true;
  }
  //处理prompt弹出框
  @Override
  public boolean onJsConfirm(WebView view, String url, String message, JsResult result) {
    //
    return true;
  }
};
 
//同样,将上面定义的WebChromeClient设置给WebView:
webView.setWebChromeClient(mWebChromeClient);

5、调用 JS 代码

WebSettings webSettings = mWebView .getSettings(); 
 
webSettings.setJavaScriptEnabled(true);//这里必须设置
 
mWebView.addJavascriptInterface(new InsertObj(), "jsObj");

以下方法是 Android 和 JS 的交互

public class InsertObj extends Object {
 private static Activity mActivity;
 private static WebView mWebView;
 
 public InsertObj(Activity activity, WebView webView) {
 mActivity = activity;
 mWebView = webView;
 }
 //给html提供的方法,js中可以通过:var str = window.jsObj.HtmlcallJava(); 获取到
 @JavascriptInterface
 public String HtmlcallJava() {
 return "Html call Java";
 }
 //给html提供的有参函数 : window.jsObj.HtmlcallJava2("IT-homer blog");
 @JavascriptInterface
 public String HtmlcallJava2(final String result) {
 return "Html call Java : " + result;
 }
 //Html给我们提供的函数
 @JavascriptInterface
 public static void JavacallHtml() {
 mActivity.runOnUiThread(new Runnable() {
  @Override
  public void run() {
  //这里是调用方法
  mWebView.loadUrl("javascript: showFromHtml()");
  Toast.makeText(mActivity, "clickBtn", Toast.LENGTH_SHORT).show();
  }
 });
 }
 //Html给我们提供的有参函数
 @JavascriptInterface
 public static void JavacallHtml2(final String param) {
 mActivity.runOnUiThread(new Runnable() {
  @Override
  public void run() {
  mWebView.loadUrl("javascript: showFromHtml2('"+param+"')");
  Toast.makeText(mActivity, "clickBtn2", Toast.LENGTH_SHORT).show();
  }
 });
 }
}
<!DOCTYPE html>
<html>
<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type">
<title>无标题 1</title>
<script type="text/javascript">
 
  function HtmlcallJava(){
      var str = window.jsObj.HtmlcallJava();
      alert(str);
    }
     
  function HtmlcallJava2(){
       var str = window.jsObj.HtmlcallJava2("HTML");
       alert(str);
    }
  
 function showFromHtml()
 {
  alert("我是js方法,我被Android后台调用");
 }
  
 function showFromHtml2(result)
 {
  alert("我是js方法,我被Android后台调用 "+result);
 }
 
  </script>
</head>
<body>
<button onclick="HtmlcallJava()">HtmlcallJava</button>
<button onclick="HtmlcallJava2()">HtmlcallJava2</button>
</body>
</html>

 6、WebView 返回键

public boolean onKeyDown(int keyCode, KeyEvent event) {
  if ((keyCode == KeyEvent.KEYCODE_BACK) && mWebView.canGoBack()) {    
 
    mWebView.goBack();    
    return true; 
  } 
  return super.onKeyDown(keyCode, event);
}

感谢阅读,希望能帮助到大家,谢谢大家对本站的支持,如有疑问请留言或者到本站社区交流讨论,大家共同进步!


# Android  # WebView  # WebView使用方法  # 调用JS  # 三步搞定:Vue.js调用Android原生操作  # DCloud的native.js调用系统分享实例Android版代码  # Android中实现WebView和JavaScript的互相调用详解  # Android编程使用WebView实现与Javascript交互的方法【相互调用参数、传值】  # JS调用Android、Ios原生控件  # Android总结之WebView与Javascript交互(互相调用)  # Android与JS之间跨平台异步调用实例详解  # Android webview和js互相调用实现方法  # Android WebView使用方法详解 附js交互调用方法  # Android与JS相互调用的方法  # 加载  # 我们可以  # 弹出  # 我是  # 给我们  # 重写  # 是在  # 如有  # 找不到  # 可以通过  # 希望能  # 或其他  # 历史记录  # 谢谢大家  # 输入用户名  # 错误信息  # 才能够  # 在等待  # 对话框  # 结束时 


相关栏目: 【 网站优化151355 】 【 网络推广146373 】 【 网络技术251813 】 【 AI营销90571


相关推荐: PHP 500报错的快速解决方法  详解Android中Activity的四大启动模式实验简述  高配服务器限时抢购:企业级配置与回收服务一站式优惠方案  如何确保西部建站助手FTP传输的安全性?  学生网站制作软件,一个12岁的学生写小说,应该去什么样的网站?  Claude怎样写约束型提示词_Claude约束提示词写法【教程】  如何快速上传自定义模板至建站之星?  PHP的CURL方法curl_setopt()函数案例介绍(抓取网页,POST数据)  Laravel如何使用Service Container和依赖注入?(代码示例)  国美网站制作流程,国美电器蒸汽鍋怎么用官方网站?  Android okhttputils现在进度显示实例代码  Linux系统命令中tree命令详解  动图在线制作网站有哪些,滑动动图图集怎么做?  JavaScript中如何操作剪贴板_ClipboardAPI怎么用  在线制作视频的网站有哪些,电脑如何制作视频短片?  Laravel模型事件有哪些_Laravel Model Event生命周期详解  Laravel如何配置Horizon来管理队列?(安装和使用)  Laravel如何实现数据库事务?(DB Facade示例)  Laravel怎么实现模型属性转换Casting_Laravel自动将JSON字段转为数组【技巧】  如何在IIS7中新建站点?详细步骤解析  如何在IIS中新建站点并配置端口与物理路径?  海南网站制作公司有哪些,海口网是哪家的?  Android自定义控件实现温度旋转按钮效果  EditPlus中的正则表达式实战(5)  高端智能建站公司优选:品牌定制与SEO优化一站式服务  广州网站制作公司哪家好一点,广州欧莱雅百库网络科技有限公司官网?  详解Oracle修改字段类型方法总结  高防服务器租用首荐平台,企业级优惠套餐快速部署  如何用AI帮你把自己的生活经历写成一个有趣的故事?  Laravel路由Route怎么设置_Laravel基础路由定义与参数传递规则【详解】  如何注册花生壳免费域名并搭建个人网站?  网站制作大概要多少钱一个,做一个平台网站大概多少钱?  如何在宝塔面板中修改默认建站目录?  Laravel如何实现API速率限制?(Rate Limiting教程)  php中::能调用final静态方法吗_final修饰静态方法调用规则【解答】  Win11任务栏卡死怎么办 Windows11任务栏无反应解决方法【教程】  Laravel用户密码怎么加密_Laravel Hash门面使用教程  Laravel如何使用Gate和Policy进行权限控制_Laravel权限判定与策略规则配置  LinuxCD持续部署教程_自动发布与回滚机制  laravel怎么为API路由添加签名中间件保护_laravel API路由签名中间件保护方法  Laravel如何与Pusher实现实时通信?(WebSocket示例)  Laravel如何实现数据导出到CSV文件_Laravel原生流式输出大数据量CSV【方案】  java中使用zxing批量生成二维码立牌  Laravel如何发送系统通知_Laravel Notifications实现多渠道消息通知  Laravel怎么创建控制器Controller_Laravel路由绑定与控制器逻辑编写【指南】  在线教育网站制作平台,山西立德教育官网?  如何快速搭建自助建站会员专属系统?  如何用腾讯建站主机快速创建免费网站?  Laravel项目如何进行性能优化_Laravel应用性能分析与优化技巧大全  标题:Vue + Vuex 项目中正确使用 JWT 进行身份认证的实践指南