原链接：http://blog.saymagic.cn/2015/11/08/webview-upload.html?utm_source=tuicool&utm_medium=referral

从零开始

我们在xml中写入一个简单的Webview组件：

  1. <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
  2. xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent"
  3. android:layout_height="match_parent"
  4. tools:context=".MainActivity">
  5. <WebView
  6. android:id="@+id/webview"
  7. android:layout_width="fill_parent"
  8. android:layout_height="fill_parent"
  9. android:layout_margin="5dp"></WebView>
  10. </RelativeLayout>

然后在Java代码中使用其加载一个能够提供上传服务的URL：

  1. WebView webview = (WebView) findViewById(R.id.webview);
  2. webview.loadUrl(A_UPLOAD_URL);

之后，要加网络权限：

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

如果想让Webview能够访问本地资源，SD卡的读写权限也是避免不了的：

  1. <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE"/><uses-permission android:name="android.permission.MOUNT_UNMOUNT_FILESYSTEMS"/>

最后，我们运行，会发现根本不能访问本地资源。Why？

让我们来填补第一个坑：

支持上传文件

Webview执行上传操作的逻辑是这样的：首先准备上传时会回调WebChromeClient类下的openFileChooser方法，在这个方法中给我们机会发起Intent来打开支持提供文件的第三方应用，最后在onActivityResult回调中将第三方应用提供的内容通过一个叫做ValueCallback的参数返回给Webview（详细点来说：ValueCallback是在openFileChooser 方法里由webview提供给我们的，里面包裹一个Uri，我们在onActivityResult 里将选中的Uri反馈给ValueCallback，这时候相当于Webview就知道我们选择了什么文件），因此，我们需要为Webview设置一个提供openFileChooser方法的WebChromeClient，这个方法在不同版本的Android中参数是不同的，为此我们一般需要写三个重载函数，大致像这个样子：

  1. private ValueCallback<Uri> mUploadMessage;
  2. //设置`WebChromeClient`:
  3. webview.setWebChromeClient(new WebChromeClient(){
  4. public void openFileChooser(ValueCallback<Uri> uploadMsg) {
  5. Log.d(TAG, "openFileChoose(ValueCallback<Uri> uploadMsg)");
  6. mUploadMessage = uploadMsg;
  7. Intent i = new Intent(Intent.ACTION_GET_CONTENT);
  8. i.addCategory(Intent.CATEGORY_OPENABLE);
  9. i.setType("*/*");
  10. MainActivity.this.startActivityForResult(Intent.createChooser(i, "File Chooser"), FILECHOOSER_RESULTCODE);
  11. }
  12. public void openFileChooser( ValueCallback uploadMsg, String acceptType ) {
  13. Log.d(TAG, "openFileChoose( ValueCallback uploadMsg, String acceptType )");
  14. mUploadMessage = uploadMsg;
  15. Intent i = new Intent(Intent.ACTION_GET_CONTENT);
  16. i.addCategory(Intent.CATEGORY_OPENABLE);
  17. i.setType("*/*");
  18. MainActivity.this.startActivityForResult(
  19. Intent.createChooser(i, "File Browser"),
  20. FILECHOOSER_RESULTCODE);
  21. }
  22. public void openFileChooser(ValueCallback<Uri> uploadMsg, String acceptType, String capture){
  23. Log.d(TAG, "openFileChoose(ValueCallback<Uri> uploadMsg, String acceptType, String capture)");
  24. mUploadMessage = uploadMsg;
  25. Intent i = new Intent(Intent.ACTION_GET_CONTENT);
  26. i.addCategory(Intent.CATEGORY_OPENABLE);
  27. i.setType("*/*");
  28. MainActivity.this.startActivityForResult( Intent.createChooser( i, "File Browser" ), MainActivity.FILECHOOSER_RESULTCODE );
  29. }
  30. });
  31. //onActivityResult回调
  32. @Override
  33. protected void onActivityResult(int requestCode, int resultCode, Intent data) {
  34. super.onActivityResult(requestCode, resultCode, data);
  35. if(requestCode==FILECHOOSER_RESULTCODE)
  36. {
  37. if (null == mUploadMessage && null == mUploadCallbackAboveL) return;
  38. Uri result = data == null || resultCode != RESULT_OK ? null : data.getData();
  39. if (mUploadMessage != null) {
  40. mUploadMessage.onReceiveValue(result);
  41. mUploadMessage = null;
  42. }
  43. }
  44. }

还有重要的一点：如果这个上传操作涉及到JS操作，别忘记对Webview开启对JS的支持：

  1. WebSettings settings = webview.getSettings();
  2. settings.setJavaScriptEnabled(true);

这样，打个debug包测试看以下，不出意外我们的Webview应该可以支持上传操作了。

别高兴得太早，如果这个时候产品要将release包推向市场，当你把release包交给产品时，你会发现你的Webview又不能上传了，什么情况？

请听Webview上传操作的第二个坑。

支持release版

debug版是好的，为什么release就不行了呢？准确的说，开启了混淆的release包是不可以的，究其原因在于,openFileChooser 方法并不是WebChromeClient 的对外开放的方法，因此这个方法会被混淆，解决办法也比较简单，只需要在混淆文件里控制一下即可：

  1. -keepclassmembers class * extends android.webkit.WebChromeClient{
  2. public void openFileChooser(...);
  3. }

好了，我们的Webview可以作为应用内的一个部分对外发布了，等等，有5.0以上用户反映用不了？纳尼？？？？

别回心，来看看这第三个坑。

支持5.0

在5.0发布后，Android人家说了，这次我们回调的不是openFileChooser方法，而是onShowFileChooser方法，并且上文提到的ValueCallback参数里包裹着不再是Uri,而是Uri数组，因此我们必须为5.0+的机器做适配，大致思路如下：

  1. webview.setWebChromeClient(new WebChromeClient(){
  2. public void openFileChooser(ValueCallback<Uri> uploadMsg) {
  3. ...
  4. }
  5. public void openFileChooser( ValueCallback uploadMsg, String acceptType ) {
  6. ...
  7. }
  8. public void openFileChooser(ValueCallback<Uri> uploadMsg, String acceptType, String capture){
  9. ...
  10. }
  11. // For Android 5.0+
  12. public boolean onShowFileChooser (WebView webView, ValueCallback<Uri[]> filePathCallback, WebChromeClient.FileChooserParams fileChooserParams) {
  13. mUploadCallbackAboveL = filePathCallback;
  14. Intent i = new Intent(Intent.ACTION_GET_CONTENT);
  15. i.addCategory(Intent.CATEGORY_OPENABLE);
  16. i.setType("*/*");
  17. MainActivity.this.startActivityForResult(
  18. Intent.createChooser(i, "File Browser"),
  19. FILECHOOSER_RESULTCODE);
  20. return true;
  21. }
  22. });
  23. @Override
  24. protected void onActivityResult(int requestCode, int resultCode, Intent data) {
  25. super.onActivityResult(requestCode, resultCode, data);
  26. if(requestCode==FILECHOOSER_RESULTCODE)
  27. {
  28. if (null == mUploadMessage && null == mUploadCallbackAboveL) return;
  29. Uri result = data == null || resultCode != RESULT_OK ? null : data.getData();
  30. if (mUploadCallbackAboveL != null) {
  31. onActivityResultAboveL(requestCode, resultCode, data);
  32. }
  33. else if (mUploadMessage != null) {
  34. mUploadMessage.onReceiveValue(result);
  35. mUploadMessage = null;
  36. }
  37. }
  38. }
  39. @TargetApi(Build.VERSION_CODES.LOLLIPOP)
  40. private void onActivityResultAboveL(int requestCode, int resultCode, Intent data) {
  41. if (requestCode != FILECHOOSER_RESULTCODE
  42. || mUploadCallbackAboveL == null) {
  43. return;
  44. }
  45. Uri[] results = null;
  46. if (resultCode == Activity.RESULT_OK) {
  47. if (data == null) {
  48. } else {
  49. String dataString = data.getDataString();
  50. ClipData clipData = data.getClipData();
  51. if (clipData != null) {
  52. results = new Uri[clipData.getItemCount()];
  53. for (int i = 0; i < clipData.getItemCount(); i++) {
  54. ClipData.Item item = clipData.getItemAt(i);
  55. results[i] = item.getUri();
  56. }
  57. }
  58. if (dataString != null)
  59. results = new Uri[]{Uri.parse(dataString)};
  60. }
  61. }
  62. mUploadCallbackAboveL.onReceiveValue(results);
  63. mUploadCallbackAboveL = null;
  64. return;
  65. }

如上，我们的Webview应该就可以适应5.0+的机器了。

WebView 上传文件 WebChromeClient之openFileChooser函数相关推荐

  1. android 上传html文件大小,浅谈关于Android WebView上传文件的解决方案

    我们在开发需求的时候,难免会接入一下第三方的H5页面,有些H5页面是具有上传照片的功能,Android 中的 WebView是不能直接打开文件选择弹框的 接下来我讲简单提供一下解决方案,先说一下思路 ...

  2. android使用webview上传文件,Android项目中如何在webview页面中上传文件

    Android项目中如何在webview页面中上传文件 发布时间:2020-11-26 15:56:27 来源:亿速云 阅读:68 作者:Leah 本篇文章为大家展示了Android项目中如何在web ...

  3. MIUI(Android)使用Webview上传文件

    由于业务需求,需要在Android APP的Webview中上传图片,默认点击网页上的input file没有反应,在网上搜索后发现了一个可用的版本: android使用WebView来打开文件选择器 ...

  4. vue 上传文件_前后端分离项目，如何优雅实现文件存储！

    在上一节中我们讲到了使用MinIO来自建对象存储服务,这次我们来讲下MinIO如何结合SpringBoot和Vue来实现文件存储. 学前准备 学习本文需要一些MinIO的基础知识,还不了解的小伙伴可以 ...

  5. html中异步上传文件实现示例,HTML_html中异步上传文件实现示例，复制代码代码如下: form actio - phpStudy...

    html中异步上传文件实现示例 复制代码代码如下: 复制代码代码如下: 这是html中最常见最简单的表单提交方式,但是这种方式必须会切换页面,也许有些时候我们希望可以在同一个页面与服务器进行交互,并不 ...

  6. SpringBoot+Vue上传文件

    最近在研究SpringBoot+Vue的文件上传,踩了不少坑.现在将正确的文件上传流程分享一下. 一.前端采用ElementUI组件 前端页面完整代码: <template><el- ...

  7. Angular2使用ng2-file-upload上传文件

    Angular2使用ng2-file-upload上传文件 ng2-file-upload是一个功能比较全面的上传文件的支持库 (参考:http://www.jianshu.com/p/0741186 ...

  8. PHP上传文件函数move_upload,如何使用php中move_uploaded_file函数

    我们平时上传的文件保存在临时文件夹中,例如/ tmp,但临时文件夹的内容在一段时间后会被删除,因此为了将来要使用上传文件,需要将内容保存在不太可能被任意删除的专用目录中,这时就需要使用move_upl ...

  9. php上传文件测试代码,php 文件上传函数的超详细示例

    这篇文章主要为大家详细介绍了php 文件上传函数的超详细示例,具有一定的参考价值,可以用来参考一下. 下面跟随512笔记的小编来举个例子吧. 经测试代码如下: /** * 文件上传 * * 返回的数组 ...

最新文章

  1. spring cloud-zuul的Filter详解
  2. Chkdsk 工具将自动启动时启动的运行 Windows XP Service Pack 2 计算机扫描磁盘
  3. 非常经典的正则表达式
  4. windows10设置开机自启动
  5. python 东哥 with open_python 连接redis cluster
  6. 如何清空android ListView控件的内容
  7. nginx关闭websocket
  8. 磁盘读写流程和网络读写流程
  9. 【HTML＋CSS网页设计与布局 从入门到精通】第10章-CSS
  10. python3.7 安装pip3_安装python3.7 pip3.7 去哪里了？
  11. Tengine新增nginx upstream模块的使用
  12. byteofpython中文gitbook_GitBook 简明教程
  13. Silverlight 密码框 Focus
  14. iPhone 9或于4月3日发布；复制粘贴之父Larry Tesler去世；Android 11开发者预览版来了！| 极客头条...
  15. php smarty 翻译标签,Smarty自定义block标签
  16. QA是干什么的？(职责所在？？？？)
  17. 瑞红淘宝商城旗舰店开张 正式进军B2C市场
  18. 图片如何抠图换背景？怎样将图片抠成透明底图片？
  19. bt ct 计算机辅助翻译,计算机辅助翻译报告
  20. 勾股定理（计算）C++

热门文章

  1. Python filter() 函数
  2. python文件打开方式详解
  3. Windbg调试中遇到的问题
  4. js 判断是不是数字||判断字符串是不是数字(正则表达式)
  5. bzoj1875 边点互换+矩乘
  6. Python中’__main__’模块的作用
  7. 系统信息命令（uname、dmesg、df、hostname、free）
  8. HDU 4857 Couple doubi（找循环节）
  9. 我是买家的前世今生，该到了say goodbye的时候了！
  10. Halcon_灰度直方图和特征直方图的使用