Come incorporare una diretta streaming nel tuo sito web

Perché RTSP non funziona in un browser

RTSP è progettato per controllare il video in streaming, ma i browser moderni non possono riprodurre direttamente il protocollo. Se incolli un link RTSP nell'HTML o lo apri come un normale indirizzo, sulla pagina non comparirà alcun video.

Per mostrarlo sul web, lo streaming deve essere ricevuto, preparato in un formato compatibile e distribuito allo spettatore tramite un web player. Questo è il compito svolto da rtsp.me.

Cosa ottieni

• Codice già prontoCodice HTML del player da inserire in una pagina
• Adattamento dello streamingRiproduzione nei browser web moderni
• Dispositivi mobiliVisualizzazione ottimizzata per telefoni e tablet
• StatisticheAccesso del proprietario alle statistiche di visita dello streaming

Non dovrai creare da solo un player né mantenere un sistema separato di conversione video.

Passaggio 1. Prepara lo streaming

Per prima cosa aggiungi la telecamera IP su rtsp.me e attendi che il video parta correttamente. Se la telecamera non è ancora collegata, segui la guida "Come creare una diretta streaming su un sito web".

1. Apri rtsp.me e accedi al tuo account.
2. Seleziona la telecamera che hai collegato.
3. Assicurati che l'immagine sia disponibile e che lo streaming funzioni in modo stabile.
4. Apri le impostazioni di incorporamento o il codice del player.

Passaggio 2. Ottieni il codice HTML

rtsp.me genera un frammento HTML già pronto per lo streaming selezionato. Copialo per intero senza modificare l'indirizzo del player o i parametri del servizio.

Il codice funziona su un semplice sito HTML, in un template CMS o nel blocco HTML personalizzato di un website builder, a condizione che la piattaforma consenta di incorporare player esterni.

Esempio di codice HTML

<iframe
  src="https://rtsp.me/embed/WKZb7jUsUw5T9N4f/"
  style="width:100%; aspect-ratio:4/3; border:0;"
  title="RTSP streaming player"
  allow="fullscreen; autoplay"
  allowfullscreen>
  Iframes not supported. Stream <a href="https://rtsp.me/"
    title="rtsp video streaming service">rtsp.me</a> player
</iframe>

Il tuo codice funzionante conterrà l'indirizzo del tuo streaming personale. Non sostituirlo con l'identificatore dimostrativo WKZb7jUsUw5T9N4f.

Come appare il player incorporato

Passaggio 3. Inserisci il codice

1. Apri la pagina in cui deve comparire lo streaming.
2. Passa alla modalità di modifica HTML o aggiungi un blocco per codice incorporato.
3. Incolla il codice del player dove ti serve.
4. Salva e pubblica la pagina.
5. Verifica che il video parta nel browser sia su desktop sia su telefono.

Una volta caricata la pagina pubblicata, il player si connette a rtsp.me e inizia a riprodurre lo streaming disponibile.

Browser e dispositivi mobili

rtsp.me ottimizza lo streaming sorgente non solo per i browser desktop ma anche per i dispositivi mobili. Il visitatore non deve installare software di visualizzazione RTSP né inserire alcuna credenziale della telecamera.

Il player responsive può essere inserito in un contenitore della pagina in modo che la sua larghezza si adatti allo schermo. Dopo la pubblicazione, verifica sia l'orientamento verticale sia quello orizzontale su un telefono, e la pagina con una connessione mobile lenta.

La qualità di visualizzazione dipende anche dalle impostazioni della telecamera e dalla velocità di upload disponibile sul posto. I consigli sono nella pagina "Impostazioni consigliate per la telecamera IP".

Statistiche di visita

Il proprietario dello streaming ha accesso alle statistiche di visita. Ti aiutano a valutare l'interesse del pubblico e a monitorare come viene utilizzato il player sul sito.

Le statistiche sono disponibili nell'interfaccia di rtsp.me. Le metriche mostrate possono dipendere dalle impostazioni dello streaming e dal piano utilizzato.

Integrazione sicura tramite PHP

Il semplice codice HTML va bene per uno streaming pubblico. Se il video è destinato solo a clienti registrati, personale o utenti, il player può essere collegato tramite codice PHP lato server.

In questa configurazione il tuo server verifica prima i permessi dell'utente e poi gli genera un link unico per il player. Il link viene creato separatamente per ogni visitatore e non viene memorizzato in modo permanente nell'HTML pubblico della pagina.

1. L'utente accede al proprio account sul tuo sito.
2. Il codice PHP verifica se la visualizzazione è consentita per lui.
3. Il server genera un link personale usando i parametri di integrazione di rtsp.me.
4. La pagina passa il link al player solo per quell'utente.

Un confronto tra l'integrazione PHP, i domini autorizzati, una password, il blocco IP e l'accesso basato su account è nella guida "Come proteggere una diretta streaming dalla copia".

Domande frequenti