Añadir el SDK de extensiones de Messenger

El SDK de extensiones de Messenger incorpora valiosas funciones específicas de Messenger a cualquier sitio web o aplicación web que se abra en la vista web de dicha plataforma. Con el SDK, puedes recuperar información sobre el usuario que abrió la vista web, compartir contenido en conversaciones de Messenger y realizar una integración perfecta con la interfaz de usuario de Messenger.

Funciones disponibles

Las siguientes funciones están disponibles en la vista web de Messenger cuando se incluye el SDK de extensiones de Messenger. Ten en cuenta que la disponibilidad real de las funciones puede variar según la versión de Messenger y el dispositivo.

FunciónDescripción

getContext()

Recupera contexto de la conversación, como el PSID del usuario que abrió la vista web.

requestCloseBrowser()

Cierra la vista web y vuelve a la conversación de Messenger.

askPermission()

Solicita permiso para realizar acciones como recuperar la información del perfil de un usuario.

getGrantedPermissions()

Comprueba los permisos concedidos actualmente.

getSupportedFeatures

Comprueba qué funciones son compatibles con la vista web en el dispositivo actual (como el uso compartido).

Para obtener más información sobre cómo usar estas funciones, consulta la referencia del SDK de extensiones de Messenger.

Descargar el SDK

1. Autorizar el dominio

Para usar las extensiones de Messenger en tu bot, primero debes autorizar los dominios desde los que se muestra la página. Por motivos de seguridad, todos los dominios de tu página web tienen que añadirse a la lista de dominios autorizados. Para obtener más información, consulta el documento de referencia sobre las listas de autorizados.

Con la siguiente API puedes añadir fácilmente un dominio a la lista de autorizados mediante programación:

 
curl -X POST -H "Content-Type: application/json" -d '{
  "whitelisted_domains":[
    "https://petersfancyapparel.com"
  ]
}' "https://graph.facebook.com/v21.0/me/messenger_profile?access_token=PAGE_ACCESS_TOKEN"

Cuando esta operación se lleve a cabo correctamente, la API de perfiles de Messenger devolverá esta respuesta:

{"result":"success"}

2. Incluir el SDK para JavaScript de extensiones de Messenger

Añade el SDK para JavaScript de extensiones de Messenger a la página que se está cargando en la vista web con el código siguiente. Debes insertarlo directamente después de la etiqueta de apertura body en todas las páginas donde quieras cargarlo:

(function(d, s, id){
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) {return;}
  js = d.createElement(s); js.id = id;
  js.src = "//connect.facebook.net/en_US/messenger.Extensions.js";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'Messenger'));

3. Esperar a que se complete el evento de carga del SDK

window.extAsyncInit(): se realizará una llamada a este método cuando el SDK para JavaScript de extensiones de Messenger se cargue por completo. Puedes utilizar este método para activar las llamadas a otras funciones disponibles en el SDK.

window.extAsyncInit = function() {
  // the Messenger Extensions JS SDK is done loading 
};

Usar el SDK en el cliente web de Messenger

El SDK de extensiones de Messenger es compatible con clientes de telefonía móvil y de ordenador de Messenger. No obstante, es posible que debas tener en cuenta la siguiente información para que funcione correctamente.

También puedes utilizar la propiedad window.name para comprobar la ubicación del iframe desde el código del cliente.

Cuando se activa el iframe en la web de Messenger, establecemos el valor de window.name como "messenger_ref". De lo contrario, al cargarlo en las pestañas de chat de Facebook, el valor de window.name será "facebook_ref".

Funciones no compatibles

Las siguientes configuraciones o funciones no son compatibles con los clientes web de Messenger. No obstante, funcionan correctamente en los clientes de telefonía móvil de Messenger.

Solución de problemas

Si no puedes llamar al SDK de extensiones de Messenger desde tu página, comprueba lo siguiente:

  • Cuando abras la vista web desde el menú persistente o un botón, asegúrate de que el parámetro messenger_extensions se haya establecido en true. Si un usuario ha abierto la vista web mediante un mensaje compartido, no es obligatorio que haya hablado con tu bot para que funcionen las extensiones de Messenger.
  • Comprueba que hayas autorizado el dominio en el que se aloja la página.

  • Comprueba que el SDK para JavaScript esté incluido en todas las páginas que usan extensiones.

  • Asegúrate de no estar intentando llamar a ninguna función antes de que el SDK haya terminado de cargarse. Utiliza el método window.extAsyncInitque se describe aquí para indicar cuándo termina el proceso de carga.

  • Asegúrate de que la página se muestre a través de https y no incluya puertos que no sean estándar.