YouTube iframe: errore X-Frame-Options e live chat

YouTube iframe: errore X-Frame-Options e live chat non visibile

Giuseppina De Guglielmo
Settembre 21, 2022
Senza categoria

Se provi a incorporare un video YouTube usando direttamente l’URL della pagina youtube.com/watch?v=..., il browser può rifiutare il caricamento nell’iframe e mostrare errori legati a X-Frame-Options o alle policy di sicurezza.

La soluzione è usare gli URL pensati appositamente per l’embed.

Video YouTube: usa l’URL /embed/

Per un video normale, l’URL corretto ha questa forma:

https://www.youtube.com/embed/VIDEO_ID

Dove VIDEO_ID è l’identificativo del video presente nell’URL originale.

Live chat YouTube: serve embed_domain

Per incorporare la chat di un live stream devi usare l’endpoint live_chat e indicare il dominio esatto sul quale verrà mostrata:

https://www.youtube.com/live_chat?v=VIDEO_ID&embed_domain=www.example.com

Il valore di embed_domain deve corrispondere al dominio della pagina che contiene l’iframe. Se non coincide, la chat non si apre.

<!-- video YouTube -->
<iframe height="315" width="500" src="https://www.youtube.com/embed/VIDEO_ID"></iframe>

<!-- chat di una live YouTube -->
<iframe height="300" src="https://www.youtube.com/live_chat?v=VIDEO_ID&embed_domain=iltuodominio.com" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"></iframe>

<!-- VIDEO_ID è l'id del tuo video, iltuodominio.com il dominio della pagina che contiene l'iframe -->

Attenzione al mobile

YouTube specifica che la live chat incorporata non è disponibile sul web mobile. Se stai progettando una pagina per smartphone, conviene prevedere un’alternativa o un link diretto alla live.

Perché compare X-Frame-Options

Non tutti gli URL possono essere caricati dentro un iframe. Il sito che fornisce il contenuto può decidere, tramite header di sicurezza, se e dove consentirne l’incorporamento.

Per questo non conviene “forzare” il browser o tentare di aggirare l’header: bisogna usare l’URL di embed previsto dal servizio.

Se devi integrare video, chat, widget o servizi esterni in un progetto web, trovi anche i miei servizi di sviluppo e integrazione.

Giuseppina De Guglielmo

Sviluppatrice WordPress con oltre 15 anni di esperienza nel digitale, specializzata nella creazione di temi e plugin su misura. Aiuto freelance e aziende a trasformare il loro sito web in uno strumento efficace per crescere, farsi trovare e vendere di più online.

contattami

Hai bisogno di aiuto con il tuo sito WordPress?

Contattami per una consulenza personalizzata e scopri come posso aiutarti a migliorare performance, sicurezza e visibilità del tuo sito.

Qualche feedback

Dicono di me

★★★★★“Giuseppina ci ha aiutato a fare chiarezza tra i plugin dei nostri forms, intervenendo sul codice dove serviva e fornendoci ottimi consigli per proseguire con lo sviluppo del sito. Sempre disponibile, precisa e professionale.”

★★★★★“È stata comprensiva, paziente e sempre chiara nelle sue spiegazioni. Ha ascoltato le mie esigenze e seguito le mie indicazioni, suggerendomi in base alla sua esperienza cosa avrebbe funzionato e cosa no.”

★★★★★“Giuseppina è il top nel settore, precisa nel rispondere alle esigenze dei suoi clienti, la sua competenza traspare in ogni fase del lavoro.”

★★★★★“Ha carpito sin da subito le mie esigenze e le ha tradotte in un supporto professionale ricco di significato.”

★★★★★“Se cercate un professionista affidabile, preciso, competente e veloce affidatevi senza nessun dubbio a Giuseppina. Riuscirà a trovare la soluzione migliore per voi con competenza e professionalità.”