Question

我正在尝试navigator.mediaDevices.getUserMedia从下拉列表中选择一个摄像头并使用它，这是获取设备的代码：

var video = document.getElementById('video');

    navigator.mediaDevices.enumerateDevices().then(function (devices) {
        for (var i = 0; i < devices.length; i++) {
            var device = devices[i];
            if (device.kind === 'videoinput') {
                var option = document.createElement('option');
                option.value = device.deviceId;
                option.text = device.label || 'camera ' + (i + 1);
                document.querySelector('select#videoSource').appendChild(option);
            }
        };
    });

这是我使用相机的更改代码：

$("#videoSource").on("change", function () {

        var x = $(this).value;
        var constraints = { deviceId: { exact: x } };

        if (navigator.mediaDevices && navigator.mediaDevices.getUserMedia) {

            navigator.mediaDevices.getUserMedia({ video: constraints }).then(function (stream) {
                video.srcObject = stream;
                video.play();
            });

        }

    });

当我选择使用相机的选项时，出现此错误：

未捕获（承诺）的DOMException：权限被拒绝

我在做什么错了？

Answer 1

我已经在Stackblitz中测试了您的代码，它对我有用！

JQuery Camera

为了在选择中触发更改事件，我添加了一个额外的选择选项。

也许您的问题是您拒绝了权限。

navigator.mediaDevices.getUserMedia权限被拒绝

1 个答案: