SDK mobile (préversion)

Les SDK mobiles ouvrent le Messenger en plein écran dans votre application. Les conversations, les articles d’aide, les appels et tout ce que vous définissez dans Paramètres → Messenger fonctionnent comme sur votre site, et un client qui écrit sur votre site et dans votre application voit un seul historique lorsque vous l’identifiez.

Préversion. Les SDK sont disponibles sous forme de code source en quatre versions. Ils ne sont pas encore publiés via les outils de l’App Store, Maven Central, npm ou pub.dev — demandez-nous les fichiers. Testez-les dans votre application avant de la publier.

Comment ça marche

Chaque SDK ouvre une page, https://app.shopxare.com/widget/v1/mobile/YOUR_APP_ID, dans une vue web et communique avec elle via un petit pont. Les informations de l’utilisateur transitent dans la partie de l’adresse après #, qui n’est jamais envoyée à aucun serveur, et la page les efface dès qu’elle les a lues. Comme le Messenger lui-même tourne de notre côté, les améliorations arrivent dans votre application sans mise à jour de celle-ci.

Identifier vos utilisateurs

Transmettez l’ID de votre utilisateur et le hachage utilisateur issu de la vérification d’identité. Calculez le hachage sur votre serveur et envoyez-le à l’application après la connexion — ne mettez jamais le secret du Messenger dans une application, où n’importe qui pourrait le lire.

iOS (Swift)

Ajoutez le package Swift ShopxareMessenger (iOS 14+).

import ShopxareMessenger

Shopxare.configure(appId: "YOUR_APP_ID")
Shopxare.identify(ShopxareUser(userId: "42", userHash: hashFromYourServer, email: "[email protected]", name: "Ada"))
Shopxare.present(from: self)                    // or present(from: self, newMessage: "")
Shopxare.trackEvent("order_placed", meta: ["total": 59.9])
Shopxare.addUnreadCountHandler { count in /* badge */ }
Shopxare.logout()                               // on logout

Pour les appels, ajoutez NSMicrophoneUsageDescription et NSCameraUsageDescription à votre Info.plist.

Android (Kotlin)

Ajoutez le module shopxare (minSdk 23).

Shopxare.configure("YOUR_APP_ID")
Shopxare.identify(ShopxareUser(userId = "42", userHash = hashFromYourServer, email = "[email protected]"))
Shopxare.present(context)                       // or present(context, newMessage = "")
Shopxare.trackEvent("order_placed", mapOf("total" to 59.9))
Shopxare.addUnreadCountListener { count -> /* badge */ }
Shopxare.logout()

Pour les appels, déclarez RECORD_AUDIO (et CAMERA pour la vidéo) dans votre manifeste ; le SDK demande l’autorisation à l’utilisateur au début d’un appel.

React Native

Nécessite react-native-webview 13 ou version ultérieure.

import { ShopxareProvider, useShopxare } from '@shopxare/react-native-messenger';

<ShopxareProvider appId="YOUR_APP_ID" user={{ userId: '42', userHash, email: '[email protected]' }} onUnreadCountChange={setBadge}>
  <App />
</ShopxareProvider>

const shopxare = useShopxare();
shopxare.present();
shopxare.trackEvent('order_placed', { total: 59.9 });
shopxare.logout();

Flutter

Nécessite webview_flutter 4.4+ et url_launcher.

Shopxare.configure('YOUR_APP_ID');
Shopxare.identify(const ShopxareUser(userId: '42', userHash: hashFromYourServer, email: '[email protected]'));
Shopxare.present(context);
Shopxare.trackEvent('order_placed', {'total': 59.9});
Shopxare.unreadCount.addListener(() => setBadge(Shopxare.unreadCount.value));
Shopxare.logout();

Dans cette préversion, l’envoi de fichiers et les appels dans la vue web Flutter nécessitent la configuration de plateforme de webview_flutter dans votre application.

À savoir

• Les événements que vous suivez lorsque le Messenger est fermé sont envoyés à sa prochaine ouverture.
• Le nombre de non-lus se met à jour tant que l’écran du Messenger existe. Les notifications push pour les nouvelles réponses ne font pas encore partie de la préversion : le client voit les nouvelles réponses lorsqu’il rouvre le Messenger.
• Les liens dans les messages s’ouvrent dans le navigateur du système.
• La déconnexion fait démarrer une nouvelle session à la personne suivante sur l’appareil.

Créer le vôtre

Vous utilisez un autre framework ? Ouvrez la page dans n’importe quelle vue web et suivez le pont : la page envoie des messages {"type": "ready" | "unread" | "close" | "open_url"}, et votre application peut appeler window.ShopxareMobile.command(name, ...args) avec show, hide, update, trackEvent, showNewMessage ou shutdown.