camera_permission

通过 iframe 集成 - iframe integration

要允许 iframe 访问摄像头权限，您需要使用 allow 属性并在属性中增加 "autoplay; camera;"。以下是一个示例：

To allow iframe to visit camera, you need to add allow attribute with "autoplay; camera;" value. Following is an example:

<iframe src="liveness-url-here" allow="autoplay; camera;"></iframe>

请注意，

此方法仅在使用 HTTPS 的情况下才能正常工作。另外，为了确保最佳安全性，建议您只允许受信任的网站访问您的摄像头。
iframe 的 src属性需要经过URL Encode。在 JavaScript 中，可以使用 encodeURIComponent 函数将字符串进行 URL 转义，示例如下：

Please note that,

The integration only works with HTTPs. Besides, to ensure the best security was held, please make sure only trusted websites were allowed here.

The srcattribute should be URL encoded. In Javascript, you can use encodeURIComponent method to achieve that. Following is an example:

const url = "liveness-url-here";
const encodedUrl = encodeURIComponent(url);
<iframe src=encodedUrl allow="autoplay; camera;"></iframe>

Android App

在 Android Webview 中允许活体服务访问摄像头，您需要在App中重写 onPermissionRequest方法：

To allow Android Webview to visit camera, you need to override the onPermissionRequest method in your app:

private var mWebChromeClient: WebChromeClient = object : WebChromeClient() {

    override fun onPermissionRequest(request: PermissionRequest?) {

        //  IMPORTANT: Check host and adapt filter to allow camera access
        // e.g. if (request?.origin?.host == "xxx") {...}

        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
            if (context is BaseActivity) {
                if (ContextCompat.checkSelfPermission(
                        context,
                        Manifest.permission.CAMERA
                    ) == PackageManager.PERMISSION_GRANTED
                ) {
                    request?.grant(request.resources)
                } else {
                    context.requestPermission(Manifest.permission.CAMERA) { granted ->
                        if (granted) {
                            request?.grant(request.resources)
                        } else {
                            request?.deny()
                        }
                    }
                }
            }
        }
    }
}

iOS App

在 iOS Webview 中允许访问摄像头，您需要执行以下步骤：

To allow iOS Webview to visit camera, you need the following adjustment:

在 info.plist 文件中添加 NSCameraUsageDescription 权限，允许应用程序使用设备的摄像头。
Inside info.plist file, set NSCameraUsageDescription to allow the app to access camera.
```
<key>NSCameraUsageDescription</key> 
<string>$(PRODUCT_NAME) 需要使用您的摄像头</string>  
```

配置 Webview 实例的配置对象，以允许内联媒体播放，禁用用户操作，启用 JavaScript，启用自动打开窗口。
Config Webview instance to allow inline media playback, disable user action for playback, enable JavaScript, and enable JavaScript to automatically open windows.

let configuration = WKWebViewConfiguration()
configuration.allowsInlineMediaPlayback = true
configuration.mediaTypesRequiringUserActionForPlayback = []
configuration.preferences.javaScriptEnabled = true
configuration.preferences.javaScriptCanOpenWindowsAutomatically = true
self.webView = WKWebView(frame: self.view.bounds, configuration: configuration)

在进入h5活体页面之前, 先去请求App的相机权限，样例代码如下
before entering H5 liveness detection, check and request for camera access first.

// 请求相机权限(swift 样例代码)
// Request camera permission (in Swift)
func checkAVAuthorizationStatus(with block: @escaping((_ authed: Bool) -> Void)) {
    let authStatus = AVCaptureDevice.authorizationStatus(for: .video)
    if authStatus == .authorized {
        block(true)
    } else if authStatus == .denied || authStatus == .restricted {
        block(false)
    } else {
        AVCaptureDevice.requestAccess(for: .video) { (result) in
            DispatchQueue.main.async {
                block(result)
            }
        }
    }
}

// Usage
// Check auth status before entering H5 liveness webpage.
self.checkAVAuthorizationStatus { authed in
  if authed {
    // Enter H5 webpage directly
  } else {
    // Logic to handle camera unauthorised.
  }
}

(可选）避免网页内每次都为了摄像机权限而弹窗。
(Optional) To avoid camera permission prompt in H5 every time.

// Make sure your ViewController inherits WKUIDelegate.
class ViewController: UIViewController, WKUIDelegate {
    ...

    // Only verified for iOS 15+
    @available(iOS 15.0, *)
    func webView(_ webView: WKWebView, requestMediaCapturePermissionFor origin: WKSecurityOrigin, initiatedByFrame frame: WKFrameInfo, type: WKMediaCaptureType, decisionHandler: @escaping (WKPermissionDecision) -> Void) {
        // NOTE: please add necessary security check like domain filter if needed.
        decisionHandler(.grant)
    }
}

self.webView.uiDelegate = self

Camera permission