WebRT C Ответ работает только при втором вызове - PullRequest
0 голосов
/ 25 апреля 2020

Я создаю очень простую c WebRT C систему чата, просто чтобы все части работали вместе, прежде чем перейти к большему проекту. У меня возникла проблема, когда при запуске ответа создания я получаю ошибку ICE.

Ошибка ICE, добавьте сервер TURN и посмотрите сведения о: webrt c для получения более подробной информации

НО, если я снова вызову ответ на создание, сразу же без ссылки на страницу sh et c. Тогда это работает ... почему ??

HTML стр. 1

<!DOCTYPE html>
<html>
<head>
    <title></title>

</head>
<body>


<h1>Offer</h1>
<textarea id="offer"></textarea>
<button id="makeOffer">Make Offer</button>

<h1>Peer's Provided Answer</h1>
<textarea id="answer"></textarea>
<button id="connectBtn">Connect</button>

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

Peer. html

<!DOCTYPE html>
<html>
<head>
    <title></title>

</head>
<body>


<h1>Offer Received From Remote...</h1>
<textarea id="remoteOffer"></textarea>
<button id="makeAnswerBtn">Make and Answer</button>

<h1>My Answer</h1>
<textarea id="answer"></textarea>

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

приложение. js

var App = function(){
    var app = this;

    // you need to give the turn server
    app.settings = {iceServers: [{urls: "stun:stun.1.google.com:19302"}]};
    app.rtc = new RTCPeerConnection(app.settings);
    app.dc = app.rtc.createDataChannel("chat", {negotiated: true, id: 0});

    app.offerBtn = document.getElementById("makeOffer");
    app.offer = document.getElementById("offer");

    app.makeAnswerBtn = document.getElementById("makeAnswerBtn");
    app.remoteOffer = document.getElementById("remoteOffer");
    app.answer = document.getElementById("answer");

    app.connectBtn = document.getElementById("connectBtn");

    app.dc.onmessage = function(data)
    {
        console.log(data);
    }

    app.rtc.oniceconnectionstatechange = function(data)
    {
        console.log(data);
    }

    // make the initial offer
    if (app.offerBtn)
    {
        app.offerBtn.addEventListener("click", function()
        {
            app.rtc.createOffer().then(app.showOffer).catch( e => console.log(e));
        })
    }

    if (app.makeAnswerBtn)
    {
        // save the offer to the remote description... 
        app.makeAnswerBtn.addEventListener("click", function()
        {
            // set the remote description... WAIT, and once complete, then create the answer...
            app.rtc.setRemoteDescription(JSON.parse(app.remoteOffer.value))
            .then(app.createAnswer).catch( e => console.log(e));
        })
    }

    if (app.connectBtn)
    {
        app.connectBtn.addEventListener("click", function(){
            app.rtc.setRemoteDescription(JSON.parse(app.answer.value));
        })
    }

    app.createAnswer = function()
    {
        app.rtc.createAnswer().then(app.showAnswer).catch( e => console.log(e))
    }

    app.showOffer = function(offer)
    {
        app.rtc.setLocalDescription(offer);
        app.offer.value = JSON.stringify(offer);
    }

    app.showAnswer = function(answer)
    {
        app.rtc.setLocalDescription(answer);
        app.answer.value = JSON.stringify(answer);
    }
}

new App();
...