webview 嵌入H5网页支持 拍照、录像、文件选择等功能

小明 2025-04-27 21:33:43 5

前言

在���常开发中，app中经常有嵌入前端网页的需求，里面如果有一些调用相机拍照、录视频、查看本地图片功能时，需要Android WebView端做一些配置、来保证能顺利调起相应的Intent，来适配前端程序

（）

需求一：webView端调用相机拍照，同时回传给前端程序

{
        webView.setWebChromeClient(new WebChromeClient(){
            @TargetApi(Build.VERSION_CODES.LOLLIPOP)
            @Override
            public boolean onShowFileChooser(WebView webView, ValueCallback filePathCallback, FileChooserParams fileChooserParams) {
                Log.e(TAG,"onShowFileChooser fileChooserParams:"+fileChooserParams.getAcceptTypes()[0]);
                mUploadCallbackAboveL = filePathCallback;//数据回传会用到，记录成全局
                WebViewTestUI.this.fileChooserParams=fileChooserParams;
                if (fileChooserParams != null) {
                    //最终通过fileChooserParams.isCaptureEnabled()方法来解决你的困惑 官方解释是否为设备
                    if (fileChooserParams.isCaptureEnabled()) {
                        //所以这里写调用相机逻辑
                        if (ContextCompat.checkSelfPermission(WebViewTestUI.this, android.Manifest.permission.CAMERA) != PackageManager.PERMISSION_GRANTED) {
                            // If camera permission is not granted, request it
                            ActivityCompat.requestPermissions(WebViewTestUI.this, new String[]{android.Manifest.permission.CAMERA}, CAMERA_PERMISSION_REQUEST);
                        } else {
                            // Camera permission is already granted, launch camera
                            takePhoto();
                        }
                  }
                  return true;
            }
        });
}
    private void takePhoto() {
        String filePath = Environment.getExternalStorageDirectory() + File.separator
                + File.separator
                + Environment.DIRECTORY_PICTURES + File.separator;
        String fileName = "IMG_" + DateFormat.format("yyyyMMdd_hhmmss", Calendar.getInstance(Locale.CHINA)) + ".jpg";
        imageUri = Uri.fromFile(new File(filePath + fileName));
        //相册相机选择窗
        Intent captureIntent = new Intent(MediaStore.ACTION_IMAGE_CAPTURE);
        if(captureIntent.resolveActivity(getPackageManager()) != null){
            captureIntent.putExtra(MediaStore.EXTRA_OUTPUT, imageUri);
            startActivityForResult(captureIntent, 2);
        }
    }
//Intent的回调
   @Override
    protected void onActivityResult(int requestCode, int resultCode, Intent data) {
        super.onActivityResult(requestCode,resultCode,data);
        if (Build.VERSION.SDK_INT >= 21) {
            chooseAbove(resultCode, data);
        }
    }
  public void chooseAbove(int resultCode, Intent data) {
        Log.e("Base", "调用方法  chooseAbove   " +data+" resultCode:"+resultCode);
        if (Activity.RESULT_OK == resultCode) {
            updatePhotos();
            if (data != null) {
                // 这里是针对从文件中选图片的处理
                Uri[] results;
                Uri uriData = data.getData();
                Log.e("Base", "uriData：" + uriData);
                if (uriData != null) {
                    results = new Uri[]{uriData};
                    for (Uri uri : results) {
                        Log.e("Base", "系统里取到的图片：" + uri.toString());
                    }
                    mUploadCallbackAboveL.onReceiveValue(results);//回传给前端
                } else {
                    mUploadCallbackAboveL.onReceiveValue(null);
                }
            } else {
                Log.e("Base", "自己命名的图片：" + imageUri.toString());
                mUploadCallbackAboveL.onReceiveValue(new Uri[]{imageUri});
            }
        } else {
            mUploadCallbackAboveL.onReceiveValue(null);
        }
        mUploadCallbackAboveL = null;
    }

以上代码的图片未经过压缩、可以设置相机分辨率、或者教由前端处理

（）

需求二:拍摄视频

{
//根据参数
   if(fileChooserParams.getAcceptTypes()[0].equals("video/*")){
                    if (ContextCompat.checkSelfPermission(WebViewTestUI.this, android.Manifest.permission.CAMERA) != PackageManager.PERMISSION_GRANTED) {
                        // If camera permission is not granted, request it
                        ActivityCompat.requestPermissions(WebViewTestUI.this, new String[]{android.Manifest.permission.CAMERA}, CAMERA_PERMISSION_VIDEOREQUEST);
                    } else {
                        // Camera permission is already granted, launch camera
                        takeVideo();
                    }
                    return true;
                }
}
    private void takeVideo() {
        //相册相机选择窗
        Intent captureIntent = new Intent(MediaStore.ACTION_VIDEO_CAPTURE);
        startActivityForResult(captureIntent, 1);
    }

需求三：选择文件

也是根据入参类型做不同处理、同时注意存储权限问题

总结

以上内容可以通过查资料或者chatgpt或者百度来查看，自己记录下，方便以后查看

The End

标签：

微信