Kit de développement logiciel pour les extensions d'appel

Le kit de développement logiciel pour les extensions d'appel permet aux applications de proposer une option d'appel personnalisée pour les utilisateurs HubSpot directement à partir d'une fiche d'informations dans le CRM. 

Une extension d'appel comprend trois éléments principaux :

1. le kit de développement logiciel pour les extensions d'appel, un kit de développement logiciel pour JavaScript qui permet la communication entre votre application et HubSpot ;
2. les points de terminaison des paramètres d'appel, qui sont utilisés pour définir les paramètres d'appel pour votre application. Chaque compte HubSpot qui connectera votre application utilisera ces paramètres ;
3. l'iFrame d'appel, qui est l'endroit où votre application apparaît pour les utilisateurs HubSpot et est configuré à l'aide des points de terminaison des paramètres d'appel.

Pour plus d'informations sur l'expérience d'appel dans l'application, consultez cet article de base de connaissances. Une fois que votre application compatible avec les extensions d'appel est connectée à HubSpot, elle apparaîtra comme option dans le sélecteur d'appel lorsque un utilisateur effectue un appel depuis HubSpot.

Le kit de développement logiciel pour les extensions d'appel est une bibliothèque JavaScript utilisée pour communiquer entre HubSpot et votre application d'appel, qui apparaîtra dans un iFrame. Cette communication comprend les éléments suivants :

• HubSpot indique à votre application le numéro à appeler.
• Votre application indique à HubSpot lorsque l'appel est démarré et qu'il est terminé.
• HubSpot indique à votre application l'ID d'engagement de variable qui doit être mis à jour avec les détails de l'appel.

Vous trouverez le kit de développement logiciel dans ce répertoire GitHub ainsi que les exigences techniques et les détails d'utilisation pour le kit de développement logiciel dans votre application web.

Les extensions d'appel sont configurées dans le cadre d'une application HubSpot. Si vous n'avez pas d'application, vous pouvez en créer une depuis votre compte de développeur HubSpot. Si vous n'avez pas encore de compte de développeur HubSpot, vous pouvez vous inscrire ici.

Une fois que vous avez configuré les paramètres d'appel pour votre application, qui est une tâche ponctuelle, ces paramètres s'appliqueront à tous les utilisateurs qui connecteront l'application à leur compte HubSpot. Consultez l'onglet Points de terminaison pour obtenir des détails sur la création de ces paramètres.

Une fois que vos paramètres d'appel sont prêts, les utilisateurs doivent procéder à la connexion à l'application afin de mettre à disposition votre service d'appel sur leur compte HubSpot. 

Les appels effectués à l'aide des extensions passent par les étapes suivantes :

1. L'utilisateur clique sur l'icône Appel sur une fiche d'informations de CRM.
2. L'utilisateur sélectionne votre application comme fournisseur d'appels et clique sur le bouton Appel depuis le navigateur.
3. Un iFrame s'ouvre vers l'URL spécifiée dans les paramètres d'appel de votre application.
4. L'appel est terminé via votre application (affichée dans l'iFrame).
5. HubSpot crée un engagement de variable et envoie l'ID de cet engagement à votre application par le biais du kit de développement logiciel pour les extensions d'appel.
6. Votre application met à jour l'engagement de variable avec les détails complets de l'appel.

Une fois qu'un utilisateur a connecté votre application à HubSpot, celle-ci apparaîtra comme option supplémentaire lors d'un appel depuis une fiche d'informations. Lorsque les utilisateurs cliquent sur l'icône Appel, la possibilité de passer l'appel en utilisant votre application plutôt que le système d'appel par défaut de HubSpot apparaîtra. 

Découvrez-en davantage sur la réalisation d'appels depuis HubSpot. 

Lorsque l'utilisateur choisit de passer l'appel via son navigateur, un iFrame s'ouvre vers l'URL spécifiée dans les paramètres d'appel pour votre application. Cette URL doit indiquer une application web personnalisée qui passera l'appel via votre service d'appel. En utilisant le kit de développement logiciel pour les extensions d'appel, votre application communiquera avec l'application HubSpot. Les messages provenant de l'application HubSpot indiqueront à votre application le numéro à appeler et votre application pourra envoyer des messages pour des événements tels que la fin de l'appel ou la déconnexion d'un utilisateur de votre service.

Lors de la création de votre application, il est important de tenir compte des points suivants :

• Vous devez disposer d'une application web qui peut être affichée dans un iFrame, car HubSpot ne traitera aucun contenu de l'iFrame. Ainsi, vous ne pouvez pas définir l'URL de l'iFrame sur un service SIP secondaire.
• Les paramètres de hauteur et de largeur définis par l'API des paramètres déterminent la taille de l'iFrame. Des fenêtres avec une hauteur de 600 px et une largeur de 400 px sont optimales pour la plupart des fenêtres de navigateur, y compris sur les petits écrans.
• Vérifiez que les conditions d'erreur apparaissent au sein de l'iFrame. Votre application peut ainsi alerter les utilisateurs sur les problèmes audio, les problèmes de réseau ou d'autres erreurs.

Si votre application est en cours de création, vous pouvez définir manuellement l'URL d'iFrame pour votre navigateur en configurant une valeur localStorage. Vous pourrez ainsi définir une URL localhost pour un test en local.

Pour définir la valeur, ouvrez les outils de développeur pour votre navigateur et exécutez la commande JavaScript suivante dans la console de développeur :

localStorage.setItem('LocalSettings:Calling:CallingExtensions', '{"name": "Example Calling app Title", "url": "https://myWidgetUrl/path/"}')

La valeur name apparaîtra dans l'en-tête du widget d'appel et url sera l'URL utilisée pour l'iFrame. Lorsque cet élément est défini, la valeur name que vous avez définie apparaîtra comme une option pour le fournisseur d'appels lorsque vous cliquerez sur l'icône Appel. Le widget d'appel utilisera l'élément url de l'iFrame que vous avez défini.

Les détails ci-dessus entraînent un engagement qui s'affiche comme dans l'image ci-dessous dans HubSpot :

Consultez Engagements de CRM pour plus de détails sur l'utilisation des engagements.