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

時間 2019-11-12

標籤關於 android webview 上傳文件解決方案欄目 Android 简体版

原文原文鏈接

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

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

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

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

3.在onActivityResult中獲得用戶選擇的文件的Uricode

4.而後把Uri傳遞給Html5對象

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

首先，WebView必需要支持JS交互，因此要打開JS交互ip

mWebView.getSettings().setJavaScriptEnabled(true);

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

須要注意的是這個方法在不一樣的Api上會回調不一樣行參方法get

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 == 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;
    }