Descripción general
En este documento se explica cómo insertar un reproductor de YouTube en una aplicación y se definen los parámetros disponibles en el reproductor incorporado de YouTube.
Si agregas parámetros a la URL del iframe, puedes personalizar la
experiencia de reproducción en tu aplicación. Por ejemplo, puedes
reproducir videos automáticamente con el parámetro
autoplay o hacer que un video se reproduzca de forma repetida
con el parámetro
loop. También puedes usar el parámetro
enablejsapi para permitir que el reproductor se controle a
través de la
API de IFrame Player.
En esta página se definen todos los parámetros admitidos en cualquier reproductor incorporado de YouTube. En la definición de cada parámetro se identifican los reproductores compatibles con el parámetro correspondiente.
Nota::
https://www.youtube.com/embed? listType=playlist &list=PLC77007E23FF423C6
Cómo
incorporar un reproductor de YouTube
Puedes usar cualquiera de los siguientes métodos para incorporar un reproductor de YouTube en tu aplicación e indicar los parámetros del reproductor. Ten en cuenta que en las instrucciones a continuación se demuestra cómo incorporar un reproductor que carga solamente un video. En la siguiente sección, se explica cómo configurar el reproductor para cargar una playlist o los videos subidos por un usuario.
Cómo
incorporar un reproductor con una etiqueta
<iframe>
Define una etiqueta <iframe>
en tu aplicación en la que la URL de
src especifique el contenido que cargará el reproductor, así como
cualquier otro parámetro del reproductor que desees establecer. Los
parámetros height y
width de la etiqueta
<iframe> especifican las
dimensiones del reproductor.
Si creas el elemento <iframe>
por tu cuenta (en lugar de usar la API de IFrame Player para crearlo),
puedes agregar parámetros del reproductor directamente al final de la
URL. La URL tiene el siguiente formato:
https://www.youtube.com/embed/VIDEO_ID
La etiqueta <iframe> que
se muestra a continuación cargaría un reproductor de 640 x 360 px que
reproduciría el video de YouTube
M7lc1UVf-VE. Dado que la URL establece el parámetro
autoplay en
1, el video se reproducirá
automáticamente una vez que se cargue el reproductor.
<iframe id="ytplayer" type="text/html" width="640" height="360" src="https://www.youtube.com/embed/M7lc1UVf-VE?autoplay=1&origin=http://example.com" frameborder="0"></iframe>
Cómo incorporar un reproductor con la API de IFrame Player
Sigue las
instrucciones de la API del reproductor de IFrame para incorporar un
reproductor de video en tu página web o aplicación luego de que finalice
la carga del código JavaScript de la API del reproductor. El segundo
parámetro del constructor del reproductor de video es un objeto que
especifica las opciones del reproductor. Dentro de ese objeto, la
propiedad playerVars
identifica los parámetros del reproductor.
El siguiente código HTML y JavaScript muestra un ejemplo simple que
inserta un reproductor de YouTube en el elemento de la página que tiene
un valor id de
ytplayer. La función
onYouTubePlayerAPIReady()
especificada aquí se llama automáticamente cuando se carga el código de
la API de IFrame Player. Este código no define ningún parámetro del
reproductor ni tampoco otros controladores de eventos.
<div id="ytplayer"></div>
<script>
// Load the IFrame Player API code asynchronously.
var tag = document.createElement('script');
tag.src = "https://www.youtube.com/player_api";
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
// Replace the 'ytplayer' element with an <iframe> and
// YouTube player after the API code downloads.
var player;
function onYouTubePlayerAPIReady() {
player = new YT.Player('ytplayer', {
height: '360',
width: '640',
videoId: 'M7lc1UVf-VE'
});
}
</script>
Selecciona el contenido que quieres reproducir
Puedes configurar el reproductor integrado para que cargue un video, una playlist o los videos que subió un usuario.
Estas opciones se explican en la siguiente lista:
- Cómo cargar un video
En el caso de una incorporación de IFrame, el ID del video de YouTube que deseas cargar se especifica en la URL de
srcdel IFrame.https://www.youtube.com/embed/VIDEO_ID
Si usas la API de datos de YouTube (v3), puedes construir estas URL de manera programática al recuperar los ID de video desde los resultados de la búsqueda, recursos de elementos de la lista de reproducción, recursos de video u otros recursos. Después de obtener un ID de video, reemplaza el texto
VIDEO_IDen las URLs anteriores por ese valor para crear la URL del reproductor. - Cómo cargar una playlist
Establece el parámetro del reproductor
listTypeenplaylist. Además, establece el parámetro del reproductorlisten el ID de la playlist de YouTube que deseas cargar.https://www.youtube.com/embed?listType=playlist&list=PLAYLIST_ID
Ten en cuenta que es necesario anteponer las letras
PLal ID de la lista de reproducción como se muestra en el siguiente ejemplo:https://www.youtube.com/embed?listType=playlist&list=PLC77007E23FF423C6
Si usas la API de datos de YouTube (v3), puedes construir estas URL de manera programática al recuperar los ID de la lista de reproducción desde los resultados de la búsqueda, recursos de canal o recursos de actividad. Después de obtener un ID de playlist, reemplaza el texto
PLAYLIST_IDen la URL anterior por ese valor. - Cómo cargar los videos subidos por un usuario
Establece el parámetro del reproductor
listTypeenuser_uploads. Además, configura el parámetro del reproductorlistcon el nombre de usuario de YouTube cuyos videos subidos deseas cargar.https://www.youtube.com/embed?listType=user_uploads&list=USERNAME
Iframe youtube autoplay codigo Fuente de informacion de ediciones i frame https://es.stackoverflow.com/questions/313519/iframe-youtube-autoplay
<iframe width="100%" height="100%" src="https://www.yout-ube.com/embed/8UWkpgd8YJQ?autoplay=1&muted=1" frameborder="0" allow="autoplay" encrypted-media" allowfullscreen></iframe>
ejecutar el autoplay agregando a la
url los parametros ?autoplay=1&mute=1&loop=1. Para que la
reproducción automática funcione es obligación que el vídeo se
reproduzca sin audio.