Webview之H5页面调用android的图库及文件管理
- h5页面打开图片管理器
一般页面在pc打开文件管理器是用 type=”file”的代码,可是这在android的webview是无效的,必须为webview设定WebChromeClient代码如下:
1. mWebview.setWebChromeClient(((HomeActivity) mContext).mOpenFileWebChromeClient);
2. OpenFileWebChromeClient类中重写并添加onShowFileChooser、openFileChooser:这样才会打开文件管理器,但是还需要把选择的地址穿回到页面,具体看3.
public class OpenFileWebChromeClient extends WebChromeClient {
public static final int REQUEST_FILE_PICKER = 1;
public ValueCallback<Uri> mFilePathCallback;
public ValueCallback<Uri[]> mFilePathCallbacks;
Activity mContext;
public OpenFileWebChromeClient(Activity mContext){
super();
this.mContext = mContext;
}
// Android < 3.0 调用这个方法
public void openFileChooser(ValueCallback<Uri> filePathCallback) {
mFilePathCallback = filePathCallback;
Intent intent = new Intent(Intent.ACTION_GET_CONTENT);
intent.addCategory(Intent.CATEGORY_OPENABLE);
intent.setType("*/*");
mContext.startActivityForResult(Intent.createChooser(intent, "File Chooser"),
REQUEST_FILE_PICKER);
}
// 3.0 + 调用这个方法
public void openFileChooser(ValueCallback filePathCallback,
String acceptType) {
mFilePathCallback = filePathCallback;
Intent intent = new Intent(Intent.ACTION_GET_CONTENT);
intent.addCategory(Intent.CATEGORY_OPENABLE);
intent.setType("*/*");
mContext.startActivityForResult(Intent.createChooser(intent, "File Chooser"),
REQUEST_FILE_PICKER);
}
// / js上传文件的<input type="file" name="fileField" id="fileField" />事件捕获
// Android > 4.1.1 调用这个方法
public void openFileChooser(ValueCallback<Uri> filePathCallback,
String acceptType, String capture) {
mFilePathCallback = filePathCallback;
Intent intent = new Intent(Intent.ACTION_GET_CONTENT);
intent.addCategory(Intent.CATEGORY_OPENABLE);
intent.setType("*/*");
mContext.startActivityForResult(Intent.createChooser(intent, "File Chooser"),
REQUEST_FILE_PICKER);
}
@Override
public boolean onShowFileChooser(WebView webView,
ValueCallback<Uri[]> filePathCallback,
WebChromeClient.FileChooserParams fileChooserParams) {
mFilePathCallbacks = filePathCallback;
Intent intent = new Intent(Intent.ACTION_GET_CONTENT);
intent.addCategory(Intent.CATEGORY_OPENABLE);
intent.setType("*/*");
mContext.startActivityForResult(Intent.createChooser(intent, "File Chooser"),
REQUEST_FILE_PICKER);
return true;
}
}
3.地址回传至页面:
在2中提到了.startActivityForResult(Intent.createChooser(intent, "File Chooser"),这个里面会回调activity的onActivityResult方法,所以在所在的activity中添加如下代码:
/**
* 以下是webview的照片上传时候,用于在网页打开android图库文件
*/
public OpenFileWebChromeClient mOpenFileWebChromeClient = new OpenFileWebChromeClient(
this);
@Override
public void onActivityResult(int requestCode, int resultCode, Intent intent) {
if (requestCode == OpenFileWebChromeClient.REQUEST_FILE_PICKER) {
if (mOpenFileWebChromeClient.mFilePathCallback != null) {
Uri result = intent == null || resultCode != Activity.RESULT_OK ? null
: intent.getData();
if (result != null) {
String path = MediaUtility.getPath(getApplicationContext(),
result);
Uri uri = Uri.fromFile(new File(path));
mOpenFileWebChromeClient.mFilePathCallback
.onReceiveValue(uri);
} else {
mOpenFileWebChromeClient.mFilePathCallback
.onReceiveValue(null);
}
}
if (mOpenFileWebChromeClient.mFilePathCallbacks != null) {
Uri result = intent == null || resultCode != Activity.RESULT_OK ? null
: intent.getData();
if (result != null) {
String path = MediaUtility.getPath(getApplicationContext(),
result);
Uri uri = Uri.fromFile(new File(path));
mOpenFileWebChromeClient.mFilePathCallbacks
.onReceiveValue(new Uri[] { uri });
} else {
mOpenFileWebChromeClient.mFilePathCallbacks
.onReceiveValue(null);
}
}
mOpenFileWebChromeClient.mFilePathCallback = null;
mOpenFileWebChromeClient.mFilePathCallbacks = null;
}
}
public class MediaUtility {
/**
* Get a file path from a Uri. This will get the the path for Storage Access
* Framework Documents, as well as the _data field for the MediaStore and
* other file-based ContentProviders.
*
* @param context The context.
* @param uri The Uri to query.
* @author paulburke
*/
@TargetApi(Build.VERSION_CODES.KITKAT)
public static String getPath(final Context context, final Uri uri) {
final boolean isKitKat = Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT;
// DocumentProvider
if (isKitKat && DocumentsContract.isDocumentUri(context, uri)) {
// ExternalStorageProvider
if (isExternalStorageDocument(uri)) {
final String docId = DocumentsContract.getDocumentId(uri);
final String[] split = docId.split(":");
final String type = split[0];
if ("primary".equalsIgnoreCase(type)) {
return Environment.getExternalStorageDirectory() + "/" + split[1];
}
// TODO handle non-primary volumes
}
// DownloadsProvider
else if (isDownloadsDocument(uri)) {
final String id = DocumentsContract.getDocumentId(uri);
final Uri contentUri = ContentUris.withAppendedId(Uri.parse("content://downloads/public_downloads"), Long.valueOf(id));
return getDataColumn(context, contentUri, null, null);
}
// MediaProvider
else if (isMediaDocument(uri)) {
final String docId = DocumentsContract.getDocumentId(uri);
final String[] split = docId.split(":");
final String type = split[0];
Uri contentUri = null;
if ("image".equals(type)) {
contentUri = MediaStore.Images.Media.EXTERNAL_CONTENT_URI;
} else if ("video".equals(type)) {
contentUri = MediaStore.Video.Media.EXTERNAL_CONTENT_URI;
} else if ("audio".equals(type)) {
contentUri = MediaStore.Audio.Media.EXTERNAL_CONTENT_URI;
}
final String selection = "_id=?";
final String[] selectionArgs = new String[]{split[1]};
return getDataColumn(context, contentUri, selection, selectionArgs);
}
}
// MediaStore (and general)
else if ("content".equalsIgnoreCase(uri.getScheme())) {
return getDataColumn(context, uri, null, null);
}
// File
else if ("file".equalsIgnoreCase(uri.getScheme())) {
return uri.getPath();
}
return null;
}
/**
* Get the value of the data column for this Uri. This is useful for
* MediaStore Uris, and other file-based ContentProviders.
*
* @param context The context.
* @param uri The Uri to query.
* @param selection (Optional) Filter used in the query.
* @param selectionArgs (Optional) Selection arguments used in the query.
* @return The value of the _data column, which is typically a file path.
*/
public static String getDataColumn(Context context, Uri uri, String selection, String[] selectionArgs) {
Cursor cursor = null;
final String column = "_data";
final String[] projection = {column};
try {
cursor = context.getContentResolver().query(uri, projection, selection, selectionArgs, null);
if (cursor != null && cursor.moveToFirst()) {
final int column_index = cursor.getColumnIndexOrThrow(column);
return cursor.getString(column_index);
}
} finally {
if (cursor != null) cursor.close();
}
return null;
}
/**
* @param uri The Uri to check.
* @return Whether the Uri authority is ExternalStorageProvider.
*/
public static boolean isExternalStorageDocument(Uri uri) {
return "com.android.externalstorage.documents".equals(uri.getAuthority());
}
/**
* @param uri The Uri to check.
* @return Whether the Uri authority is DownloadsProvider.
*/
public static boolean isDownloadsDocument(Uri uri) {
return "com.android.providers.downloads.documents".equals(uri.getAuthority());
}
/**
* @param uri The Uri to check.
* @return Whether the Uri authority is MediaProvider.
*/
public static boolean isMediaDocument(Uri uri) {
return "com.android.providers.media.documents".equals(uri.getAuthority());
}
}
Webview之H5页面调用android的图库及文件管理的更多相关文章
- 在Angular.js中的H5页面调用Web api时跨域问题处理
/// <summary> /// 被请求时 /// 在Angular.js中的H5页面调用Web api时跨域问题处理 /// </summary> /// <para ...
- 前端如何在h5页面调用微信支付?
在微信服务号开发的时候经常会遇到微信支付的功能实现,通过实际经验自己总结了一下,前端在H5页面调起微信支付有两种办法,一是利用内置对象,二是通过引用微信的js sdk,亲测都能支付成功,从写法上来看用 ...
- 微信小程序web-view(webview) 嵌套H5页面 唤起微信支付的实现方案
场景:小程序页面有一个web-view组件,组件嵌套的H5页面,要唤起微信支付. 先讲一下我的项目,首先我是自己开发的一个H5触屏版的商城系统,里面含有购物车,订单支付等功能.然后刚开始,我们公众号里 ...
- H5页面调用admob激励视频,用户获取奖励
应用前提条件 使用 Android Studio 3.2 或更高版本 确保您应用的 build 文件使用以下值: minSdkVersion 为 16 或更高版本 compileSdkVersion ...
- h5页面嵌入android app时遇到的问题
1.h5页面 通过 .css("transform") 或 .style.transform 获取 transform属性,并通过 split 方法解析 页面translateY ...
- 混合app开发,h5页面调用ios原生APP的接口
混合APP开发中,前端开发H5页面,不免会把兼容性拉进来,在做页面的兼容性同事,会与原生app产生一些数据交互: 混合APP开发,安卓的兼容性倒是好说,安卓使用是chrome浏览器核心,已经很好兼容H ...
- 在webView 中使用JS 调用 Android / IOS的函数 Function
最近做一个项目,混合了NativeCode 和 HTML,为了便于JS 调用App的一些方法,统一封装一个Js方法,记录如下 Android 端首先要再WebView中允许JS的调用 WebView ...
- 小程序-web-view嵌入H5页面遇到的bug
遇到的问题1:ios页面中,内容过多时有下滑真是功能,但是下滑的时候回看到底部的微信自带的灰色背景及H5的域名(ios的webview中上/下拉露出黑灰色背景问题) 解决办法:给body添加样式--- ...
- 微信h5页面调用第三方位置导航
微信h5页面拉起第三方导航应用 需要准备的: 通过微信认证的公众号有备案过的域名 背景:微信公众号点击菜单栏跳到h5页面,需要用到导航功能 需求:当用户点击导航按钮时,跳转到第三方app进行导航 参考 ...
随机推荐
- SpringMVC 框架系列之组件概述与配置详解
在上一篇文章 SpringMVC 框架系列之初识与入门实例 的实例中,我们已经知道,SpringMVC 框架是一个 web 层的框架,本篇文章就详细解释一下 SpringMVC 框架具体文件的配置以及 ...
- Css3关键帧动画
@keyframes设置动画规则,可以理解为一个剧本: 1.name动画的名字必需填写 2.可以使用百分比0%-100%或者from...to...必填内容: 3.需要变化css的样式:必需: ani ...
- (luogu4180) [Beijing2010组队]次小生成树Tree
严格次小生成树 首先看看如果不严格我们怎么办. 非严格次小生成树怎么做 由此,我们发现一个结论,求非严格次小生成树,只需要先用kruskal算法求得最小生成树,然后暴力枚举非树边,替换路径最大边即可. ...
- [清华集训]小 Y 和恐怖的奴隶主
题面在这里 题意 有一个\(Boss\)和他血量为\(m\)的随从奴隶主,每当奴隶主受到攻击且不死,并且\(Boss\)的随从个数\(<k\)时,就会新召唤一个血量为\(m\)的奴隶主.每次攻击 ...
- 小程序 - swiper除了左右切换还有上下滚动超出屏幕的内容
本来呢,我是有专门整理小程序恶心bug的文章的,每次只要添加汇总就好, 但是呢,鉴于这个问题的恶心程度,所以我把他单独拿出来说了. ---------------------------------- ...
- Zabbix JMX之tomcat监控
工作原理: 1.JAVA-GATEWAY Zabbix本身不支持直接监控Java,在zabbix 1.8以前,只能使用Zapcat来做代理监控,而且要修改源代码,非常麻烦.所有后来为了解决这个监控问 ...
- 【前端单元测试入门01】Mocha与chai
Mocha 的简介 Mocha是流行的JavaScript测试框架之一,通过它添加和运行测试,从而保证代码质量 Mocha 的安装与配置 全局安装Mocha npm install -g mocha ...
- NOIP2017 总结
联赛结束,但是我并没有得到预期的结果,特写此文分析原因,希望我不会就此退役. 回顾一年,我做了什么? 2016年联赛,我水了两天,抱着挂掉的心态拿到了1=. 2016-2017寒假,参加集训,三天考试 ...
- Jmeter + Ant 测试环境搭建 及解决问题: the <jmeter> type doesn't support nested text data
1.首先确保测试机器中已经按照jdk1.6以上版本,如果没有,那就上官网下载吧. 2.下载Ant,解压至指定目录,并配置好环境变量:http://ant.apache.org/ 在命令行下执行ant ...
- centos7上安装ELK
author:headsen chen data :2017-12-04 18:00:57 notice:created by chen himself and not allowed to cop ...