navigator.mediaDevices.getUserMedia检查用户的摄像头是否可用，虚拟摄像头问题

在Web开发中，检查用户的摄像头是否可用是一个常见的需求，尤其是在需要视频聊天或录制视频的应用程序中。navigator.mediaDevices.getUserMedia() API 提供了这一功能，它允许你请求访问用户的媒体设备，如摄像头和麦克风。虽然这个API本身主要用于获取媒体流，但你可以通过尝试获取摄像头流来间接检查摄像头是否可用。

有的同事电脑没有摄像头，也会返回stream。通过stream.getVideoTracks()，获取当前设备，发现是虚拟摄像头的问题。

下面是一个示例代码，展示了如何使用 navigator.mediaDevices.getUserMedia() 来检查摄像头是否可用，并处理可能出现的错误（如用户拒绝访问或摄像头不存在）：

function checkCameraAvailability() {
    // 请求访问用户的视频设备
    navigator.mediaDevices.getUserMedia({ video: true })
        .then(function(stream) {
            // 成功获取到流
			var videoTracks = stream.getVideoTracks();//获取所有的视频轨道
             console.log(videoTracks);
             let hasCamera = false;
             videoTracks.forEach((track) => {
                 if (track.kind == 'video' && track.label !== 'Intel Virtual Camera') {
                 	//有摄像头且不是虚拟摄像头
                     hasCamera = true;
                 }
             });
             if(!hasCamera){
                 alert('当前无可用摄像头设备');
                 return;
             }

            // 这里可以添加代码来处理或显示视频流
            // 例如，将视频流显示在页面上
            const videoElement = document.getElementById('video');
            if (videoElement) {
                videoElement.srcObject = stream;
                videoElement.play();
            }

            // 记得在不再需要时释放媒体资源
            // stream.getTracks().forEach(track => track.stop());
        })
        .catch(function(error) {
            // 如果捕获到错误，说明摄像头不可用
            console.error('摄像头不可用：', error);

            // 错误处理，根据具体需求进行
            // 比如，显示一个错误消息给用户
            if (error.name === 'NotFoundError') {
                alert('找不到摄像头设备');
            } else if (error.name === 'NotAllowedError') {
                alert('用户拒绝访问摄像头');
            } else if (error.name === 'NotReadableError') {
                alert('摄像头或麦克风设备不可读');
            } else if (error.name === 'OverconstrainedError') {
                // 指定的媒体类型或约束不满足
                // 例如，请求了前置摄像头但找不到
                alert('请求的媒体类型或约束不满足');
            }

            // 其他的错误处理...
        });
}

// 调用函数检查摄像头
checkCameraAvailability();

在这个例子中，我们首先尝试使用 getUserMedia 请求一个包含视频的设备（即摄像头）。如果成功，我们会在控制台中打印一条消息，并可以将视频流绑定到一个 <video> 元素上以便显示。如果失败，我们会捕获错误并根据错误的类型显示相应的消息给用户。