使用 WebRTC 获取所有相机设备并显示在页面中

可以使用以下代码将所有相机列出来并在页面中显示出来：

// 获取所有可用的媒体设备
navigator.mediaDevices.enumerateDevices().then(function(devices) {
  // 找到所有的视频设备
  var videoDevices = devices.filter(function(device) {
    return device.kind === 'videoinput';
  });

  // 找到页面中的设备列表元素
  var deviceList = document.getElementById('device-list');

  // 遍历所有视频设备并在页面中显示出来
  videoDevices.forEach(function(device) {
    var option = document.createElement('option');
    option.value = device.deviceId;
    option.text = device.label || 'Camera ' + (deviceList.length + 1);
    deviceList.appendChild(option);
  });
}).catch(function(error) {
  console.error('Error getting media devices', error);
});

在页面中，需要添加一个 select 元素来显示设备列表：

<select id='device-list'></select>

这样，所有可用的相机设备将会在 device-list 元素中以选项的形式列出来。每个选项的值为设备的 ID，文本为设备的标签或默认名称。