WebRTC более одного однорангового соединения

Question

Я искал почти везде и не могу найти какой-либо ресурс по этому сценарию по какой-то причине. Любая помощь будет принята с благодарностью.

Проблема заключается в следующем:

У меня 4 пользователя. Скажем: A,B,C и D. Я хочу сопоставить их по URL. Например, если A и B подключаются к &room=1, а C и D подключаются к &room=2, я хочу установить соединение между парами A и B и парами C и D.

В настоящее время мой код только устанавливает соединение между A и B, и если один из пользователей C или D инициирует вызов, соединение между A и B разрывается, и C не может найти D.

---

Чтобы решить эту проблему, я попытался создать такой объект:

{room: 1, peer: RTCPeerConnection}

и сохраните его в массиве, получите одноранговое соединение в соответствии с номером комнаты и установите соединение на основе RTCPeerConnection, которое хранится в соответствии с roomId. Но это не сработало.

Как мне исправить это, не устанавливая сокет-сервер, который обрабатывает это сообщение?

---

В настоящее время я устанавливаю соединения таким образом, если это помогает:

navigator.mediaDevices
    .getUserMedia({
        audio: true,
        video: true
    })
    .then(function (stream) {
        localStream = stream;
        localVideo.srcObject = localStream;
        try {
            conn = new RTCPeerConnection(servers);
        } catch (err) {
            console.log("Can't establish connection");
            return;
        }
        localStream.getTracks().forEach(function (track) {
            conn.addTrack(track, localStream);
        });
        conn.onaddstream = function (event) {
            setTimeout(() => {
                callButton.click();
            }, 2000);
            remoteVideo.srcObject = event.stream;
        };
        conn.onicecandidate = function (event) {
            if (event.candidate) {
                chat.server.iceCandidate(
                    JSON.stringify({ candidate: event.candidate })
                );
            }
        };
    })
    .catch(function (err) {
        console.log("Error", err);
    });

---

И это мое неудачное решение:

    var connections = JSON.parse(localStorage.getItem("connections")) || [];
    var connection;
    if (connections) {
        connection = connections.find(function (conn) {
            return conn.id = roomId;
        })
    }
    if (!connection) {
        conn = new RTCPeerConnection(servers);
        var data = {
            id: roomId,
            peer: conn
        }
        localStorage.removeItem("connections");
        localStorage.setItem("connections", JSON.stringify(connections));
    } else {
        conn = JSON.parse(connection.peer);
        conn.__proto__ = new RTCPeerConnection();
    }

Это терпит неудачу, потому что, конечно, вы не можете хранить прото объекта в localStorage (RTCPeerConnection). Когда я читаю / разбираю его, атрибут peer приходит как пустой объект. Если я пытаюсь использовать глобальную переменную вместо localStorage, она всегда будет пустой. Я очень признателен за любой совет по этому вопросу.

Answer 1

Это похоже на то, как вы запутались в переменной localStorage, для целей тестирования и во избежание реализации сервера сигнализации, я советую использовать https://github.com/cjb/serverless-webrtc или обновленный jameshfisher

При этом вы можете создать комнаты (разделить клиентов) и показать вам sdp-сообщение для копирования и вставки на другой клиент (без localStorage), чтобы установить одноранговое соединение. Это будет лучше для тестирования между браузерами Firefox <-> Chrome, Safari и т. Д.