Android webview读取html和js

ilovedich 2012-01-30

WebView对Javascript的支持也很强，google一个Java和Javascript互调的例子  
整个Eclipse ADT工程例子中都有，这里重点分析一下代码：

  1. public class WebViewDemo extends Activity {  
  2.     private WebView mWebView;  
  3.     private Handler mHandler = new Handler();  
  4.   
  5.     public void onCreate(Bundle icicle) {  
  6.         super.onCreate(icicle);  
  7.         setContentView(R.layout.webviewdemo);  
  8.         mWebView = (WebView) findViewById(R.id.webview);  
  9.         WebSettings webSettings = mWebView.getSettings();  
  10.         webSettings.setJavaScriptEnabled(true);  
  11.         mWebView.addJavascriptInterface(new Object() {  
  12.             public void clickOnAndroid() {  
  13.                 mHandler.post(new Runnable() {  
  14.                     public void run() {  
  15.                         mWebView.loadUrl("javascript:wave()");  
  16.                     }  
  17.                 });  
  18.             }  
  19.         }, "demo");  
  20.         mWebView.loadUrl("file:///android_asset/demo.html");  
  21.     }  
  22. }  

这里的重点是addJavascriptInterface(Object obj,String interfaceName)方法，该方法将一个java对象绑定到一个javascript对象中，javascript对象名就是interfaceName，作用域是Global。这样初始化webview后，在webview加载的页面中就可以直接通过javascript:window.demo访问到绑定的java对象了。来看看在html中是怎样调用的：

  1. <html>  
  2.         <script language="javascript">  
  3.                 function wave() {  
  4.                     document.getElementById("droid").src="android_waving.png";  
  5.                 }  
  6.         </script>  
  7.         <body>  
  8.             <a onClick="window.demo.clickOnAndroid()">  
  9.                                 <img id="droid" src="android_normal.png"/><br>  
  10.                                 Click me!  
  11.             </a>  
  12.         </body>  
  13. </html>  

这样在javascript中就可以调用java对象的clickOnAndroid()方法了，wave()方法是java中调用javascript的例子。

这里还有几个知识点：

1)为了让WebView从apk文件中加载assets，Android SDK提供了一个schema，前缀为"file:///android_asset/"。WebView遇到这样的schema，就去当前包中的assets目录中找内容。如上面的"file:///android_asset/demo.html"

2)addJavascriptInterface方法中要绑定的Java对象及方法要运行另外的线程中，不能运行在构造他的线程中，这也是使用Handler的目的。

ilovedich

ilovedich

相关推荐

appium-Hybird应用自动化

基于UIAutomator+ChromeDrivernative部分走UIAutomator，webview部分走Chromedriver，两者结合混搭，从而实现Hybrid自动化。检查adb连接，保持设备是连接上的。在设置中勾选本地资源。一般切换到web

dangai00 / 0评论 2020-07-18

五分钟实现，一个RN App开发调试工具

在React Native开发过程中，做为开发人员，我们经常做着费力不“讨好”的事情，这样占用我们不少时间：。按测试同学的的bug描述，登录指定的账号走一遍验证一下问题是否存在。若bug存在则，在app的调试模式下再验证是否存在，并查看日志或者断点调试查看

xhpscdx / 0评论 2020-05-31

IOS Cordova嵌套Cocos Creator的坑

最近在看如何把H5游戏嵌套发布在app上，于是用Cordova作为工具。然而之前Cordova在IOS上是用UIWebview，但是IOS新版本上强制要用wkwebview。还好新版Cordova也支持了，但是遇到了一个坑，加载不了：。因为Cordova必

chenxiangpeng / 0评论 2020-04-30

android中通过kotlin使用WebView（二）

　　本文记录如何让网页中的JS代码和APP进行交互，简单的说就是如何在网页中执行APP的代码。下面以在网页中执行代码打开拨号键盘并输入电话号码为例介绍如何实现。　　一、设置WebView允许它执行js代码。　　二、通过调用WebView的addJavasc

ncuboy0wsq / 0评论 2020-03-27

5000字解析：前端五种跨平台技术

本文不涉及到任何代码，只讲概念层面的，结合本人在实际开发过程中的各种体验，对这几种跨平台技术进行一个点评。传统的纯原生开发已经不能满足日益增长的业务需求。主要表现在如下两个方面。动态化内容需求增大。开发团队，版本迭代时，无论人力成本还是测试成本都会变大。针

学习web前端 / 0评论 2020-03-23

应对iOS政策，白鹭引擎助力数十家团队过审 AppStore 经验分享

2019年苹果更新了对HTML5游戏的政策，要求HTML5游戏应在 Safari浏览器中展现，而不是直接打包为 ipa 发布到 AppStore 中，对此，很多 开发者给予关注，并跟我们咨询寻求帮助，解决他们在白鹭引擎开发的HTML5游戏发布到AppSto

APCDE / 0评论 2020-03-04

应对iOS政策，白鹭引擎助力数十家团队过审 AppStore 经验分享

2019年苹果更新了对HTML5游戏的政策，要求HTML5游戏应在 Safari浏览器中展现，而不是直接打包为 ipa 发布到 AppStore 中，对此，很多 开发者给予关注，并跟我们咨询寻求帮助，解决他们在白鹭引擎开发的HTML5游戏发布到AppSto

歆萌 / 0评论 2020-03-03

flutter_html 和 WebView 解析html

a=getPortalArticle&aid=20. aid=198

owhile / 0评论 2020-02-25

Andriod使用WebView制作webAPP

安卓期末考试做一个app，使用原生安卓开发界面太慢便采用了WebView的方式封装一个WebApp,界面做到响应式即可。-- 允许网络连接-->. 若为苹果手机，在AndriodStudio中使用安卓虚拟机，请确保虚拟机开启wifi并联网！！打开控制

csdnuuu / 0评论 2020-01-04

关于小程序的内嵌其他网页

承载网页的容器。会自动铺满整个小程序页面，个人类型的小程序暂不支持使用。

yuanye0 / 0评论 2019-12-25

vivo web service：亿万级规模web服务引擎架构

vivo web service是开发团队围绕奇点内核打造出的基于vivo手机平台的web服务引擎，该服务引擎从浏览器产品线中经过多年迭代而出。除了提供可靠的基础Web服务，服务引擎还集成了非常强大的扩展功能。本文从架构方面对该服务引擎进行一次简单剖析，帮

水龙吟的备忘录 / 0评论 2019-11-18

android关于加载本地html5的问题

刚开始看见这个问题我一头雾水，根本不知道从哪儿着手，我就在百度上搜这个错误的相关信息，在网上查阅了资料才发现是浏览器的安全性设置问题，因为android手机的默认浏览器都是webkit内核的，而webkit内核的浏览器默认是禁止从本地ajax加载文件的。这

icewizardry / 0评论 2014-04-10

Hybrid开发

Native与前端的界限，首先Native提供的是一宿主环境，要合理的利用Native提供的能力，要实现通用的Hybrid平台架构。与Native的互相跳转，比如H5如何跳到一个Native页面，H5如何新开Webview做动画跳到另一个H5页面。Nati

元元 / 0评论 2019-11-17

Android适配使用webview加载后图片显示过大的问题

下面来看看解决方案：webview的基本使用流程这里我就不重复说明了，本篇针对的是文章详情加载完成后出现的情况，这里我们使用的方法是：通过js脚本，重置img标签中图片的宽度和高度。使用步骤：1、此方法需要使用js,所以webview设置属性中一定要添加下

androidstudyroom / 0评论 2019-11-08

用phoneGap打包一个基于Android的WebApp

对于Android, Sencha的phonegap也是基于此方法对网页程序进行打包的，下载phonegap后，其主要包括二个文件：。此jar文件中包含了类DroidGap，其对Activity及WebView进行了适当的封装，可以让用户更方便地进行打包。

czpaex / 0评论 2011-09-11

Android中WebView载入本地HTML代码并实现Java与JavaScript交互

正在开发一个地图程序, 相对于用XML写安卓界面, 我更愿意用这个偷懒的办法,就是不用Android自带的MapView, 而是使用之前就已经比较熟悉的Google Maps JavaScript API,在Android的WebView中载入HTML代码

OldSoldier / 0评论 2011-08-18

关于做Android+J2ee系统集成开发的一点心得

前言： 很早以前，就听人说过Android以后会火起来，作为一个前瞻性对它有所了解会是一个转型的好机会，javaweb太成熟饱和了，现在市面上各种Android手机层出不穷，网上各种Android视频连续剧一样跟进，安卓一下子成为了热门话题，刚开始也是出于

wangdaiying / 0评论 2011-05-26

Android与js交互实例

Android中可以通过webview来实现和js的交互，在程序中调用js代码，只需要将webview控件的支持js的属性设置为true

西木 / 0评论 2014-01-12

移动开发中的 Web：WebView、Web 优化、热修复、跨平台……

移动开发领域近年来已经逐渐告别了野蛮生长的时期，进入了相对成熟的时代。而一直以来 Native 和 Web 的争论从未停止，通过开发者孜孜不倦的努力，Web 的效率和 Native 的体验也一直在寻求着平衡。本文聚焦 iOS 开发和 Web 开发的交叉点，

qixiang0 / 0评论 2019-08-24

android WebView总结

浏览器控件是每个开发环境都具备的，这为马甲神功提供了用武之地，windows的有webbrowser，android和ios都有webview。只是其引擎不同，相对于微软的webbrowser，android及ios的webview的引擎都是webkit，

doomvsjing / 0评论 2014-03-20

android webview js交互 （java和js交互）

在android的开发过程中，有很多时候需要用到本地java代码和javascript进行交互。android对交互进行了很好的封装，在开发中我们可以很简单的用java代码调用webview中的js，也可以用webview中的js来调用本地的java代码，

zengdaquan00 / 0评论 2014-03-20

隐藏android WebView 高亮选择框

结合HTML+CSS+JS+phonegap来开发移动APP开始广泛应用， 最简单方法就是把phonegap当作一个WebView来加载本地代码。在测试过程中发现每当点击页面元素时，android模拟器就会默认显示一个高亮的边框， 像这样：。按理也可以隐藏

Mexican / 0评论 2014-03-19

微信小程序 webview 与 h5 通过 postMessage 实现实时通讯的实现

在做 React Native 应用时，如果需要在 App 里面内嵌 H5 页面，那么 H5 与 App 之间可以通过 Webview 的 PostMessage 功能实现实时的通讯，但是在小程序里面，虽然也提供了一个 webview 组件，但是，在进行

liangliangshuo / 0评论 2019-11-03

跨平台移动端框架UniApp的应用实践

CRM改造项目需要研发涵盖网上营业厅主要业务能力的移动端掌厅APP，项目整体开发周期较短，且要求支持多平台上线。每个平台要求相对一致的展示效果和用户体验，多端多尺寸设备的适配效果和SDK接入都成为痛点，引入一套跨平台的Hybrid框架势在必行。以往最早的以

qinxu / 0评论 2019-10-25

Android+J2EE系统集成开发

javaweb太成熟饱和了，现在市面上各种Android手机层出不穷，网上各种Android视频连续剧一样跟进，安卓一下子成为了热门话题，刚开始也是出于个人兴趣学的很hi感觉挺容易上手的样子，后来工作中才发现问题很多也很棘手，慢慢的在纠结和痛苦中琢磨出了一

rookieding / 0评论 2011-10-12

Android:如何在java代码中覆盖webview中的javascript事件

如此一来，每当这个webView加载完一个页面，而且这个页面有ID为“mySourceButton”的元素，那这个元素的点击事件就被修改为用户自定义的暴露给javascript调用的toMyPage()事件。一旦点击，界面就跳转，或者做任何你想做的事情

angqiuli / 0评论 2011-10-07

IOS -&gt; Cordova 将 view 下移 避免 和 状态栏重叠

// View defaults to full size. If you want to customize the view's size, or its subviews ,

Go贝壳 / 0评论 2015-06-14

ruby小概念 须知

Ruby，一种为简单快捷的面向对象编程而创的脚本语言，在20世纪90年代由日本人松本行弘开发，遵守GPL协议和Ruby License。它的灵感与特性来自于 Perl、Smalltalk、Eiffel、Ada以及 Lisp 语言。Ruby的作者于1993年

Xunzi / 0评论 2015-04-06

Android开发教程：浅谈WebView

WebView能加载显示网页，可以将其视为一个浏览器。它使用了WebKit渲染引擎加载显示网页，实现WebView有以下两种不同的方法：

ThedakeLaugh / 0评论 2012-01-29

Android利用WebView与JavaScript交互的方法

使用WebView播视频，整了个优酷的开发页面，但装上Android，没反应。不过，在使用webView时，倒是对webView与html中的javascript的调用方式学习了一下，还是使用的网上的经典案例。这样在javascript中就可以调用java

翊寒 / 0评论 2011-12-31

Android中Webview使用自定义的JavaScript进行回调

先说为什么需要讨论这个问题。现在很多的手机应用，都可能会直接嵌入一个web页面。但是从现有的反馈来看，速度较慢，体验较差）。类似这样的js语句。我们现在需要做的，就是显示用户列表页面，然后在用户点击头像以后，响应具体的js请求，跳到该好友详细页面。

angqiuli / 0评论 2012-01-19

React Native WebView使用本地HTML文件

'use strict';var React = require('react-native');StyleSheet,Text,View,WebView,} = React;content: '',});},},this.setState( {conte

sweetga / 0评论 2016-01-13

android与原生的JS交互

// Sets the chrome handler. This is an implementation of WebChromeClient. // for use in handling JavaScript dialogs, favicons, t

zmmzmm / 0评论 2016-01-04

微信小程序与webview交互实现支付功能

实现原理：点击h5网页的支付按钮――(跳转)――>嵌套改h5的小程序的支付页面――――>跳转至支付完成后的页面。小程序嵌套h5页面后，需要在微信公众平台配置h5网页的业务逻辑名，否则无法访问。

weishine / 0评论 2019-06-07

深入了解响应式React Native Echarts组件

一种在 React Native 中封装的响应式 Echarts 组件，使用与示例请参见：react-native-echarts-demo. 近年来，随着移动端对数据可视化的要求越来越高，类似 MPAndroidChart 这样的传统图表库已经不能满足产

Java学习之乐 / 0评论 2019-05-29

研究人员揭示了Chrome for Android中的高风险漏洞

Google在今年早些时候发布的Android例行安全更新中修复了Android WebView Web浏览器组件中的高风险安全漏洞。然而，在发现漏洞的研究人员披露漏洞之前，没有人知道漏洞的细节是什么以及危险是什么。此漏洞在年初立即提交给Google进行确

yutian0 / 0评论 2019-03-23

WebView使用

“热更新”、“热部署”相信对于混合式开发的童鞋一定不陌生，那么APP怎么避免每次升级都要在APP应用商店发布呢？这里就用到了混合式开发的概念，对于电商网站尤其显得重要，不可能每次发布一个活动，都要发布一个现版本，当然这样对于Android还算可以，但是对于

韩伟佳 / 0评论 2018-05-17

android webview调用js完全解析（所有坑都能解决）

一定要放在onPageFinished中，保证webview已经加载完毕，再调用js。上面通过android调用js的弹窗功能。这也是我们常用的js测试功能。现在可以说配置完成了，当我们运行上面代码，发现并没有alert数据，这也是困扰我比较长时间的地方。

lynxnative / 0评论 2018-09-28

Android开发如何正确使用WebView

Android和iOS系统都提供了标准的浏览器控件，在Android中是WebView，iOS中为UIWebView。在iOS中你实例化一个UIWebView即可调用loadRequest来加载一个网页，但是在Android中你不仅需要创建一个WebVie

lixuce / 0评论 2013-06-25

android WebView结合jQuery mobile之基础：整合篇

创建assets/index.html，注意jQuery库和css路径千万不要搞错了。

jiedinghui / 0评论 2013-06-23

可能这些是你想要的H5软键盘兼容方案

前言最近一段时间在做 H5 聊天项目，踩过其中一大坑：输入框获取焦点，软键盘弹起，要求输入框吸附（或顶）在输入法框上。需求很明确，看似很简单，其实不然。从实验过一些机型上看，发现主要存在以下问题：。在 Android 和 IOS 上，获知软键盘弹起和收起状

我的iOS王者之路 / 0评论 2019-07-01

Android 与 JavaScript 交互 支持的数据类型

在Android混合开发中,WebView是中间件,承担着渲染网页的职责。WebView的使用教程参见官网和Carson_Ho的这篇博客。前者允许Android原生与H5之间的交互，后者将Java对象映射为JavaScript的对象。JS调用Android

Jemy杰 / 0评论 2019-07-01

微信，支付宝小程序实现原理概述

页面结构页面结构文件为index.wxml，通过微信自定义的标签来写。页面逻辑页面逻辑通过JavaScript来书写。页面样式表类似CSS文件，来定义页面内元素的样式。页面配置页面内的权限等配置信息。微信小程序的技术选型小程序的定位特点是轻，快，针对这两个

目尽地平线 / 0评论 2019-07-01

WebView加载优化

同时请求文件越多，消耗的流量也会越多。第二个，就是缓存的问题 倘若你不采用或不完全采用第一条资源本地化的思路，那么你的WebView缓存是必须要开启的。） 所以这时，离线缓存的问题就值得我们注意。这里我的思路是，在开启缓存的前提下，WebView在加载页面

jianzhandaren / 0评论 2019-07-01

Weex系列(6) —— web组件和webview

最后一章就简单分析一下流程原理。还是言归正传吧，webview是一个基于webkit引擎、展现web页面的控件，app里面是经常用到的，weex官方提供了web组件。webview这块是比较复杂的，所以官方提供的远远不够，但是对原生又不是很熟悉，就找到组件

yaonga / 0评论 2019-07-01

一篇文章了解大前端

简单来说，大前端就是所有前端的统称，比如Android、iOS、web、Watch等，最接近用户的那一层也就是UI层，然后将其统一起来，就是大前端。大前端最大的特点在于一次开发，同时适用于所有平台，开发者不用为一个APP需要做Android和iOS两种模式

softwear / 0评论 2019-07-01

WebView与APP交互实战记录

WebView与APP交互WebView与APP交互，即网页通过JSBrige调用APP的功能，APP也可以通过JSBrige调用网页提供的方法。最近刚好接触到这一块，记录一下前端侧的实际操作过程,这篇文章适合还没接触过这一块的同学们，这里不讲原理，直接开

herionliu / 0评论 2019-07-01

WebView使用

“热更新”、“热部署”相信对于混合式开发的童鞋一定不陌生，那么APP怎么避免每次升级都要在APP应用商店发布呢？这里就用到了混合式开发的概念，对于电商网站尤其显得重要，不可能每次发布一个活动，都要发布一个现版本，当然这样对于Android还算可以，但是对于

true00 / 0评论 2018-05-17

js关闭当前页面(支付宝,微信,app)

使用js 关闭当前页面 , 一般想到的都是 window.close() , 但是该方法只能关闭通过 window.open() 打开的页面。所以针对这种情况 , 只能分情况去解决 .在微信 , 支付宝 , app 中打开外部链接 , 都是使用webvie

xuesong / 0评论 2019-06-30