WebRTC - 更改音頻 output 設備

Question

我有一個使用用戶媒體設備的應用程序，我想允許用戶自己更改音頻 output。 為此，我遵循了這個例子

當我 select 我想要的設備時嘗試這樣做：

var deviceId = "b6d4b95564be24f8be5b8e982fdf851e658a05bb9d3aeec09280976b11debc2a";
var audioElement = document.querySelector('audio');
if (typeof audioElement.sinkId !== 'undefined') {
    audioElement.setSinkId(deviceId)
        .then(function() {
            console.log('Success, audio output device attached: ' + deviceId);
        })
        .catch(function(error) {
            var errorMessage = error;
            if (error.name === 'SecurityError') {
                errorMessage = 'You need to use HTTPS for selecting audio output ' + 'device: ' + error;
            }
            console.error(errorMessage);
        });
} else {
    console.warn('Browser does not support output device selection.');
}

audioElement是 HTML 文件中的音頻標簽。 deviceId是我想用作 output 的設備的 ID（例如： b6d4b95564be24f8be5b8e982fdf851e658a05bb9d3aeec09280976b11debc2a ）

但這給了我一個DOMException error: Requested device not found 。

但是enumerateDevices function 的deviceId結果：

navigator.mediaDevices.enumerateDevices().then(function(devices){
    var audioInputList = _.filter(devices, function(device){ return device.kind == "audioinput"; });
    var audioOutputList = _.filter(devices, function(device){ return device.kind == "audiooutput"; });
}).catch(function(){
    console.log("error");
});

那么有什么問題呢？

編輯

這就是我獲取UserMedia 和設備列表的方式：

function handleSuccess(stream){
    var audioElement = document.querySelector('audio');
    audioElement.srcObject = stream;
    return navigator.mediaDevices.enumerateDevices();
}

function gotDevices(devices){
    var audioDevice = { input:[], output:[] };
    audioDevice.input = _.filter(devices, function(device){ return device.kind == "audioinput"; });
    audioDevice.output = _.filter(devices, function(device){ return device.kind == "audiooutput"; });
}

function start(contraints){
    deconnectPeerConnection();
    navigator.mediaDevices.getUserMedia(contraints).then(handleSuccess)
    .then(gotDevices).catch(handleError);
}
start(constraints);

Answer 1

此外，您應該檢查由此媒體元素播放的 MediaStream 是否有音軌，否則會引發異常。