rtcpeerconnection 跟踪事件有时返回空流答案

【问题标题】：rtcpeerconnection track event sometimes returning empty streamrtcpeerconnection 跟踪事件有时返回空流
【发布时间】：2020-07-04 15:20:34
【问题描述】：

建立第一次成功的 RTC 连接的最佳方法是什么？

以下代码有时有效，有时无效。我认为addIceCandidate 在createAnswer 之前或之后被调用是一个问题，我不知道哪个更可取，或者这是否是问题（为什么它不能一直工作，只需将其粘贴到一个浏览器，多试几次，你应该会发现至少有时候“通话”按钮不能一直工作）：

<body>
    <style>
        video {
            width: 300px
        }
    </style>
    <button id="s">start</button>
    <button id=c>Call</button><br>
<video id="L" autoplay muted></video>
<video id=R autoplay></video>
<video id=R2 autoplay></video>
<video id=R3 autoplay></video>
<script>
var ls, p, p2, bpl, bpr, con = {
 //   sdpSemantics: "default"
}, deets = {
    offerToReceiveAudio: 1,
    offerToReceiveVideo: 1
}

function g() {
    navigator.
    mediaDevices.getDisplayMedia().then(s => {
        ls = L.srcObject = s;

    })
}
s.onclick = e => {
    g()
};

function wow(data={}) {
    let local  = new RTCPeerConnection(con),
        remote = new RTCPeerConnection(con);

    local .addEventListener("icecandidate", e => oic(remote, e));
    remote.addEventListener("icecandidate", e => oic(local , e));

    remote.addEventListener("track", e => grs(data.video, e));

    data
        .localStream
        .getTracks()
        .forEach(t => {
            local.addTrack(t, data.localStream);
        });

    local.createOffer(deets).then(offer => {
        local .setLocalDescription(offer);
        remote.setRemoteDescription(offer);

        remote.createAnswer().then(answer => {
            remote.setLocalDescription(answer);
            local .setRemoteDescription(answer);
        })
    });
}

c.onclick = e => {
    let localStream = ls;
    wow({
        video: R,
        localStream
    });

    wow({
        video: R2,
        localStream
    });

    wow({
        video: R3,
        localStream
    });

};

function grs(vid,e) { 
    if(vid.srcObject !== e.streams[0]) {
        vid.srcObject = e.streams[0];
    }
}

function oic(pc, e) {
    let other = pc;
    if(e.candidate)
        other
        .addIceCandidate(e.candidate)
}
</script>
</video>
</body>

请注意，有时视频流会延迟进入并为空。

【问题讨论】：

流怎么是空的？它没有轨道吗？还是冰连接没有建立？
@PhilippHancke 它似乎至少有一个轨道，它只是没有在视频元素中显示任何内容。我认为这与在 addIcecAndidate 之前（或之后？）创建的答案有关你知道哪个必须先来吗？

标签： javascript webrtc video-capture mediastream rtcpeerconnection

【解决方案1】：

请look again at documentation。起初，您使用的是异步函数，因此当时它无法解析然后您调用它（例如，用户没有回答提示或浏览器根本拒绝它）。其次，您没有处理错误，将 catch() 块添加到您的代码中，浏览器将自行回答您的问题

【讨论】：

谢谢，虽然这个问题与屏幕捕捉 API 无关；相反，主要是 RTCPeerConnection 对象，我有 2 个按钮，所以在捕获流后我是否单击调用

【解决方案2】：

我之前在使用PeerConnection API时也遇到了同样的问题，问题是统一计划SDP格式，也许值得一读。

【讨论】：

你能解释一下吗？
@bluejayke 在统一计划中，发送者和接收者是成对的收发器创建的，并且可能早在远程 SDP 提供轨道之前就已经创建了收发器.receiver.track。因此，不再保证在 RTCPeerConnection.ontrack 中触发的轨道具有与轨道的发送方版本匹配的 ID。此外，由于 addTransceiver() 和 replaceTrack()，一个音轨可能会被发送多次。
@bluejayke 表示一定有track，可以试试plan-b，应该没问题。顺便说一句，您的代码很难阅读
这是添加到 RTCPeerConnection 上的附加库吗？如果是这样，我宁愿在没有任何额外库的情况下这样做。代码的主要部分在 wow() 函数中，ontrack 事件在底部
所以我应该使用默认的plan-b，或者我应该使用统一的计划（修复错误）？