如何通过Chrome扩展程序流式传输音频

时间:2020-11-09 04:30:41

标签: javascript google-chrome google-chrome-extension

我试图使用WebRTC为流媒体点对点创建一个chrome扩展,但事实是,由于该扩展将存活一段时间,因此我尝试将对等连接数据和描述作为本地发送以获得本地音频,我对远程音频也是如此。

async function addStreamtoPeerConnection(pc) {
    await chrome.extension.sendMessage({ type: "local", pc: pc });
}

// Remote  audio which is created after the above function and the connection was initialized
friends[pub].pc.ontrack = (event) => {
        console.log("ontrack", event);
        if (remoteAudio.src !== event.streams) {
            //createResonanceScence(event.streams[0]);

            chrome.extension.sendMessage({ type: "remote", event: event });
            console.log("received remote stream", event);
        }
    };

在收到请求后,后台脚本应该创建音频元素并从后台播放它们。

document.write(
    "<div class='audioComponent'><audio class='localAudio'></audio><audio class='remoteAudio'></audio></div>"
);
var localAudio = document.getElementsByClassName(".localAudio");
var remoteAudio = document.getElementsByClassName(".remoteAudio");
chrome.runtime.onMessage.addListener((request, sender, response) => {
    console.log("Req:", request);
    if (request.type == "local") {
        var constraints = { audio: true, video: false };
        navigator.mediaDevices
            .getUserMedia(constraints)
            .then((userMediaStream) => {
                userMediaStream.getTracks().forEach((track) => {
                    request.pc.addTrack(track, userMediaStream);
                });
                localAudio.src = userMediaStream;
                localAudio.onloadedmetadata = function () {
                    localAudio.play();
                    console.log(">>>>LOCAL AUDIO HERE<<<<<");
                    localAudio.muted = true;
                };
                localAudio.attr("disabled", true);
            });

        console.log(document.getElementsByClassName(".audioComponent"));
    }
    if (request.type == "remote") {
        remoteAudio.muted = true;
        createResonanceScence(request.event.streams);
        remoteAudio.src = request.event.streams;
        remoteAudio.onloadedmetadata = function () {
            remoteAudio.play();
            console.log("metadata loaded");
        };
        document.getElementsByClassName(".audioComponent").append(remoteAudio);
    }
});

_genic_background_page.html:1事件处理程序中的错误:TypeError:localAudio.play不是一个函数 在chrome-extension://pckefmohphiekioecgigmahpganhhjfg/src/js/background.js:26:14

_genic_background_page.html:1未捕获(承诺)的DOMException:由于关闭而失败

以上是我从后台页面得到的错误

0 个答案:

没有答案