如何在 Webview 中调用设备相机？

在 Webview 中调用设备相机通常涉及到一些 Web 技术和原生应用开发知识。以下是一个概要步骤，将介绍如何在不同平台上的 Webview 中调用相机：

Android Webview

在 Android 平台上，你可以使用 WebChromeClient 类和重写 onShowFileChooser 方法来处理 HTML 输入元素 <input type="file"> 触发的相机调用。

1. 权限 - 首先确保在 AndroidManifest.xml 文件中添加了必要的权限：

xml
<uses-permission android:name="android.permission.CAMERA" />
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />

1. WebChromeClient 设置 - 接下来，为你的 Webview 设置一个 WebChromeClient，并重写 onShowFileChooser 方法：

java
webView.setWebChromeClient(new WebChromeClient() {
    // For Android 5.0+
    @Override
    public boolean onShowFileChooser(WebView webView, ValueCallback<Uri[]> filePathCallback, FileChooserParams fileChooserParams) {
        // 确保没有其他文件选择回调正在进行
        if (mFilePathCallback != null) {
            mFilePathCallback.onReceiveValue(null);
        }
        mFilePathCallback = filePathCallback;

        // 创建 Intent 来开启相机应用
        Intent takePictureIntent = new Intent(MediaStore.ACTION_IMAGE_CAPTURE);
        if (takePictureIntent.resolveActivity(getPackageManager()) != null) {
            // 指定临时文件存放照片
            File photoFile = null;
            try {
                photoFile = createImageFile();
                takePictureIntent.putExtra("PhotoPath", mCameraPhotoPath);
            } catch (IOException ex) {
                // 错误处理
            }

            if (photoFile != null) {
                mCameraPhotoPath = "file:" + photoFile.getAbsolutePath();
                takePictureIntent.putExtra(MediaStore.EXTRA_OUTPUT, Uri.fromFile(photoFile));
            } else {
                takePictureIntent = null;
            }
        }

        // 创建选择器，包括相机选项和文件选择器
        Intent contentSelectionIntent = new Intent(Intent.ACTION_GET_CONTENT);
        contentSelectionIntent.addCategory(Intent.CATEGORY_OPENABLE);
        contentSelectionIntent.setType("image/*");

        Intent[] intentArray;
        if (takePictureIntent != null) {
            intentArray = new Intent[]{takePictureIntent};
        } else {
            intentArray = new Intent[0];
        }

        Intent chooserIntent = new Intent(Intent.ACTION_CHOOSER);
        chooserIntent.putExtra(Intent.EXTRA_INTENT, contentSelectionIntent);
        chooserIntent.putExtra(Intent.EXTRA_TITLE, "Image Chooser");
        chooserIntent.putExtra(Intent.EXTRA_INITIAL_INTENTS, intentArray);

        // 启动选择器并等待结果
        startActivityForResult(chooserIntent, INPUT_FILE_REQUEST_CODE);

        return true;
    }
});

1. 处理 Activity 结果 - 在你的 Activity 的 onActivityResult 方法中处理返回的相机数据：

java
@Override
protected void onActivityResult(int requestCode, int resultCode, Intent data) {
    if (requestCode == INPUT_FILE_REQUEST_CODE && resultCode == Activity.RESULT_OK) {
        if (null == mFilePathCallback) {
            return;
        }
        Uri[] results = null;

        // 检查是否有数据，如果没有，检查我们的相机临时文件。
        if (data == null || data.getData() == null) {
            if (mCameraPhotoPath != null) {
                results = new Uri[]{Uri.parse(mCameraPhotoPath)};
            }
        } else {
            String dataString = data.getDataString();
            if (dataString != null) {
                results = new Uri[]{Uri.parse(dataString)};
            }
        }

        mFilePathCallback.onReceiveValue(results);
        mFilePathCallback = null;
    }
}

1. 确保你的应用处理运行时权限请求。

iOS WKWebView

iOS 上的 WKWebView 可以通过 <input type="file"> HTML 元素直接调用相机，但是你需要在你的 Info.plist 文件中声明相机使用权限：

1. 在 Info.plist 中添加权限：

   • NSCameraUsageDescription - 描述应用为什么需要访问相机。
   • NSPhotoLibraryAddUsageDescription - 描述应用为什么需要写入相册。

2. 确保相应的 <input> 元素具有合适的属性，例如 accept="image/*" 以观察相机选项。

html
<input type="file" accept="image/*" capture="camera">

1. 用户触发 <input type="file"> 后，系统会自动提供选项来拍照或选择现有的照片。

这些步骤应该能帮助你在 WebView 控件中调用设备相机。需要注意的是，实现的细节可能会随着平台和技术的更新而变化，因此在实施时请参考最新的平台文档。