全网整合营销服务商

电脑端+手机端+微信端=数据同步管理

免费咨询热线:400-708-3566

Android WebView那些坑之上传文件示例

最近公司项目需要在WebView上调用手机系统相册来上传图片,开发过程中发现在很多机器上无法正常唤起系统相册来选择图片。

解决问题之前我们先来说说WebView上传文件的逻辑:当我们在Web页面上点击选择文件的控件(<input type="file">)时,会回调WebChromeClient下的openFileChooser()(5.0及以上系统回调onShowFileChooser())。这个时候我们在openFileChooser方法中通过Intent打开系统相册或者支持该Intent的第三方应用来选择图片。like this:

public void openFileChooser(ValueCallback<Uri> valueCallback, String acceptType, String capture) {
 uploadMessage = valueCallback;
  openImageChooserActivity();
}

private void openImageChooserActivity() {
 Intent i = new Intent(Intent.ACTION_GET_CONTENT);
 i.addCategory(Intent.CATEGORY_OPENABLE);
 i.setType("image/*");
 startActivityForResult(Intent.createChooser(i, 
    "Image Chooser"), FILE_CHOOSER_RESULT_CODE);
}

最后我们在onActivityResult()中将选择的图片内容通过ValueCallback的onReceiveValue方法返回给WebView,然后通过js上传。代码如下:

@Override
protected void onActivityResult(int requestCode, int resultCode, Intent data) {
 super.onActivityResult(requestCode, resultCode, data);
 if (requestCode == FILE_CHOOSER_RESULT_CODE) {
  Uri result = data == null || resultCode != RESULT_OK ? null : data.getData();
  if (uploadMessage != null) {
   uploadMessage.onReceiveValue(result);
   uploadMessage = null;
  }
 }
}

PS:ValueCallbacks是WebView组件通过openFileChooser()或者onShowFileChooser()提供给我们的,它里面包含了一个或者一组Uri,然后我们在onActivityResult()里将Uri传给ValueCallbacks的onReceiveValue()方法,这样WebView就知道我们选择了什么文件。

webview.setWebChromeClient(new WebChromeClient() {

  // For Android < 3.0
  public void openFileChooser(ValueCallback<Uri> valueCallback) {
   ***
  }

  // For Android >= 3.0
  public void openFileChooser(ValueCallback valueCallback, String acceptType) {
   ***
  }

  //For Android >= 4.1
  public void openFileChooser(ValueCallback<Uri> valueCallback, 
    String acceptType, String capture) {
   ***
  }

  // For Android >= 5.0
  @Override
  public boolean onShowFileChooser(WebView webView, 
    ValueCallback<Uri[]> filePathCallback, 
    WebChromeClient.FileChooserParams fileChooserParams) {
   ***
   return true;
  }
 });

到这里你可能要问了,说了这么多还是没解释为什么在很多机型上无法唤起系统相册或者第三方app来选择图片啊?!这是因为为了最求完美的Google攻城狮们对openFileChooser做了多次修改,在5.0上更是将回调方法该为了onShowFileChooser。所以为了解决这一问题,兼容各个版本,我们需要对openFileChooser()进行重载,同时针对5.0及以上系统提供onShowFileChooser()方法:

webview.setWebChromeClient(new WebChromeClient() {

  // For Android < 3.0
  public void openFileChooser(ValueCallback<Uri> valueCallback) {
   ***
  }

  // For Android >= 3.0
  public void openFileChooser(ValueCallback valueCallback, String acceptType) {
   ***
  }

  //For Android >= 4.1
  public void openFileChooser(ValueCallback<Uri> valueCallback, 
    String acceptType, String capture) {
   ***
  }

  // For Android >= 5.0
  @Override
  public boolean onShowFileChooser(WebView webView, 
    ValueCallback<Uri[]> filePathCallback, 
    WebChromeClient.FileChooserParams fileChooserParams) {
   ***
   return true;
  }
 });

大家应该注意到onShowFileChooser()中的ValueCallback包含了一组Uri(Uri[]),所以针对5.0及以上系统,我们还需要对onActivityResult()做一点点处理。这里不做描述,最后我再贴上完整代码。

当处理完这些后你以为就万事大吉了?!当初我也这样天真,但当我们打好release包测试的时候却又发现没法选择图片了!!!真是坑了个爹啊!!!无奈去翻WebChromeClient的源码,发现openFileChooser()是系统API,我们的release包是开启了混淆的,所以在打包的时候混淆了openFileChooser(),这就导致无法回调openFileChooser()了。

/**
 * Tell the client to open a file chooser.
 * @param uploadFile A ValueCallback to set the URI of the file to upload.
 *  onReceiveValue must be called to wake up the thread.a
 * @param acceptType The value of the 'accept' attribute of the input tag
 *   associated with this file picker.
 * @param capture The value of the 'capture' attribute of the input tag
 *   associated with this file picker.
 *
 * @deprecated Use {@link #showFileChooser} instead.
 * @hide This method was not published in any SDK version.
 */
@SystemApi
@Deprecated
public void openFileChooser(ValueCallback<Uri> uploadFile, String acceptType, String capture) {
 uploadFile.onReceiveValue(null);
}

解决方案也很简单,直接不混淆openFileChooser()就好了。

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

支持关于上传文件的所有坑都填完了,最后附上完整源码:

public class MainActivity extends AppCompatActivity {

 private ValueCallback<Uri> uploadMessage;
 private ValueCallback<Uri[]> uploadMessageAboveL;
 private final static int FILE_CHOOSER_RESULT_CODE = 10000;

 @Override
 protected void onCreate(Bundle savedInstanceState) {
  super.onCreate(savedInstanceState);
  setContentView(R.layout.activity_main);

  WebView webview = (WebView) findViewById(R.id.web_view);
  assert webview != null;
  WebSettings settings = webview.getSettings();
  settings.setUseWideViewPort(true);
  settings.setLoadWithOverviewMode(true);
  settings.setJavaScriptEnabled(true);
  webview.setWebChromeClient(new WebChromeClient() {

   // For Android < 3.0
   public void openFileChooser(ValueCallback<Uri> valueCallback) {
    uploadMessage = valueCallback;
    openImageChooserActivity();
   }

   // For Android >= 3.0
   public void openFileChooser(ValueCallback valueCallback, String acceptType) {
    uploadMessage = valueCallback;
    openImageChooserActivity();
   }

   //For Android >= 4.1
   public void openFileChooser(ValueCallback<Uri> valueCallback, String acceptType, String capture) {
    uploadMessage = valueCallback;
    openImageChooserActivity();
   }

   // For Android >= 5.0
   @Override
   public boolean onShowFileChooser(WebView webView, ValueCallback<Uri[]> filePathCallback, WebChromeClient.FileChooserParams fileChooserParams) {
    uploadMessageAboveL = filePathCallback;
    openImageChooserActivity();
    return true;
   }
  });
  String targetUrl = "file:///android_asset/up.html";
  webview.loadUrl(targetUrl);
 }

 private void openImageChooserActivity() {
  Intent i = new Intent(Intent.ACTION_GET_CONTENT);
  i.addCategory(Intent.CATEGORY_OPENABLE);
  i.setType("image/*");
  startActivityForResult(Intent.createChooser(i, "Image Chooser"), FILE_CHOOSER_RESULT_CODE);
 }

 @Override
 protected void onActivityResult(int requestCode, int resultCode, Intent data) {
  super.onActivityResult(requestCode, resultCode, data);
  if (requestCode == FILE_CHOOSER_RESULT_CODE) {
   if (null == uploadMessage && null == uploadMessageAboveL) return;
   Uri result = data == null || resultCode != RESULT_OK ? null : data.getData();
   if (uploadMessageAboveL != null) {
    onActivityResultAboveL(requestCode, resultCode, data);
   } else if (uploadMessage != null) {
    uploadMessage.onReceiveValue(result);
    uploadMessage = null;
   }
  }
 }

 @TargetApi(Build.VERSION_CODES.LOLLIPOP)
 private void onActivityResultAboveL(int requestCode, int resultCode, Intent intent) {
  if (requestCode != FILE_CHOOSER_RESULT_CODE || uploadMessageAboveL == null)
   return;
  Uri[] results = null;
  if (resultCode == Activity.RESULT_OK) {
   if (intent != null) {
    String dataString = intent.getDataString();
    ClipData clipData = intent.getClipData();
    if (clipData != null) {
     results = new Uri[clipData.getItemCount()];
     for (int i = 0; i < clipData.getItemCount(); i++) {
      ClipData.Item item = clipData.getItemAt(i);
      results[i] = item.getUri();
     }
    }
    if (dataString != null)
     results = new Uri[]{Uri.parse(dataString)};
   }
  }
  uploadMessageAboveL.onReceiveValue(results);
  uploadMessageAboveL = null;
 }
}

源码地址: http://xiazai./201701/yuanma/WebViewSample_jb51.rar

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。


# android  # webview  #   # 上传  # Android WebView使用的技巧与一些坑  # Android中WebView的基本配置与填坑记录大全  # Android中webview使用的一些坑  # 回调  # 第三方  # 上传文件  # 我也  # 这一  # 包含了  # 说了  # 万事大吉  # 这么多  # 给我们  # 这就  # 也很  # 却又  # 注意到  # 我再  # 这个时候  # 解决问题  # 不做  # 要对  # 当我们 


相关文章: c# 在高并发下使用反射发射(Reflection.Emit)的性能  建站之星CMS五站合一模板配置与SEO优化指南  导航网站建站方案与优化指南:一站式高效搭建技巧解析  如何通过商城自助建站源码实现零基础高效建站?  南宁网站建设制作定制,南宁网站建设可以定制吗?  如何使用Golang table-driven基准测试_多组数据测量函数效率  如何在Golang中引入测试模块_Golang测试包导入与使用实践  智能起名网站制作软件有哪些,制作logo的软件?  如何规划企业建站流程的关键步骤?  广州营销型建站服务商推荐:技术优势与SEO优化解析  如何高效搭建专业期货交易平台网站?  如何在阿里云购买域名并搭建网站?  行程制作网站有哪些,第三方机票电子行程单怎么开?  家庭服务器如何搭建个人网站?  湖州网站制作公司有哪些,浙江中蓝新能源公司官网?  如何配置支付宝与微信支付功能?  如何快速搭建高效香港服务器网站?  定制建站如何定义?其核心优势是什么?  网站制作服务平台,有什么网站可以发布本地服务信息?  实例解析Array和String方法  网站专业制作公司,网站编辑是做什么的?好做吗?工作前景如何?  公司门户网站制作公司有哪些,怎样使用wordpress制作一个企业网站?  东莞专业制作网站的公司,东莞大学生网的网址是什么?  建站之星导航配置指南:自助建站与SEO优化全解析  济南网站制作的价格,历城一职专官方网站?  rsync同步时出现rsync: failed to set times on “xxxx”: Operation not permitted  如何挑选高效建站主机与优质域名?  如何在香港免费服务器上快速搭建网站?  建站之星代理如何优化在线客服效率?  网站海报制作教学视频教程,有什么免费的高清可商用图片网站,用于海报设计?  黑客如何通过漏洞一步步攻陷网站服务器?  如何在香港服务器上快速搭建免备案网站?  如何在云主机上快速搭建多站点网站?  如何在自有机房高效搭建专业网站?  建站VPS能否同时实现高效与安全翻墙?  c++怎么用jemalloc c++替换默认内存分配器【性能】  如何通过万网虚拟主机快速搭建网站?  网站设计制作书签怎么做,怎样将网页添加到书签/主页书签/桌面?  网站企业制作流程,用什么语言做企业网站比较好?  c# Task.ConfigureAwait(true) 在什么场景下是必须的  建站主机SSH密钥生成步骤及常见问题解答?  如何快速查询网址的建站时间与历史轨迹?  临沂网站制作企业,临沂第三中学官方网站?  网站制作软件免费下载安装,有哪些免费下载的软件网站?  外贸公司网站制作哪家好,maersk船公司官网?  高防服务器租用指南:配置选择与快速部署攻略  如何获取上海专业网站定制建站电话?  如何快速搭建安全的FTP站点?  网站制作公司排行榜,抖音怎样做个人官方网站  建站之星如何开启自定义404页面避免用户流失? 

您的项目需求

*请认真填写需求信息,我们会在24小时内与您取得联系。