檢查音頻和視頻設備是否使用 javascript 連接

Question

我正在使用 twilio video API 構建一個視頻通話網絡平台，我們要求在用戶加入通話之前，我們必須檢查用戶是否有音頻和視頻設備連接到他的計算機，如果用戶沒有這些設備，然后不允許用戶加入視頻通話。

我已經從https://webrtc.org/getting-started/media-devices嘗試了mediaDevices.enumerateDevices 。下面是代碼，

function getConnectedDevices(type, callback) {
  navigator.mediaDevices.enumerateDevices()
    .then(devices => {
        console.log(devices);
        callback(filtered);
    });
}

這給了我下面的json，

[{
    deviceId: "default",
    groupId: "10684f807204708d605cc3ad0e5c4eaf763f1440775b8f79cdecf72806cc82f5",
    kind: "audioinput",
    label: "Default - Microphone (Realtek Audio)"
},
{
    deviceId: "communications",
    groupId: "10684f807204708d605cc3ad0e5c4eaf763f1440775b8f79cdecf72806cc82f5",
    kind: "audioinput",
    label: "Communications - Microphone (Realtek Audio)"
},
{
    deviceId: "491ccf0569924a7c1264a6afd337a8f744f239d78414e80f17a07122725bb46c",
    groupId: "10684f807204708d605cc3ad0e5c4eaf763f1440775b8f79cdecf72806cc82f5",
    kind: "audioinput",
    label: "Microphone (Realtek Audio)"
},
{
    deviceId: "823160fcdef4bedf2d1769cfbcb9058fe41bc01258b811f9aef19eb21a27cb76",
    groupId: "f86216b491186ac3208f9fc59d31b913e7017bafb505005d39983345ab35811f",
    kind: "videoinput",
    label: "Integrated Webcam (0bda:5689)"
},
{
    deviceId: "default",
    groupId: "10684f807204708d605cc3ad0e5c4eaf763f1440775b8f79cdecf72806cc82f5",
    kind: "audiooutput",
    label: "Default - Speakers / Headphones (Realtek Audio)"
},
{
    deviceId: "communications",
    groupId: "10684f807204708d605cc3ad0e5c4eaf763f1440775b8f79cdecf72806cc82f5",
    kind: "audiooutput",
    label: "Communications - Speakers / Headphones (Realtek Audio)"
},
{
    deviceId: "213851f9659d4751c7c60016112d74e290d1ce398d12d774bda0c68ef590f61c",
    groupId: "10684f807204708d605cc3ad0e5c4eaf763f1440775b8f79cdecf72806cc82f5",
    kind: "audiooutput",
    label: "Speakers / Headphones (Realtek Audio)"
}
]

通過查看 json，我並不完全了解如何檢查可用的音頻和視頻設備。 因為我必須在 angular 中實現這個，所以我不想使用 jquery 或任何插件

Answer 1

如果您的計算機沒有連接任何音頻或視頻設備，則此數組將為空。 您似乎已經在這里連接了一些設備。

你要尋找什么是audioinput的麥克風和videoinput照相機。

所以你可以做這樣的事情：

navigator.mediaDevices.enumerateDevices()
    .then(devices => {
        const microphones = devices.filter(d => d.kind === 'audioinput');
        const cameras = devices.filter(d => d.kind === 'videoinput');
        callback(
          microphones,
          cameras
        );
    });

如果cameras.length > 0 ，那么你已經得到了某種連接一個攝像頭，如果microphones.length > 0 ，那么你已經有了某種麥克風的連接。 您可以使用它來檢查是否要允許某人接聽電話。