1. 程式人生 > >android利用h5上傳圖片遇到的問題

android利用h5上傳圖片遇到的問題

由於專案需求,需要在一個h5頁面上實現圖片上傳的功能。整個流程是當點選h5然後webview會監聽到這個事件接著在android原生這部分獲取選中圖片並將圖片路徑傳回給h5頁面處理並上傳。監聽這個選擇圖片的監聽是需要去繼承一個WebChromeClient並重寫它裡面的方法(webview初始化時需要webView.setWebChromeClient(new MyWebClient()) 這樣監聽才會發生),因為由於各個系統版本webview的差異是需要重寫多個方法才能適配不同的系統版本的手機,程式碼如下:

private class MyWebClient extends WebChromeClient {
    // For Android 5.0+
    //接受一個uris[]
    @Override
    public boolean onShowFileChooser(WebView webView, ValueCallback<Uri[]> valueCallback
                                                    , FileChooserParams fileChooserParams) {
        LuheLogUtils.LogI("LuheGoodsShowActivity", "openFileChooser--5.0+");
        mValueCallback = valueCallback;
        goToPhotos();
        return true;
    }

    // For Android 3.0+
    //只能單獨傳一個uri
    public void openFileChooser(ValueCallback uploadMsg) {
        LuheLogUtils.LogI("LuheGoodsShowActivity", "openFileChooser--3.0+");
        mValueCallbackSingle = uploadMsg;
        goToPhotos();
    }

    //3.0--版本
    public void openFileChooser(ValueCallback uploadMsg, String acceptType) {
        LuheLogUtils.LogI("LuheGoodsShowActivity", "openFileChooser--3.0");
        openFileChooser(uploadMsg);
    }

    // For Android 4.1
    public void openFileChooser(ValueCallback uploadMsg, String acceptType, String capture) {
        LuheLogUtils.LogI("LuheGoodsShowActivity", "openFileChooser--4.1");
        openFileChooser(uploadMsg);
    }

    @Override
    public void onProgressChanged(WebView view, int newProgress) {
        LuheLogUtils.LogI("LuheGoodsShowActivity", "newProgress--newProgress--"+newProgress);
        super.onProgressChanged(view, newProgress);
    }

    @Override
    public void onReceivedTitle(WebView view, String title) {
        LuheLogUtils.LogI("LuheGoodsShowActivity", "onReceivedTitle--title--" + title);
        super.onReceivedTitle(view, title);
    }
}

從程式碼中開出每次監聽都會返回一個valueCallback物件,而這個物件是負責將我們獲取到的圖片路徑傳給h5頁面 mValueCallback.onReceiveValue(uris);
但是這裡有個問題需要注意的是如果打一次觸發了監聽返回mValueCallback沒有呼叫onReceiveValue方法,下一次點選時就不會再次觸發監聽了,所以會造成無論怎麼點都沒有反應這種情況,為了解決這個問題需要在沒有選中圖片路徑的情況下mValueCallback.onReceiveValue(null)傳一個空值,這樣就不會在出現沒有選中圖片後,下次點選沒有反應的情況了。
最後 webview的坑很多,開發的時候要多加註意。