Android webview與js互動上傳圖片
阿新 • • 發佈:2019-01-10
最近專案中用到webview,並且有上傳圖片功能,iOS不用做任何處理,但Android就不行了,調不到相簿,後百度才知道這是Android webview的侷限性,需要自己擴充套件WebChromeClient來實現,話不多說直接上程式碼:
第一步:擴充套件WebChromeClient
第二步:呼叫webview的activity中實現import android.app.Activity; import android.content.Intent; import android.net.Uri; import android.webkit.ValueCallback; import android.webkit.WebChromeClient; import android.webkit.WebView; 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<Uri> 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; } }
@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 = getPhotoPathByLocalUri(ReginActivity.this, 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 = getPhotoPathByLocalUri(ReginActivity.this, 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; } }
/** <span style="white-space:pre"> </span> * 獲取從本地相簿返回來的時候的URI解析出來的檔案路徑 <span style="white-space:pre"> </span> * <span style="white-space:pre"> </span> * @return <span style="white-space:pre"> </span> */ <span style="white-space:pre"> </span>public static String getPhotoPathByLocalUri(Context context, <span style="white-space:pre"> </span>Uri selectedImage) { <span style="white-space:pre"> </span>// Uri selectedImage = data.getData(); <span style="white-space:pre"> </span>String[] filePathColumn = { MediaStore.Images.Media.DATA }; <span style="white-space:pre"> </span>Cursor cursor = context.getContentResolver().query(selectedImage, <span style="white-space:pre"> </span>filePathColumn, null, null, null); <span style="white-space:pre"> </span>cursor.moveToFirst(); <span style="white-space:pre"> </span>int columnIndex = cursor.getColumnIndex(filePathColumn[0]); <span style="white-space:pre"> </span>String picturePath = cursor.getString(columnIndex); <span style="white-space:pre"> </span>cursor.close(); <span style="white-space:pre"> </span>return picturePath; <span style="white-space:pre"> </span>}
第三步:webview設定setWebChromeClient
/**
* 以下是webview的照片上傳時候,用於在網頁開啟android相簿檔案
*/
public OpenFileWebChromeClient mOpenFileWebChromeClient = new OpenFileWebChromeClient(
this);
mLJWebView.setWebChromeClient(mOpenFileWebChromeClient);
希望能對你有所幫助,謝謝!