如下图所示，我在我的项目中应用了 SAP UI5 前端框架的 BarCode scanner 控件，点击 scan 按钮后，执行如下的逻辑：

navigator.mediaDevices                .getUserMedia(defaultConstraints)                .then(                    function(stream) {                        if (oZXingScannerAPI) {                            openBarcodeScannerDialogContains();                        } else {                            oScanDialog.getModel().setProperty("/isNoScanner", true);                            openBarcodeInputDialog();                        }                    }                )

getUserMedia 返回值是一个 Promise，它的实现处理程序在胜利获取申请的媒体时接管一个 MediaStream 对象。

该对象在调试器里显示如下：

执行 openBarcodeScannerDialogContains：

调用 Dialog.open：

oZXingScannerAPI.decodeFromConstraints：

ZXing.js 位于 /sap/ndc/thirdparty/ZXing.js，从正文看是微软的 Copyright：

扫描窗口通过 sapNdcRTCDialogOverlayLine 实现：

能够从 Chrome network 标签页看到 ZXing.js 的加载行为。

ZXing（“斑马线”）是一个开源的、多格局的一维/二维条码图像处理库，用 Java 实现，可移植到其余语言。

https://github.com/zxing-js/l...

MediaDevices.enumerateDevices()

MediaDevices 办法 enumerateDevices() 申请可用媒体输出和输出设备的列表，例如麦克风、相机、耳机等。 返回的 Promise 应用形容设施的 MediaDeviceInfo 数组解析。

对特定设施的拜访由 Permissions API 管制。 返回的设施列表将省略任何未授予相应权限的设施，包含：麦克风、摄像头、扬声器抉择（用于输出设备）等。

一个 Promise，当 Promise 实现时接管 MediaDeviceInfo 对象数组。 数组中的每个对象都形容了一个可用的媒体输出和输出设备（只有被授予权限的设施类型是“可用的”）。 程序很重要 - 默认捕捉设施将首先列出。

如果枚举失败，则 Promise 被回绝。

上面的代码是一个例子，枚举以后运行环境里所有摄像头设施的 id：

if (!navigator.mediaDevices || !navigator.mediaDevices.enumerateDevices) {  console.log("enumerateDevices() not supported.");  return;}// List cameras and microphones.navigator.mediaDevices.enumerateDevices().then(function(devices) {  devices.forEach(function(device) {    console.log(device.kind + ": " + device.label +                " id = " + device.deviceId);  });}).catch(function(err) {  console.log(err.name + ": " + err.message);});

上述代码在我电脑上产生如下输入：

videoinput: FaceTime HD Camera (Built-in) id=csO9c0YpAf274OuCPUA53CNE0YHlIr2yXCi+SqfBZZ8=
audioinput: default (Built-in Microphone) id=RKxXByjnabbADGQNNZqLVLdmXlS0YkETYCIbg+XxnvM=
audioinput: Built-in Microphone id=r2/xw1xUPIyZunfV1lGrKOma5wTOvCkWfZ368XCndm0=