淺談關於Android WebView上傳文件的解決方案

分類:IT技術 時間:2017-09-27

我們在開發需求的時候,難免會接入一下第三方的H5頁面,有些H5頁面是具有上傳照片的功能,android 中的 WebView是不能直接打開文件選擇彈框的

接下來我講簡單提供一下解決方案,先說一下思路

1.接收WebView打開文件選擇器的通知

2.收到通知後,打開文件選擇器等待用戶選擇需要上傳的文件

3.在onActivityResult中得到用戶選擇的文件的Uri

4.然後把Uri傳遞給Html5

這樣就完成了一次H5選擇文件的過程,下面我把代碼貼出來自習看一下

首先,WebView必須要支持JS交互,所以要打開JS交互

mWebView.getSettings().setJavaScriptEnabled(true);

當H5在調用上傳文件的Api的時候,WebView會回調 openFileChooser和onShowFileChooser 方法來通知我們,我們這個時候要做的就是重寫這個方法

需要註意的是這個方法在不同的Api上會回調不同行參方法

mWebView.setWebchromeClient(new WebChromeClient() {


   @Override
   public void onProgressChanged(WebView view, int newProgress) {
    if (newProgress == 100) {
     mBar.setVisibility(View.GONE);
    } else {
     mBar.setVisibility(View.VISIBLE);
     mBar.setProgress(newProgress);
    }
    super.onProgressChanged(view, newProgress);
   }

   //For Android API < 11 (3.0 OS)
   public void openFileChooser(ValueCallback<Uri> valueCallback) {
    uploadmessage = valueCallback;
    openImageChooserActivity();
   }

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

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

  }); 

我們在openFileChooser方法中先保存了一下ValueCallback的回調對象,這個對象最後用來通知H5文件地址,我們之後在調用openFileChooser方法來打開文件選擇器

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方法,我們重寫並等待回調

@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 =http://www.jb51.net/article/= 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;
 } 

onActivityResult就是用來通知H5用戶選擇的文件地址,在這個方法裏,用我們之前保存的ValueCallback對象,調用onReceiveValue方法,H5就可以收到我們傳遞給它的地址信息了!

以上就是本文的全部內容,希望對大家的學習有所幫助,也希望大家多多支持電腦玩物。


Tags: 文件 WebView 選擇 newProgress 打開 上傳

文章來源:


ads
ads

相關文章
ads

相關文章

ad