Video-Streaming über Websockets mit JavaScript


84

Was ist der schnellste Weg, um Live- Videos mit JavaScript zu streamen ? Ist WebSockets over TCP ein Protokoll, das schnell genug ist, um ein Video mit beispielsweise 30 Bildern pro Sekunde zu streamen?


1
Gert G: Was würden Sie empfehlen? Ich würde es vorziehen, den Speicherverbrauch relativ niedrig zu halten, deshalb scheint JS (Aktualisieren einer HTML5-Zeichenfläche) eine bessere Option zu sein, wenn es eine ausreichend gute Geschwindigkeit bieten kann.
SMiLE

1
Hoppla, ich habe vergessen zu erwähnen, dass ich am Live-Streaming interessiert bin, nicht nur am Streaming einiger in einer Datei gespeicherter Videos. Kann <video> das anbieten?
SMiLE

2
Ich wäre nicht so besorgt über den Streaming- Teil, sondern darüber, wie Sie das gestreamte Video so rendern würden . Ist das überhaupt möglich?
Täuschung

4
Für die Geschwindigkeits-Neinsager sind dies Beispiele für schnelle Bild- und Videoraten unter Verwendung von HTML 5: The Wilderness Downtown (Chrome, Video) thewildernessdowntown.com und Quake in HTML 5 (Chrome, Bildrate) techcrunch.com/2010/04/01/ google-html5-quake Ein paar Proofs of Concept. Es wird sich nur verbessern. Jemand wird früh genug auf den Zug springen und die Vorteile eines frühen Spielers auf dem Markt nutzen, wenn jemand dies noch nicht getan hat. Würde ich für IE den Atem anhalten? Ich weiß nicht '
John K

2
Vielen Dank für die Beispiele, John K.
SMiLE

Antworten:


78

Ist WebSockets over TCP ein Protokoll, das schnell genug ist, um ein Video mit beispielsweise 30 Bildern pro Sekunde zu streamen?

Ja .. es ist, werfen Sie einen Blick auf dieses Projekt . Websockets können problemlos HD-Videostreaming verarbeiten. Sie sollten sich jedoch für adaptives Streaming entscheiden. Ich erkläre hier, wie Sie es implementieren können.

Derzeit arbeiten wir an einer webbasierten Instant Messaging-Anwendung mit Chat-, Filesharing- und Video- / Webcam-Unterstützung. Mit ein paar Kleinigkeiten haben wir Streaming-Medien über Websockets erhalten (HTML5 Media Capture verwendet, um den Stream von unseren Webcams zu erhalten).

Sie müssen ein stream APIund ein erstellen Media Stream Transceiver, um die zugehörige Medienverarbeitung und den zugehörigen Transport zu steuern.


4
Das ist großartig, danke! Ich denke, ich werde eine sehr grundlegende Implementierung des Video-Streamings ausprobieren, die überhaupt nicht adaptiv ist, die Ergebnisse betrachten und entsprechend vorgehen. zu wissen, dass dies möglich ist, ist jedoch sehr ermutigend! Ihr Tutorial ist auch sehr hilfreich.
SMiLE

1
Ja, es ist eine gute Praxis, mit einer einfachen Anwendung zu beginnen. Sie müssen den größten Teil der für das Live-Streaming erforderlichen Technologie selbst entwickeln. Dies ist wahrscheinlich keine Option, wenn Sie: A. einfach anfangen und B. alleine sind. Viel Glück.
Wouter Dorgelo

@ Mr.Pallazzo wofür baust du die App? Ein Geschäft? Gibt es eine Chance, dass ich mich mit Ihnen in Verbindung setzen kann, wie Sie es machen?
Alistair

@WouterDorgelo Wie ist Ihre App-Leistung beim HD-Streaming über Websockets?
Quarks

Können wir Videos aufnehmen CCTVund live auf einer Webseite mit zeigen Javascript?
Shaijut


0

Um die Frage zu beantworten:

Was ist der schnellste Weg, um Live-Videos mit JavaScript zu streamen? Ist WebSockets over TCP ein Protokoll, das schnell genug ist, um ein Video mit beispielsweise 30 Bildern pro Sekunde zu streamen?

Ja, Websocket kann verwendet werden, um über 30 fps und sogar 60 fps zu übertragen.

Das Hauptproblem bei Websocket ist, dass es auf niedriger Ebene ist und Sie sich möglicherweise mit anderen Problemen befassen müssen, als nur mit der Übertragung von Video-Chunks. Alles in allem ist es ein großartiger Transport für Video und auch Audio.


Was ist also mit dem WebRTC? Es (als w3c) arbeitet an einer UDP-Verbindung und wenn wir einen Paketverlust haben, wäre dies kein Problem. Auf der anderen Seite ist WebSocket verbindungsorientiert und kann Benutzer aufgrund der auftretenden Latenz stören.
M. Rostami

-1

Es ist definitiv denkbar, aber ich bin mir nicht sicher, ob wir noch da sind. In der Zwischenzeit würde ich empfehlen, Silverlight mit IIS Smooth Streaming zu verwenden . Silverlight ist Plugin-basiert, funktioniert aber unter Windows / OSX / Linux. Eines Tages wird das HTML5- <video>Element der richtige Weg sein, aber das wird für eine Weile nicht unterstützt.


Vielen Dank für Ihre Antwort. Ich bin damit einverstanden, dass Silverlight und Flash derzeit wahrscheinlich bessere Optionen sind. Ich glaube, ich interessiere mich für Javascript-Streaming, weil es mehr Möglichkeiten für die Interaktivität zwischen dem Benutzer und dem (Videoübertragungs-) Server eröffnet.
SMiLE

Ich muss Josh zustimmen. Wenn Sie gerade dringend Streaming-Medien benötigen, entscheiden Sie sich nicht für HTML5.
Wouter Dorgelo

6
Nur für den Fall, dass noch jemand dies liest: First of Silverlight hat Linux oder mobile Systeme nie unterstützt. Linux Silverlight-Unterstützung gab es einfach nie. Zweitens, wie neuere Antworten richtig zeigen, ist HTML5 / MSE-Video-Streaming in modernen Browsern mittlerweile sehr gut möglich und sollte in fast allen Fällen jedem Plugin-basierten Ansatz vorgezogen werden.
Ntninja

3
Und wenn jemand dies noch liest, ist dieser Tag gekommen. Verwenden Sie aus Liebe zu Gott kein
Silverlight
Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.