js获取硬件设备

在Javascript中通过MediaDevices 的方法enumerateDevices() 请求一个可用的媒体输入和输出设备的列表，例如麦克风，摄像机，耳机设备等。返回的 Promise 完成时，会带有一个描述设备的 MediaDeviceInfo 的数组。通常你可以使用 navigator.mediaDevices 来获取 MediaDevices ，例如：

//获取摄像头设备的方法
const videoRef = ref();
let cameraDevices = [];

async function getCameraId() {
  try {
    //全部设备
    const devices = await navigator.mediaDevices.enumerateDevices();
    // 摄像头设备
    cameraDevices = devices.filter(device => device.kind === 'videoinput');
    console.log('======>>>', devices);
  } catch (error) {
    console.error('获取设备失败:', error);
  }
}
getCameraId();

拿到摄像头设备后调用摄像头:

// 拿到摄像头id后，调用摄像头
try {
  const deviceId = cameraDevices[0]?.deviceId
  let constraints = {
    deviceId
  };
  stream = await navigator.mediaDevices.getUserMedia({ audio: false, video: constraints });
  videoRef.value.srcObject = stream;
  videoRef.value.play();
} catch (error) {
  ElMessage.error('摄像头获取失败，请检查摄像头权限是否正常');
}
  
  
<video ref="videoRef" autoplay></video>

这种api在MDN上写的都比较清楚，推荐大家使用MDN查找。