Webcam kaufen

Teil 11: Wie Webcam in Website integrieren?

Planen Sie Ihre eigene Webcam! Die Serie.

Es bestehen unzählige Möglichkeiten eine Webcam in eine Website zu integrieren. Entscheidend ist wie viele Seitenbesucher gleichzeitig erwartet werden und ob ein Live Stream oder nur Standbilder veröffentlicht werden. Bei Standbildern spielt die Anzahl paralleler Seitenbesucher eine untergeordnete Rolle, einen Live Stream integriert man mit Vorteil mit einem Streaming Service. Wird der Live Stream direkt ab der Webcam in die Website integriert muss pro Besucher ein Stream bereitgestellt werden. Dies erfordert mehr Bandbreite und die Bildfrequenz kann auch langsamer werden. Wichtig: Je nach Hersteller und Kamera sind mehrfach parallele Streams auf 1 bis 20 parallele Betrachter begrenzt. Will man zudem die Webcam über 3G/4G anschliessen kommt die Grenze des Mobilfunk Abonnements dazu. Je mehr parallele Nutzer desto mehr Bandbreite wird benötigt. Die meisten Mobilfunk Abos sind auf 5 bis 10 GByte pro Monat begrenzt. Nachstehend ein paar Beispiele wie Webcams integriert werden können.

Webcam Live Stream direkt ab Kamera

Lösung:

  • Die Webcam ist via Portweiterleitung direkt am Internet angeschlossen
  • Das aktuelle JPG Bild wird kontinuierlich nachgeladen und angezeigt
  • Nach n-Sekunden wird der Live Stream gestoppt. Damit lässt sich die Nutzung kontrollieren.
  • Mit Vorteil wird für diese Anwendung eine Axis Kamera verwendet. Die Limite der parallelen Streams liegt bei ca. 20


Anmerkung: das Livebild stoppt automatisch nach 30 Sekunden

Download: kostenloses WordPress Plugin für Live Webcam Integration

Webcam Live Stream via Streaming Service

Lösung:

  • Mit Vorteil den H.264 Stream ab Kamera nutzen. Der H.264 Stream erscheint flüssiger als das Nachladen von Einzelbildern JPG.
  • Das folgende Beispiel basiert auf H.264 über RTSP. Eine zweite Variante wäre MJPEG über HTTP
    Kamera Stream: rtsp://<öffentliche IP-Adresse der Kamera>/axis-media/media.amp?streamprofile=c2s
    Das Streamprofile „c2s“ wurde in der Kamera auf H.264 mit der Auflösung: 480×360 Pixel konfiguriert.
  • Der Kamera Stream wird http://www.angelcam.com gestreamt
  • Der angelcam.com (vormals click2stream.com) Stream kann wie folgt integriert werden:
    Embedding Code: <script src=“//avisec-webcam.click2stream.com/?type=javascript&amp;width=480&amp;height=360″ async=““ type=“text/javascript“></script><div id=“player_avisec-webcam“></div>

 

Webcam Standbild und Zeitraffer via Hosting Service

Lösung:

  • Die Webcam wird via teleport.nu veröffentlicht
  • Die Kamera sendet in regelmässigen Abständen zwischen 1 Sekunde und n-Minuten, Aufnahmen via FTP. Diese Variante erfodert keine öffentliche IP-Adresse
  • Der Teleport Service lädt in einem vorgegebenen Intervall Aufnahmen direkt ab Kamera nach. Diese Variante setzt voraus, dass die Kamera eine öffentliche IP-Adresse oder via Portweiterleitung erreichbar ist.
    Kamera Adresse: http://<IP-Adresse der Kamera>:<Port>/axis-cgi/jpg/image.cgi?resolution=1280×960
  • Die Kamera kann einfach via ein iFrame in die Webseite integriert werden
    Embedding Code: <iframe src=“//www.teleport.nu/feed-player/91n20ajzkowf8kz0suftwyrqknjjfe0ikhkgq5eqa?&amp;showsplashbadge=false“ width=“480″ height=“360″ frameborder=“0″ allowfullscreen=“allowfullscreen“></iframe>

Webcam Standbild direkt ab Kamera

Lösung 1:

  • Die  Webcam sendet in regelmässigen Abständen via FTP Aufnahmen auf den Webserver
  • Das Bild wird mit jedem Neuladen der Seite aktualisiert

Webcam Busslingen - Rugghölzli 2, 5455 Remetschwil, Schweiz

Lösung 2:

  • Das aktuelle Bild wird direkt ab der Kamera geladen. Im folgenden Beispiel eine Axis Kamera
  • <img title=““ src=“<öffentliche IP-Adresse der Kamera>/axis-cgi/jpg/image.cgi?resolution=800×450″ />

Webcam Busslingen - Rugghölzli 2, 5455 Remetschwil, Schweiz

Mehr Informationen rund um Webcams im Teil 12 – Wie Kamera Frontglas reinigen oder zurück zur Übersicht

Weitere Angaben unter Webcam Software oder Download WordPress Webcam Plugin zur Integration von Webcams.

0 Kommentare

Dein Kommentar

Want to join the discussion?
Feel free to contribute!

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.