Se actualizó este documento.
La traducción en español no está disponible todavía.

Actualización del documento en inglés: 23 dic. 2019

API del reproductor de video insertado

La API del reproductor de video insertado permite controlar este reproductor y observar los eventos que activa. Por ejemplo, puedes escuchar el evento cuando un video se pausa o iniciar la reproducción de un video con un botón personalizado.

Para empezar, sigue estas secciones:

Configuración
Controles del reproductor
Suscribirse a eventos
Referencia sobre los controles del reproductor

Configuración

1. Configurar el plugin

Consulta la documentación del reproductor de video insertado para obtener información sobre cómo configurar el plugin.

2. Obtener la instancia de la API del reproductor de video insertado

Para obtener la instancia de la API del reproductor de video insertado, escucha xfbml.ready. Si el valor de type del mensaje es video, esto indica que el reproductor de video insertado activó el evento ready.

var my_video_player;
FB.Event.subscribe('xfbml.ready', function(msg) {
  if (msg.type === 'video') {
    my_video_player = msg.instance;
  }
});

3. Ejemplo de código completo

En el ejemplo de código siguiente, se asume que el SDK de Facebook para JavaScript se inicializa con un identificador de la app. Si aún no lo tienes, consulta la documentación sobre cómo crear un identificador de la app.

En el siguiente ejemplo de código, se reemplaza {your-app-id} con el identificador de la app y data-href con la URL del video. Asegúrate de comprobar el evento xfbml.ready tras llamar a la función FB.init().

<html>
<head>
  <title>Your Website Title</title>
</head>
<body>

  <!-- Load Facebook SDK for JavaScript -->
  <script>
    window.fbAsyncInit = function() {
      FB.init({
        appId      : '{your-app-id}',
        xfbml      : true,
        version    : 'v3.2'
      });
    
      // Get Embedded Video Player API Instance
      var my_video_player;
      FB.Event.subscribe('xfbml.ready', function(msg) {
        if (msg.type === 'video') {
          my_video_player = msg.instance;
        }
      });
    };
  </script>
  <div id="fb-root"></div>
  <script async defer src="https://connect.facebook.net/en_US/sdk.js"></script>

  <!-- Your embedded video player code -->
  <div  
    class="fb-video" 
    data-href="https://www.facebook.com/facebook/videos/10153231379946729/" 
    data-width="500" 
    data-allowfullscreen="true"></div>

</body>
</html>

Administrar varios reproductores

Si usas varios reproductores de video en una página, para identificar a uno de ellos, agrega un atributo id a la etiqueta correspondiente y comprueba su valor id en el objeto msg:

<div id="my-video-player-id" ... />
<script>
FB.Event.subscribe('xfbml.ready', function(msg) {
  if (msg.type === 'video' && msg.id === 'my-video-player-id') {
     // True for <div id="my-video-player-id" ...
     my_video_player = msg.instance;
  }
});
</script>

Controles del reproductor

Si lo deseas, puedes llamar a un conjunto de funciones para controlar el reproductor de video u obtener su estado actual (por ejemplo, la posición de reproducción actual).

Ejemplos de uso

// Start video playback
my_video_player.play();

// Check whether video is muted
if (my_video_player.isMuted()) {
  // Video is muted
}

// Jump to second 5 of the video
my_video_player.seek(5);

Referencia sobre los controles del reproductor

Suscribirse a eventos

La función subscribe() agrega una función de escucha para un evento especificado (por ejemplo, startedPlaying).

var myEventHandler = my_video_player.subscribe('startedPlaying', function(e) {
  // Video started playing ...
});

Eliminar las suscripciones de evento

La función subscribe() devuelve un token con un método release y, cuando lo llamamos, se elimina la función de escucha del evento.

myEventHandler.release('startedPlaying');

Referencia sobre los eventos

Referencia sobre los controles del reproductor

Si lo deseas, puedes llamar a un conjunto de funciones para controlar el reproductor de video u obtener su estado actual (por ejemplo, la posición de reproducción actual).

Función	Descripción	Argumentos (tipo)
`play()`	Reproduce el video.
`pause()`	Pausa el video.
`seek(seconds)`	Busca la posición especificada.	`seconds` (`number`)
`mute()`	Silencia el video.
`unmute()`	Activa el sonido del video.
`isMuted()`	`true` si el video está silenciado. En caso contrario, `false`.
`setVolume(volume)`	Configura el volumen en el número especificado (`float`, en una escala de `0` a `1`).	`volume` (`float`)
`getVolume()`	Devuelve el volumen actual del video (`float`, en una escala de `0` a `1`).
`getCurrentPosition()`	Devuelve la posición de tiempo del video actual en segundos.
`getDuration()`	Devuelve la duración del video en segundos.
`subscribe(event, eventCallback)`	Agrega una función de escucha para el evento especificado. Para obtener más información sobre los eventos, consulta la sección Suscribirse a eventos. Devuelve un token con un método `release` que, al llamarse, elimina la función de escucha del evento.	`event` (`string`), `eventCallback` (`function`)

Referencia sobre los eventos

Evento	Descripción
`startedPlaying`	Se activa cuando se inicia la reproducción del video.
`paused`	Se activa cuando se pausa el video.
`finishedPlaying`	Se activa cuando se completa la reproducción del video.
`startedBuffering`	Se activa cuando se inicia el almacenamiento en búfer del video.
`finishedBuffering`	Se activa cuando se recupera el video del almacenamiento en búfer.
`error`	Se activa cuando se produce un error en el video.