Livestreaming auf der eigenen Webseite

In diesem Artikel erklären wir Ihnen wie man einen Livestream auf seiner eigenen Webseite einbindet.Einen Livestream auf die eigene Webseite zu kriegen ist heutzutage keine Herausforderung mehr. Schwieriger ist es, den dabei anfallenden Traffic zu bewältigen. Da Ihr Video natürlich flüssig und in einer guten Qualität abgespielt werden soll, kommt da schon bei 10 Zuschauern eine ordentliche Datenmenge zusammen. Hochwertige Rechenzentren verfügen über eine sehr gute Anbindung und haben daher die Kapazitäten die vielen Daten an die Nutzer zu verteilen.

Der Streaming Server

Einen kostengünstigen Streaming Server können Sie einfach selbst aufsetzen. Um nur einige Namen zu nennen, bieten sich Lösungen wie red5 oder nginx mit rtmp Modul an. Es gibt massenhaft Tutorials, wie man diese installiert deswegen möchte Ich an dieser Stelle nicht weiter darauf eingehen. Persönlich finde ich nginx mit rtmp modul empfehlenswert da es sehr Ressourcenschonend arbeitet und bereits mit einer kleinen VM betrieben werden kann. Auch HTTP-Streaming ist mit nginx problemlos möglich.

Streaming – das „richtige“ Format

Damit Ihr Livestream vermutlich auf allen Endgeräten abgespielt werden soll, rate ich dringend vom rtmp Protokoll ab. Dieses kann auf MacOS Geräten nicht wiedergegeben werden. Eine gute alternative ist HLS (HTTP Streaming) da es von allen gängigen Browsern und Playern unterstützt wird. Es bietet sich zudem an Ihren Livestream in unterschiedlichen Größen anzubieten. Für die meisten Smartphones ist ein Full-HD Stream einfach überdimensioniert und verbraucht nicht nur unnötig Datenvolumen, sondern belastet auch Ihren Server.

Sicherheit

Sie sollten unbedingt darauf achten Ihren Streaming Server ausreichend gegen unbefugte Fremdnutzung abzusichern. Es wäre fatal wenn irgendjemand einfach so auf Ihrer Firmenwebseite streamt. In der Standardkonfiguration lässt sich in der Regel durch jedermann ein Stream starten. Sie sollten den Server daher zumindest so konfigurieren, dass er nur Streams von einer Ihnen zugeordneten IP zulässt. Unsere Streaming Server verfügen über ein Passwort geschütztes Webinterface über das man seine aktuelle IP vor dem Streamen eingibt. Wenn jemand versucht von einer anderen IP zu streamen wird seine Anfrage vom Server automatisch blockiert.

Der richtige Livestreaming Player

Ihr Livestream sollte auch auf dem Smartphone abrufbar seinWir haben nun unseren Livestreaming Server konfiguriert und können über die Software OBS (Open Broadcaster Software) einen Stream starten. Nun gilt es diesen Stream auf der eigene Webseite wiederzugeben. Je nachdem ob Sie sich für RTMP oder HLS entschieden haben wählen Sie nun einen geeigneten Player aus. Wir haben gute Erfahrungen mit video.js gemacht. Für Content Management Systeme wie WordPress oder Joomla gibt es eine Vielzahl von Plug-ins wie den Spider Web Player oder Flowplayer. Sie sollten Ihren Player auf jeden Fall ausgiebig testen ob das von Ihnen gewählte Format auch wiedergegeben werden kann.Wenn Sie sich für video.js entschieden haben müssen Sie einfach nur die dateien per FTP auf Ihren Webserver hochladen und den Pfad zur .m3u8 Datei auf Ihrem Streaming Server angeben.Das streamen auf der eigenen Webseite hat viele Vorteile, doch wäre es nicht schön, wenn Sie Ihre Inhalte auch gleichzeitig der breiten Masse zur Verfügung stellen? In der Konfiguration Ihres Servers haben Sie die Möglichkeit weitere rtmp server zu hinterlegen. Wenn Sie nun zusätzlich den YouTube Server hinzufügen pushen Sie Ihren Livestream gleichzeitig auf Ihre Webseite und YouTube.

Weitere Denkansätze

Wenn Sie nun schon über einen Livestream auf Ihrer Webseite verfügen sollten Sie darüber nachdenken ob Sie nicht ebenfalls einen Chat implementieren. So könnten Sie mit Ihren Zuschauern kommunizieren und aktiv einbinden. Sollten Sie Fragen haben oder Unterstützung benötigen können Sie uns gerne kontaktieren.

14 Idee über “Livestreaming auf der eigenen Webseite

  1. Uli efkeman sagt:

    Hallo
    Ich brauche ein cod um ein livestraem zu zeigen auf meiner jimbo Internet Seite einbinden um live events zu Übertragung.
    Können sie mir da helfen oder sagen wo ich den HTML cod finde??

    • Pattrick Bluhm sagt:

      Hallo Herr Efkeman,
      je nachdem auf welcher Plattform Sie Streamen benötigen Sie lediglich einen HTML5-Player der Ihren Stream wiedergeben kann. Gerne können Sie mir Ihr derzeitiges setup per E-Mail schicken. info[at]bluhm-webservices.de

      Mit freundlichen Grüßen

      Pattrick Bluhm

  2. Jan-Henrik sagt:

    Moin Moin,
    auch ich muss leider anerkennen, dass es sehr schwierig ist einen Live Feed einzubinden.
    Wie kann ich einen eigenen Podcast (z.B. von Podbean, etc.) einbinden… ? Ist dies überhaupt möglich? Muss ich einen eigenen Server mieten und diesen konfigurieren und von dort aus streamen ?

    Über eine Antwort würde ich mich sehr freuen.

    • Pattrick Bluhm sagt:

      Hallo Jan-Henrik,
      soweit ich das gesehen habe gibt es für Podcasts auf Podbean einen embeddable Player. Dieser kann zumindest die bereits aufgenommen Podcasts auf der eigenen Webseite einbetten und abspielen. Um das ganze Live auf die eigene Webseite zu bringen müsste man prüfen, ob der Stream mit einem HTML5 komtpatiblen Protokoll wie RTMP oder HLS läuft. Dann könnte man einen gewöhnlichen HTML5-Player in die Webseite einbauen und einfach die Quelle des Streams eintragen. Das wäre noch relativ simpel. Sollte das nicht möglich sein, muss man den Stream dann tatsächlich über einen separaten Server laufen lassen der über eine ausreichende Anbindung verfügt. Der würde dann aber nur das Video- und Audiosignal streamen, funktionen wie der Chat wären nicht verfügbar.

      Ich hoffe das hilft dir weiter.

      Beste Grüße

      Pattrick Bluhm

      • Philip sagt:

        Hi,
        was heißt die nötige Anbindung?
        Mal angenommen ich habe einen Server mit Nginx mit HLS Protokol,
        und möchte ihn nun auf meine Webseite einbinden.
        Was braucht es für eine Anbindung, wenn man mit 1000 gleichzeitigen Zuschauern rechnet auf dem Lifestream?

        LG Philip

        • Pattrick Bluhm sagt:

          Hi Philip,
          das kommt ganz darauf an in welcher Qualität gestreamt wird. Ich stell das mal an einem sehr einfachen aber dafür nachvollziehbaren Beispiel dar. Angenommen man nutzt geringe Streaming-Qualität und überträgt Bild/Ton mit insgesamt 3 Mbit/s (3000 kbit/s). Bei 1000 Zuschauern müssen diese 3 MB an jeden Zuschauer ausgeliefert werden. Insgesamt also 3.000 Mbit/s oder 3 Gbit/s. Die meisten Server verfügen jedoch nur über eine 1 Gbit/s Anbindung im Rechenzentrum und diese wird meist noch mit anderen Servern geshared. Der Durchsatz reicht also schlichtweg nicht, um den Stream an alle Zuschauer zu übertragen. Mögliche Lösungen: Entweder den Stream auf verschiedene Server mit einem Load-Balancer verteilen oder direkt ein CDN nutzen, dass den Stream ausliefert. Bei letzterem können auch geografische Verzögerungen durch die meist gute Verteilung der Server überbrückt werden. Beide Varianten sind mit einem nicht unerheblichen Konfigurationsaufwand verbunden und treiben den Preis exponentiell nach oben. Daher ist es in den meisten Fällen die bessere Option einen entsprechenden Streaming-Dienst zu nutzen der die benötigten Ressourcen vorhält und dem Bedarf entsprechend zur Verfügung stellt.

  3. tom früchtl sagt:

    Hallo Herr Bluhm,
    wäre es grundsätzlich möglich nur audio Inhalte auf einer Website live zu streamen?
    Mit besten Grüßen
    Tom Früchtl

    • Pattrick Bluhm sagt:

      Hallo Herr Früchtl,

      das ist ohne Problem möglich. Ich würde dennoch das ganze über einen HTML5 Player laufen lassen und ggf. ein Logo, Titelbild oder ähnliches einbinden, um den Hörern sofort das Thema der Übertragung zu vermitteln.

      Mit freundlichen Grüßen

      Pattrick Bluhm

    • Pattrick Bluhm sagt:

      Hallo Dustin,

      davon würde ich grundsätzlich ohne Erlaubnis der öffentlich rechtlichen abraten. Neben den Inhalten wird ja auch Werbung von Drittfirmen eingeblendet.

      Mit freundlichen Grüßen

      Pattrick Bluhm

Schreiben Sie einen Kommentar

Ihre E-Mail-Adresse wird nicht veröffentlicht.