1. 程式人生 > >webview支援H5上傳圖片

webview支援H5上傳圖片

今天H5妹子突然問我是不是遮蔽了他選擇圖片的控制元件,我一臉懵逼,一大堆黑人問號???
上網找了半天資料 原來webview還需要做下處理

  mWebView.setWebChromeClient(new WebChromeClient() {
            // For Android 5.0+
            @Override
            public boolean onShowFileChooser(WebView webView,
                                             ValueCallback<Uri[]> filePathCallback,
                                             FileChooserParams fileChooserParams) {
                mUploadCallbackAboveL = filePathCallback;
                choseSinglePic();
//                take();
return true; } // For Android 3.0+ public void openFileChooser(ValueCallback<Uri> uploadMsg) { mUploadMessage = uploadMsg; choseSinglePic(); } //3.0--版本 public void openFileChooser
(ValueCallback<Uri> uploadMsg, String acceptType) { mUploadMessage = uploadMsg; choseSinglePic(); } // For Android 4.1 public void openFileChooser(ValueCallback<Uri> uploadMsg, String acceptType, String capture) { mUploadMessage = uploadMsg; choseSinglePic(); }

圖片選擇用了第三方庫pictureseletor
onActivityResult的處理

@Override
    public void onActivityResult(int requestCode, int resultCode, Intent data) {
        super.onActivityResult(requestCode, resultCode, data);
        if (requestCode == FILECHOOSER_RESULTCODE) {
            if (null == mUploadMessage && null == mUploadCallbackAboveL) return;
            selectList = PictureSelector.obtainMultipleResult(data);
            Uri result = data == null || resultCode != RESULT_OK ? null : data.getData();
            if (mUploadCallbackAboveL != null) {
                onActivityResultAboveL(requestCode, resultCode, data);
            } else if (mUploadMessage != null) {
                if (result != null) {
                    String path = getPath(getActivity().getApplicationContext(),
                            result);
                    Uri uri = Uri.fromFile(new File(path));
                    mUploadMessage.onReceiveValue(uri);
                } else {
                    mUploadMessage.onReceiveValue(imageUri);
                }
                mUploadMessage = null;


            }
        }
    }

    @SuppressWarnings("null")
    @TargetApi(Build.VERSION_CODES.BASE)
    private void onActivityResultAboveL(int requestCode, int resultCode, Intent data) {
        if (requestCode != FILECHOOSER_RESULTCODE
                || mUploadCallbackAboveL == null) {
            return;
        }

        Uri[] results = null;
        if (data == null) {
            results = new Uri[]{imageUri};
            Log.e("results==null", "results" + results.toString());
        } else {
            selectList = PictureSelector.obtainMultipleResult(data);
            if (selectList != null && selectList.size() > 0) {
                results=new Uri[selectList.size()];
                String path ="";
                for (int i = 0; i < selectList.size(); i++) {
                    LocalMedia localMedia = selectList.get(i);
                    if (localMedia.isCut() && !localMedia.isCompressed()) {
//                    // 裁剪過
                        path = localMedia.getCutPath();
                    } else if (localMedia.isCompressed() || (localMedia.isCut() && localMedia.isCompressed())) {
                        // 壓縮過,或者裁剪同時壓縮過,以最終壓縮過圖片為準
                        path = localMedia.getCompressPath();
                    } else {
                        // 原圖
                        path = localMedia.getPath();
                    }
                    Uri uri = Uri.fromFile(new File(path));
                    results[i]=uri;
                }
            }
            String dataString = data.getDataString();
            ClipData clipData = data.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 (results != null) {
            mUploadCallbackAboveL.onReceiveValue(results);
            mUploadCallbackAboveL = null;
        } else {
            results = new Uri[]{imageUri};
            mUploadCallbackAboveL.onReceiveValue(results);
            mUploadCallbackAboveL = null;
        }

        return;
    }

處理完成就可以選擇圖片

相關推薦

webview支援H5圖片

今天H5妹子突然問我是不是遮蔽了他選擇圖片的控制元件,我一臉懵逼,一大堆黑人問號??? 上網找了半天資料 原來webview還需要做下處理 mWebView.setWebChromeClient(new WebChromeClient() {

angular +H5 圖片 與預覽圖片

scrip reader tex load .sh upd http upload wim //index.html <form class="form-horizontal"> <div class="panel panel-default"&g

H5圖片之canvas

request foo lis idt rap subst splay rim src H5上傳圖片之canvas,使用canvas處理壓縮圖片再上傳 html代碼: <form action="" method="post"> <dl&

小程式巢狀h5圖片遇到的問題

1、一開始使用原生的input type="file"上傳,發現在ios下點選照相機或相簿後直接退出小程式; 2、在微信開發者論壇詢問後確實存在這個問題,於是改用直接呼叫wx.chooseImage()方法; 3、因為要相容ios和android,發現ios下直接使用wx.chooseI

H5圖片壓縮

 解決一些圖片上傳伺服器轉base64過大的問題用到技術canvas HTML程式碼 <input id="file" type="file"> js程式碼  <script type="text/javascript"> var

android利用h5圖片遇到的問題

由於專案需求,需要在一個h5頁面上實現圖片上傳的功能。整個流程是當點選h5然後webview會監聽到這個事件接著在android原生這部分獲取選中圖片並將圖片路徑傳回給h5頁面處理並上傳。監聽這個選擇圖片的監聽是需要去繼承一個WebChromeClient並重寫

js h5 圖片 轉成base64 進行圖片壓縮 不失真

<!doctype html> <html> <head> <meta charset="UTF-8"> <meta name="vie

h5圖片的兩種方法

個人推薦使用formData形式和base64。至於直接用表單上傳,反正我是不用這種的 預覽圖片的方法和base64上傳圖片方法在一起~~~~ 上傳方法1.ajax用formData物件上傳 介紹一下formData:FormData物件把資料編譯成鍵值對的形式,用

Android WebView 支援H5圖片

webview 在android的元件webview中是不能用H5上傳檔案了的。但是有時候我們需要用H5去呼叫上傳檔案,因此需要支援這項功能。 程式碼示例 有不同的額版本適配方法 3.0 4.0 5.0 6.0 public class Pla

webview支援H5開啟並圖片

mWebView.setWebChromeClient(new WebChromeClient() { // For Android 5.0+ @Override public boolean onSho

WebView 支援圖片

今天公司突然上傳了一個網頁有上傳圖片功能,但是WebView沒有支援,沒辦法只能再寫些程式碼。然後就ok了,效果如下圖所示: 實現關鍵程式碼如下所示: @SuppressLint("NewApi") private void initmWebView() {

Android WebView圖片(base64)到H5(JS)

最近專案需求是H5呼叫安卓的方法選擇圖片或者開啟照相機拍照,然後傳給H5顯示圖片,最後由H5上傳到伺服器。查了一下資料,大概有以下幾種方法: 利用WebChromeClient的openFileChooser(5.0+是onShowFileChooser)

Android開發筆記(一百五十二)H5通過WebView圖片

上一篇文章介紹了WebView與JS之間的資料互動,其實就是把字串傳來傳去,這對文字格式的資訊傳輸來說倒還湊合,倘若要傳輸圖片資訊就不管用了。所以,要想讓h5網頁支援從手機上傳圖片,還得另外想辦法,當然各版本的Android系統也都提供了相應的解決辦法。在Android 4.

移動端通過ajax圖片(文件)並在前臺展示——通過H5的FormData對象

com 地址 ces 文件 只需要 capture val data als 前些時候遇到移動端需要上傳圖片和視頻的問題,之前一直通過ajax異步的提交數據,所以在尋找通過ajax上傳文件的方法。發現了H5裏新增了一個FormData對象,通過這個對象可以直接綁定html中

微信小程式 圖片至阿里雲OSS(支援圖片

我們先講下為什麼要把圖片檔案上傳到雲伺服器呢, 有什麼好處呢? 1、能減輕我們自己伺服器的頻寬 如果一個程式裡有多處地方用到使用者上傳圖片等功能的話,建議還是放到阿里雲或者千牛雲等其他平臺上來儲存我們的圖片,可以給公司的伺服器減少很多壓力,磁碟儲存也就不會太大 2、提升使用者體驗感

部分vivo和oppo手機,使用圖片功能,可能會出現退出webview的現象(回退到app的入口頁面)

在公司的app裡面嵌入了一個h5頁面,h5頁面有個使用圖片上傳功能,上傳圖片出現閃退的現象  問題描述: vivo手機,在app內的wap頁面使用上傳圖片的功能,在選擇好圖片點選確認按鈕後,出現退出整個webview,回退到app該wap頁面的入口頁面,且app自動重新整理了該入口頁面

WebView中拍照或從相簿圖片

WebView 上傳圖片, 想必很多人都碰到過這樣的場景. 而且 WebView 在4.4前後的區別非常大, 比如對URL跳轉的格式, 對JS的注入宣告等等, 4.4以後的WebView 已經是chromium核心, 有多強大就無需我贅述. 說這些, 其實也是

HTML5 CSS3 經典案例:無外掛拖拽圖片支援預覽與批量) (一)

上傳基本是專案中經常出現的,一般採用:1、form提交 2、flash3、html5form提交會重新整理頁面,很難做到非同步上傳;flash可能是用得比較多了,因為可以兼顧到幾乎所有的瀏覽器,我之前一直會用jquery的uploadify作為專案中的上傳工具,uploadi

vue圖片元件(支援拖拽資料夾

1.獲取拖拽上傳物件 drop(el) { el.stopPropagation(); el.preventDefault(); this.fileList(el.dataTransfer

Android H5拍照或選擇圖片+WebApi服務端儲存檔案

H5拍照+H5選照片 <em id="clock_imgs"></em><a href="javascript:captureImage();">選擇圖片</a> <button type="button" id="submit" >