继续浏览精彩内容
慕课网APP
程序员的梦工厂
打开
继续
感谢您的支持,我会继续努力的
赞赏金额会直接到老师账户
将二维码发送给自己后长按识别
微信支付
支付宝支付

WebView 选择相册图片踩坑

潇湘沐
关注TA
已关注
手记 104
粉丝 12
获赞 38

  最近在为公司的几个H5项目做app打包,然后就踩到这个坑了。

项目中有 h5调用相册选择图片,然后上传这个功能,测试说上传不了图片。然后搜了不少资料,折腾了一下午,终于搞好了,特此记录下。

1

原生WebView 的选择文件功能需要我们自己实现,代码如下:

[代码]java代码:

?

01

02

03

04

05

06

07

08

09

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

wv_main.setWebChromeClient(new WebChromeClient() {

            //   Andorid 4.1----4.4

            public void openFileChooser(ValueCallback<uri> uploadFile, String   acceptType, String capture) {

 

                mFilePathCallback   = uploadFile;

                handle(uploadFile);

            }

 

            //   for 5.0+

            @Override

            public boolean onShowFileChooser(WebView webView, ValueCallback<uri[]>   filePathCallback, FileChooserParams fileChooserParams) {

                if (mFilePathCallbackArray != null) {

                    mFilePathCallbackArray.onReceiveValue(null);

                }

                mFilePathCallbackArray   = filePathCallback;

                handleup(filePathCallback);

                return true;

            }

 

 

        });

    }

 

    private void handle(ValueCallback<uri> uploadFile) {

        Intent   intent = new Intent(Intent.ACTION_PICK);

        intent.setType("image/*");

        startActivityForResult(intent,   PICK_REQUEST);

    }

 

    private void handleup(ValueCallback<uri[]> uploadFile) {

 

        Intent   intent = new Intent(Intent.ACTION_PICK);

        intent.setType("image/*");

        startActivityForResult(intent,   PICK_REQUEST);

    }

</uri[]></uri></uri[]></uri>

 

然后在Activity的onActivityResult 方法里处理回调,代码如下:

[代码]java代码:

?

01

02

03

04

05

06

07

08

09

10

11

12

13

14

15

16

17

18

19

@Override

   protected void onActivityResult(int requestCode, int resultCode, Intent data) {

       super.onActivityResult(requestCode,   resultCode, data);

 

       if (requestCode == PICK_REQUEST) {

           if (null != data) {

               Uri   uri = data.getData();

               handleCallback(uri);

           }   else {

               //   取消了照片选取的时候调用

               handleCallback(null);

           }

       }   else {

           //   取消了照片选取的时候调用

           handleCallback(null);

       }

 

 

   }

[代码]java代码:

?

01

02

03

04

05

06

07

08

09

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

/**

     * 处理WebView的回调

     *

     * @param   uri

     */

    private void handleCallback(Uri uri) {

        if (Build.VERSION.SDK_INT >=   Build.VERSION_CODES.LOLLIPOP) {

            if (mFilePathCallbackArray != null) {

                if (uri != null) {

                    mFilePathCallbackArray.onReceiveValue(new Uri[]{uri});

                }   else {

                    mFilePathCallbackArray.onReceiveValue(null);

                }

                mFilePathCallbackArray   = null;

            }

        }   else {

            if (mFilePathCallback != null) {

                if (uri != null) {

                    String   url = getFilePathFromContentUri(uri, getContentResolver());

                    Uri   u = Uri.fromFile(new File(url));

 

                    mFilePathCallback.onReceiveValue(u);

                }   else {

                    mFilePathCallback.onReceiveValue(null);

                }

                mFilePathCallback   = null;

            }

        }

    }

 

 

2:记得一定要释放,不然点取消之后,就再调不起来了(一下午主要就填这个坑了)

[代码]java代码:

?

1

2

3

4

4.1-4.4

 mFilePathCallback.onReceiveValue(null);

5.0

mFilePathCallbackArray.onReceiveValue(null);

 

34.4以下,返回的Uri content: 开头的,h5端识别不了,需要转成绝对路径

[代码]java代码:

?

01

02

03

04

05

06

07

08

09

10

11

12

13

14

15

16

public static String   getFilePathFromContentUri(Uri selectedVideoUri,

                                                   ContentResolver   contentResolver) {

        String   filePath;

        String[]   filePathColumn = {MediaStore.MediaColumns.DATA};

 

        Cursor   cursor = contentResolver.query(selectedVideoUri, filePathColumn, null, null, null);

//      也可用下面的方法拿到cursor

//      Cursor   cursor = this.context.managedQuery(selectedVideoUri, filePathColumn, null,   null, null);

 

        cursor.moveToFirst();

 

        int columnIndex =   cursor.getColumnIndex(filePathColumn[0]);

        filePath   = cursor.getString(columnIndex);

        cursor.close();

        return filePath;

    }

 

你的认可,是我坚持更新博客的动力,如果觉得有用,就请点个赞,谢谢

原文链接:http://www.apkbus.com/blog-625356-63121.html

打开App,阅读手记
0人推荐
发表评论
随时随地看视频慕课网APP