Ajout du SDK Messenger Extensions

Le SDK Messenger Extensions offre des fonctionnalités utiles spécifiques à Messenger à tout site ou application web que vous ouvrez dans la webview Messenger. Grâce à ce SDK, vous pouvez récupérer des informations sur la personne qui a ouvert la webview, partager des contenus dans des conversations sur Messenger et parvenir à une plus forte intégration avec l’UI de Messenger.

Fonctionnalités disponibles

Quand vous utilisez le SDK Messenger Extensions, les fonctionnalités suivantes sont disponibles dans la webview de Messenger. Veuillez noter que leur disponibilité actuelle peut varier selon la version de Messenger et de votre appareil.

Fonction	Description
getContext()	Permet de récupérer le contexte de la conversation, par exemple le PSID de la personne qui a ouvert la webview.
requestCloseBrowser()	Permet de fermer la webview et de retourner dans la conversation sur Messenger.
askPermission()	Permet de demander l’autorisation de réaliser certaines actions comme récupérer les informations de profil d’une personne.
getGrantedPermissions()	Permet de vérifier les autorisations actuellement accordées.
getSupportedFeatures	Permet de vérifier les fonctionnalités prises en charge dans la webview sur l’appareil actuellement utilisé, par exemple le partage.

Pour tout savoir sur l’utilisation de ces fonctionnalités, consultez la référence sur le SDK Messenger Extensions.

Installation du SDK

1. Autoriser votre domaine

Pour utiliser Messenger Extensions dans votre bot, vous devez commencer par autoriser les domaines à partir desquels la page est diffusée. Pour des raisons de sécurité, il convient d’ajouter tous les domaines de votre page web aux domaines autorisés. Pour plus d’informations, consultez la documentation sur les autorisations.

Pour programmer l’ajout d’un domaine aux autorisations, rien de plus facile. Utilisez l’API suivante :

 
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"

Lorsque l’opération aboutit, l’API Messenger Profile répondra :

{"result":"success"}

2. Inclure le SDK JavaScript Messenger Extensions

Ajoutez le SDK JavaScript Messenger Extensions à la page en cours de chargement dans la webview avec le code ci-dessous. Mieux vaut l’insérer directement après l’ouverture du tag body sur chacune des pages sur lesquelles vous voulez le charger :

(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. Attendre l’évènement de chargement SDK

window.extAsyncInit() sera appelé lorsque le chargement du SDK JavaScript Messenger Extensions sera terminé. Vous pouvez l’utiliser pour déclencher l’appel d’autres fonctions disponibles dans le SDK.

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

Utilisation du SDK dans le client web Messenger

Le SDK Messenger Extensions est pris en charge sur les clients Messenger de type mobile et ordinateur. Toutefois, pour qu’il fonctionne correctement, vous devrez peut-être envisager ce qui suit.

Vous pouvez également utiliser la propriété window.name pour vérifier l’emplacement du iFrame à partir du code côté client.

Lorsque l’iFrame est déclenché sur le client web Messenger, nous donnons à la propriété window.name la valeur "messenger_ref". Autrement, au moment du chargement des onglets de discussion Facebook, window.name aura pour valeur "facebook_ref".

Fonctionnalités non prises en charge

Aucune prise en charge n’est assurée pour les paramètres ou fonctionnalités suivantes dans les clients web Messenger. Leur fonctionnement persiste dans les clients mobiles Messenger.

webview_height_ratio
webview_share_button
Boutons Retour dans navigation
Titre de boîte de dialogue
Fermeture de la webview via une redirection de l’URL

Dépannage

Si vous ne parvenez pas à appeler le SDK Messenger Extensions depuis votre page, envisagez ce qui suit :

Lorsque vous ouvrez la webview depuis le menu fixe ou un bouton, assurez-vous que le paramètre messenger_extensions est défini sur true. Si un·e utilisateur·ice a ouvert la webview via un message partagé, il n’est pas indispensable qu’une conversation ait eu lieu avec votre bot pour garantir le fonctionnement de Messenger Extensions.
Vérifiez que vous avez bien autorisé le domaine sur lequel la page est hébergée.
Vérifiez que le SDK JavaScript est bien inclus sur chacune des pages qui utilise les extensions.
Assurez-vous que vous n’essayez pas d’appeler des fonctions avant la fin du chargement du SDK. Utilisez la fonction window.extAsyncInitdécrite ici pour savoir lorsque le chargement est terminé.
Assurez-vous que la page est diffusée sur https et qu’elle n’inclut aucun port non standard.