webrtc => WebRTC einfache Beispiele

Parameter

getUserMedia () Parameter	Beschreibung
Einschränkungen	Es besteht aus einem Array, mit dem wir festlegen können, welche Mediengeräte verwendet werden sollen, z. B. Audio oder Video oder beides
Erfolgreicher Rückruf	Erstellen Sie eine Funktion für den Rückruf, mit der Sie den Stream erhalten, den Sie von Ihren Mediengeräten erhalten
Fehler Rückruf	Dieser Rückruf wird aufgerufen, wenn das Problem besteht, dass keine Mediengeräte vorhanden sind oder der Benutzer die Berechtigung zur Verwendung dieser Geräte abgelehnt hat

Erhalten Sie Kamera- und Mikrofonberechtigung und zeigen Sie die Vorschau auf der Webseite an

Um mit WebRTC arbeiten zu können, benötigen Sie die Erlaubnis zur Kamera und zum Mikrofon. Dafür benötigen Sie folgende Dinge:

adapter.js können Sie hier adapter.js
Eine HTML-Webseite mit einem Video-Tag und etwas js-Code

Die adapter.js ist ein JavaScript-Shim für WebRTC, das von Google mit Hilfe der WebRTC-Community gepflegt wird und Herstellerpräfixe, Browserunterschiede und Änderungen der Spezifikationen abstrahiert.

Sobald Sie diese Datei haben, erstellen Sie eine HTML-Datei mit folgendem Code:

<!DOCTYPE html>
<html>
    <head>
        <title>My first webrtc example</title>
        <script src="adapter.js"></script>
        <script type="text/javascript">
            function gotStream(stream) {
                window.AudioContext = window.AudioContext || window.webkitAudioContext;
                var audioContext = new AudioContext();

                // Create an AudioNode from the stream
                var mediaStreamSource = audioContext.createMediaStreamSource(stream);

                // Connect it to destination to hear yourself
                // or any other node for processing!
                mediaStreamSource.connect(audioContext.destination);
                var video = document.querySelector('video');
                var videoTracks = stream.getVideoTracks();
                window.stream = stream; // make variable available to browser console
                video.srcObject = stream;
            }
            function onfail(error) {
                console.log("permission not granted or system don't have media devices."+error.name);
            }
            navigator.getUserMedia({audio:true,video:true}, gotStream,onfail);
            
            
        </script>
    </head>
    <body>
        Welcome to webrtc
        <video id="local" autoplay=""></video>
    </body>
</html>

Wenn Sie fertig sind, speichern Sie diese Datei und führen Sie sie im Browser aus. Wenn Sie den Browser starten, werden Sie aufgefordert, dieser Website den Zugriff auf Ihre Webcam und Ihr Mikrofon zu gestatten. Erlauben Sie es und Whola !, Sie sehen die Vorschau auf der Webseite.

Modified text is an extract of the original Stack Overflow Documentation

Lizenziert unter CC BY-SA 3.0

Nicht angeschlossen an Stack Overflow

webrtc
WebRTC einfache Beispiele

Suche…

Parameter

Erhalten Sie Kamera- und Mikrofonberechtigung und zeigen Sie die Vorschau auf der Webseite an