Как настроить соединение с сервером сигналов WebRTC - PullRequest
Новая
       76

Как настроить соединение с сервером сигналов WebRTC

0 голосов
/ 06 февраля 2019

Я новичок в node.js (и webRTC).Я пытаюсь закодировать программное обеспечение для потокового видео, в которое вы входите в «видео комнату», если у вас есть уникальный URL с ключом (запрос на получение или хэш в URL), и только с этим ключом эти двое могут вести видеочат.Я следил за двумя видео на эту тему.Первая о том, как создать поток и соединить две учетные записи, а другая о сигнальном сервере, который должен позволить двум пользователям находить друг друга, не вводя идентификаторы пиров на каждой странице перед подключением.Прямо сейчас мое единственное мыслимое решение после того, как я посмотрел эти видео, это либо использовать хеш, либо получить запрос, но с помощью экспресс-маршрутизации, которую я пытался реализовать (что не удалось), и моей текущей ситуации, когда у меня есть несколько хешей, и поэтомуне знаю, что именно я мог бы использовать свежим взглядом, чтобы найти решение ... Первая часть с потоковым видео работает нормально, но я не могу обернуть голову, как должна быть закодирована сигнальная часть, и я мог быдействительно используйте некоторую помощь или обратную связь здесь.Я рассмотрел некоторые другие подобные вопросы, но решения не кажутся подходящими.

Мои две зависимости - только signalhub и simple-peer.

index.html 

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>Video chat</title>
</head>
<body>

    <p>Your id</p><br>
    <textarea id="yourId"></textarea>

    <p>Other id</p><br>
    <textarea id="otherId"></textarea>

    <button id="connect">connect</button>

    <textarea id="yourMessage"></textarea>

    <button id="send">send</button>



    <button id="close">Close</button>


    <script type="text/javascript" src="bundle.js"></script>
</body>
</html>

index.js 

const signalhub = require("signalhub")
const hub = signalhub("call", [
                                "http://192.168.2.15:8080"
                            ])




navigator.getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia || navigator.mozGetUserMedia || navigator.msGetUserMedia;

navigator.getUserMedia({video:true, audio: true}, function(stream){


    var Peer = require("simple-peer")
    var peer = new Peer({
        initiator: location.hash === "#init", // <= hash 1
        trickle: false,
        stream: stream
    })
        //channelName: ""

    if (Peer.WEBRTC_SUPPORT) {

/*
        */


        peer.on("signal", function(data){
            document.getElementById("yourId").value = JSON.stringify(data)
            /* // code here not working due to the initiator
            hub.subscribe("update").on("data", function(data){
                console.log(data)
            })

            setInterval(function(){
                hub.broadcast("update", window.location.hash) // <= hash two
            },1000)*/

        })

        document.getElementById("connect").addEventListener("click", function(){
            var otherId = JSON.parse(document.getElementById("otherId").value)
            peer.signal(otherId)
        })

        document.getElementById("send").addEventListener("click", function(){
            var yourMessage = document.getElementById("yourMessage").value
            peer.send(yourMessage);
        })
    /*
        peer.on("data", function(data){
            document.getElementById("messages").textContent += data + "\n"
        })*/

        peer.on("stream", function(stream){

            var video = document.createElement("video")
            document.body.appendChild(video)

            video.srcObject = stream;
            video.play()


            var myVideo = document.createElement("video")
            document.body.appendChild(myVideo)

            myVideo.srcObject = window.localStream
            myVideo.play()

            document.getElementById("close").addEventListener("click", function(){

                window.close();
                window.setTimeout(function(){location.href = 'https://www.gamingbuddy.gg';},1000);

            })
        })

    // webrtc support!
    } else {
      // fallback
    }

}, function(err){
    console.log(err)
})
...