Si votre app a très peu de rafraîchissements de page (c’est-à-dire que le contenu est remplacé côté client sans rechargement de page) et beaucoup de JS asynchrone, vous devrez intégrer Intercom d’une manière légèrement différente pour garantir que les données de vos clients sont à jour et qu’ils reçoivent tout votre contenu sortant (messages, visites guidées, etc.).
Voici ce que nous suggérons :
Tout d’abord, incluez le fichier de la bibliothèque JS d’Intercom dans l’élément head de votre HTML.
(function(){var w=window;var ic=w.Intercom;if(typeof ic==="function"){ic('reattach_activator');ic('update',w.intercomSettings);}else{var d=document;var i=function(){i.c(arguments);};i.q=[];i.c=function(args){i.q.push(args);};w.Intercom=i;var l=function(){var s=d.createElement('script');s.type='text/javascript';s.async=true;s.src='https://widget.intercom.io/widget/' + APP_ID;var x=d.getElementsByTagName('script')[0];x.parentNode.insertBefore(s,x);};if(w.attachEvent){w.attachEvent('onload',l);}else{w.addEventListener('load',l,false);}}})();
Important : Si vous copiez le snippet de code ci-dessus, assurez-vous de changer manuellement votre ID de workspace (appelé APP_ID dans le code).
Ensuite, une fois que vous avez un utilisateur connecté sur votre site (après qu’il se soit authentifié et que vous ayez ses informations), vous appelez window.Intercom('boot', {user_data}), où user_data contient toutes les données sur l’utilisateur. Veuillez vous assurer d’envoyer le user_id et/ou l’email à chaque appel pour mettre à jour vos users. Cela enverra les détails de l’utilisateur connecté à Intercom et vérifiera les nouveaux messages à afficher à l’utilisateur.
Un exemple de cela pour les visiteurs non connectés serait :
window.Intercom('boot', {
app_id: 'abc12345',
custom_launcher_selector: '#my_custom_link'
});
Important : Si vous copiez le snippet de code ci-dessus, assurez-vous de changer manuellement votre ID de workspace (appelé APP_ID dans le code).
Ensuite, lorsque vous souhaitez les connecter ou les convertir en user, il suffit de modifier la méthode boot pour inclure leurs informations utilisateur :
window.Intercom('boot', {
app_id: 'abc12345',
email: 'example@example.com',
user_id: 'abc123',
created_at: 1234567890,
custom_launcher_selector: '#my_custom_link'
});Important : Si vous copiez le snippet de code ci-dessus, assurez-vous de changer manuellement votre ID de workspace (appelé APP_ID dans le code).
Installer Intercom avec Google Tag Manager
Utiliser Intercom avec des frameworks JavaScript
Les applications monopages sont souvent construites avec des frameworks et bibliothèques JavaScript. Intercom ne dispose pas d’une liste prescrite de frameworks JavaScript maintenus ou supportés pour les packages tiers.
Informer Intercom lorsque vos données ou URL changent
Il y a deux appels supplémentaires que vous pourriez avoir besoin d’utiliser dans votre app.
Si les données de votre user changent, ou si vous modifiez l’URL d’une manière quelconque sans rechargement de page, vous devez appeler window.Intercom('update', {user_data}), où user_data est un ensemble de modifications des données utilisateur.
Important : Un appel de mise à jour simule un rafraîchissement de page, ce qui pousse Intercom à vérifier les nouveaux messages ou visites guidées à envoyer au client.
Vous n’avez besoin d’inclure que ce qui a changé — vous n’avez pas besoin d’inclure toutes les données utilisateur à chaque mise à jour. Cependant, vous devez toujours envoyer le user_id et/ou l’email.
Vous utilisez la fonction update comme ceci (assurez-vous de changer votre app_id) :
Vous démarrez l’utilisateur comme normal :
window.Intercom('boot', {app_id: APP_ID, email: 'someuser@example.com', apples: 1});Si les données de l’utilisateur changent, ou s’il vient de provoquer un changement de « page », vous appelez :
window.Intercom('update', {email: 'someuser@example.com', apples: 2});avec toutes les nouvelles données utilisateur.
Important : Vous devrez appeler Intercom("update") avec de nouvelles données utilisateur pour initier un « ping » à chaque changement d’URL. Si aucune donnée utilisateur n’a changé, vous pouvez envoyer l’heure actuelle comme valeur pour 'last_request_at' comme ceci :
Intercom("update", {last_request_at: parseInt((new Date()).getTime()/1000)})
Si l’URL change sans rechargement complet de la page, le Messenger Intercom n’envoie pas automatiquement les changements d’URL à Intercom pour faire correspondre les messages basés sur les URL.
L’appel de mise à jour est limité à 20 fois par user et par page sans être limité. Si vous dépassez ce taux, vous serez limité et le quota de 20 appels sera réinitialisé toutes les 30 minutes. Un rafraîchissement ou rechargement de page réinitialisera cela.
Nous recommandons de ne mettre à jour que lorsque des changements de données utilisateur sont envoyés à Intercom, ce qui pourrait déclencher un message automatique pour cette raison.
Comment terminer une session
Intercom vous permet de mettre le Messenger Intercom sur n’importe quel site public que vous possédez (votre site marketing, votre site de documentation, votre hub développeur, etc.). Pour maintenir la continuité des conversations sur tous ces sous-domaines potentiellement différents pendant que vos users sont connectés, nous plaçons un cookie dans le navigateur de votre user. Ce cookie expire après une semaine.
Tout utilisateur qui utilise un ordinateur et un navigateur partagés avec quelqu’un d’autre pourra voir l’historique des conversations de l’utilisateur le plus récemment connecté jusqu’à l’expiration du cookie. Pour cette raison, il est très important de bien fermer Intercom lorsque la session d’un user sur votre app se termine (via une déconnexion manuelle ou automatique).
Voici comment fermer Intercom :
Vous aurez déjà commencé à suivre votre user via le snippet JS d’Intercom ou la méthode « boot ».
Lorsque votre user se déconnecte d’Intercom (ou est automatiquement déconnecté par votre app), appelez
Intercom('shutdown');depuis notre API JavaScript, pour terminer la session Intercom et effacer le cookie.Si nécessaire, appelez
Intercom('boot', {app_id: 'YOUR_APP_ID'})pour démarrer une nouvelle session.
Important : Assurez-vous de changer app_id dans le code avec votre propre ID de workspace.
La méthode Intercom('shutdown'); réinitialisera automatiquement Intercom à un état propre pour connecter un autre user ou démarrer Intercom pour les zones déconnectées de votre application.
Activer la vérification d’identité dans une application monopage
Pour activer la vérification d’identité sur votre application monopage, vous devez ajouter l’attribut user_hash à votre appel boot.
Lors de la mise en œuvre de l’identification utilisateur dans votre application, suivez ces directives importantes :
N’identifiez les users à Intercom qu’après qu’ils ont été authentifiés et connectés à votre application.
Pour les users non connectés (visiteurs), incluez uniquement l’app_id dans votre configuration.
Ne codez jamais en dur les informations utilisateur — remplissez-les toujours dynamiquement après authentification.
Plus de détails sont disponibles ici.
Note : Sans la sécurité du Messenger, vos users ne verront que les 14 derniers jours d’historique de conversation dans le Messenger. En savoir plus →