APP封装从一门开始
一门提供APP封装底层开发框架,一键在线APP封装,200+原生APP模块,2000+JS映射接口按需自助封装

h5开发的app调用原生安卓

在H5开发中,有时候需要调用安卓原生的功能,比如调用摄像头、调用相册、获取地理位置等等,这时候就需要用到H5与原生安卓的交互。本文将详细介绍h5开发的app如何调用原生安卓的方法。

**一、原理**

在WebView中加载一个网页,等于在安卓应用程序中内嵌一个浏览器,可以在页面中加载html、css、js等前端技术所编写的内容。此时,H5与原生安卓调用原生功能的方法基于安卓提供的js调用原生方法的接口,通过js与安卓原生相互传递参数与调用,进而实现页面中native与web页面的互相调用、互相传参。

**二、详细介绍**

1.在安卓的MainActivity中指定WebView的加载页面

```

webView.loadUrl("http://www.baidu.com/");

```

2.在H5调用安卓方法前需要先将要调用的方法绑定给WebView

```

//定义一个类,继承自 WebViewClient

public class MyWebViewClient extends WebViewClient {

//设置 WebViewClient 并打开 JS 支持

@Override

public void onPageFinished(WebView view, String url) {

super.onPageFinished(view, url);

webView.loadUrl("javascript:window.android_obj.getSource("

+ "document.body.innerHTML);");//定义JS接口

}

}

//注册方法并为其命名(可自定义)

webView.addJavascriptInterface(this, "android_obj");

webView.setWebViewClient(new MyWebViewClient());

//开启 Javascript 支持

webView.getSettings().setJavaScriptEnabled(true);

```

3.在H5页面中调用安卓原生方法

```

//通过 window.android_obj 引用已经绑定的 getPic 方法

window.android_obj.getPic();

```

4.在安卓中编写具体的JS接口实现类

```

//绑定 JS 接口

webView.addJavascriptInterface(new AndroidJSInterface(), "android_obj");

// JS 接口实现类

public class AndroidJSInterface {

//获取当前的网页源码

@JavascriptInterface

public void getSource(String html) {

Log.e("html", html);

}

//打开相机

@JavascriptInterface

public void openCamera(){

Intent intent = new Intent(MediaStore.ACTION_IMAGE_CAPTURE);

startActivityForResult(intent, 0);

}

}

```

**三、注意事项**

1.在H5调用安卓原生方法时,需要默认在主线程中执行。

2.使用addJavascriptInterface绑定JS接口实现类时,需要为该类所在的包添加注解 @JavascriptInterface。

3.在Android 4.2(API 17)之后,默认不允许在js中调用原生方法,需要在WebView中开启此功能。开启方式为:在WebView中用getSettings()获取WebSettings对象,并通过setJavaScriptEnabled(true)的方式设置开启JS功能。

4.为保证安全性,在H5页面调用原生方法时,需要认真审核并确认方法所传递的参数的充分性、正确性,避免注入等不安全行为的发生。

**四、总结**

综上所述,通过WebView可以实现H5与原生安卓的交互,使得应用程序在满足前端UI美观性的同时,同时调用安卓原生功能,进而增强应用的可用性。同时,在实现过程中,我们还需要认真审核所传递的参数的充分性、正确性,使得应用程序更加安全可靠。


相关知识:
做了app有必要再做h5吗
在开发移动应用时,很多开发者会面临这样一个问题:如果已经有了移动应用,是否还需要开发适用于移动设备的H5页面。首先,需要了解移动应用和H5页面的区别。移动应用是原生应用,需要下载安装到设备上,可以获得更好的性能体验,并且能够完全利用设备的硬件资源,例如调用
2023-05-26
制作h5页面的app
在移动互联网的时代,H5的应用范围越来越广泛,几乎所有的手机APP都会有H5页面。因此,有很多人想学习制作H5页面的APP,下面我来介绍一下制作H5页面的APP的原理或详细步骤。1. 确定开发框架制作H5页面的APP,最基本的需要一个开发框架。常用的开发框
2023-05-26
扬州h5开发app
扬州H5开发APP是一种将网页应用程序(HTML、CSS和JavaScript等)集成到原生APP中的技术。相比于传统的原生APP开发,H5开发可以节省开发成本和时间,同时也可以在多个平台上运行,如iOS、Android等。下面是扬州H5开发APP的详细介
2023-05-26
哪个app制作h5页面模板最多
在现代互联网时代,H5页面已经成为了互联网领域不可或缺的一部分。对于普通人而言,在没有任何编程背景或者专业软件方面的知识储备的情况下,创建H5页面难度极大。然而,使用一些专业的H5页面制作app,就可以轻松地创建自己的页面。那么,在所有H5页面制作app中
2023-05-26
谷歌能上架h5封装app
谷歌应用商店(Google Play)允许上架H5封装APP,这些应用程序的基础架构建立在H5网页技术之上。通过H5技术,移动应用程序可以在不同的平台上运行,无需为不同操作系统、屏幕尺寸和设备类型进行适配。H5封装APP也被称为混合应用程序,因为它们包含原
2023-05-25
java h5开发app教程
Java是一种广泛使用的编程语言,用于开发各种类型的应用程序。随着移动设备的普及,越来越多的Java开发人员开始使用HTML5来创建移动应用程序。在这篇文章中,我们将讨论Java和HTML5技术的结合,以及如何使用它们来构建高质量的移动应用程序。Java和
2023-05-25
uni app h5开发推荐尺寸
Uni app是一款跨平台的开发工具,允许开发者使用一套代码开发出多个平台的应用,包括iOS、Android和H5等。由于不同的平台有着不同的屏幕尺寸和分辨率,所以在开发H5应用时需要特别注意页面的推荐尺寸。H5开发中,页面尺寸的推荐值一般以手机端为主,因
2023-05-25
h5页面制作手机app
H5页面制作手机app的原理是通过在移动端应用中嵌入H5页面的方式实现应用开发和更新的效果。H5页面指的是使用HTML、CSS和JavaScript等技术构建的网页,通过浏览器可以访问。而移动端应用通常使用的是原生代码进行开发,需要在代码中嵌入H5页面以实
2023-05-25
h5前端工程师薪资和app开发工资
H5前端工程师是指负责开发网页和移动端应用的专业人员。其工作内容包括前端UI设计、前端逻辑与架构设计、前端性能优化、浏览器适配和兼容等方面。总体来说,H5前端工程师的薪资水平与其经验、技能以及所在城市有关。首先,H5前端工程师的工资水平与经验相关。一般来说
2023-05-25
h5开发app支付
H5开发APP支付是移动互联网时代不可或缺的支付方式之一。相比于原生 APP 支付,H5支付除了不需要用户下载应用程序外,还可以很好地在各种操作系统和浏览器上兼容使用,为商家和用户提供了极大的便利。那么,H5开发APP支付是如何实现的呢?下面我们来一一介绍
2023-05-25
h5的app制作
H5是一种基于HTML5技术的Web应用程序,可以在移动设备上运行,这意味着可以使用H5应用程序来建立原生应用程序,从而扩展你的应用程序到移动设备。H5应用程序其实就是一个网页,只不过它可以自动适应各种屏幕大小和分辨率,同时具有嵌入式Web浏览器的功能。因
2023-05-25
app开发环境中h5端跨域问题
在移动APP开发中,当我们需要在应用中嵌入H5页面的时候,通常会遇到跨域问题。本文将从原理和详细介绍两个角度对这个问题进行解析。原理首先我们来了解一下什么是跨域问题。跨域问题指的是在同源策略下,由于浏览器的安全限制,一个网页无法直接访问另一个域名下的资源。
2023-05-25
©2015-2021 一门APP yimenapp.com  川公网安备 51019002001185号 蜀ICP备17005078号-3