logo
Développement
AperçuEspaceDéveloppementEspaceDeTravailRéférenceAPIMeilleurePratiqueJournalDesModifications
Rechercher
Français
EspaceDeTravail / IntégrationMobile / Aperçu
Aperçu de l'intégration mobile de l'espace de travail
Dernière mise à jour：4 months ago

Aperçu de l'intégration mobile de l'espace de travail

GPTBots permet d'intégrer l'ensemble de l'espace de travail dans l'APP mobile de l'entreprise, en permettant aux utilisateurs de l'entreprise d'utiliser l'espace de travail sans connexion, afin de faciliter son usage par les employés de l'entreprise. L'intégration utilise l'approche WebView + pont H5, et prend en charge Android comme iOS.

WebViewBridge est une interface de pont permettant une communication bidirectionnelle entre l'application native et la page H5. Elle fournit un protocole et des méthodes de communication unifiés, permettant au code natif et à la page H5 de s'appeler mutuellement et d'échanger des données facilement.

Architecture d'intégration

┌──────────────┐ WebViewBridge ┌──────────────────┐ │ APP mobile │ ◄────────────────► │ Page H5 de │ │ d'entreprise │ │ l'espace de │ │(Android/iOS) │ │ travail │ │ │ │ (React + Vite) │ └──────────────┘ └──────────────────┘ │ │ │ Émission d'AiToken │ Analyse d'AiToken │ (chiffrement RSA) │ Entrée sans connexion ▼ ▼ ┌──────────────────────────────────────────────────┐ │ Service backend GPTBots │ │ (Spring Boot + MongoDB + Redis) │ └──────────────────────────────────────────────────┘
                      
                      ┌──────────────┐    WebViewBridge    ┌──────────────────┐
│  APP mobile   │ ◄────────────────► │  Page H5 de       │
│ d'entreprise  │                    │ l'espace de       │
│(Android/iOS) │                    │ travail          │
│              │                    │  (React + Vite)  │
└──────────────┘                    └──────────────────┘
       │                                   │
       │ Émission d'AiToken                │ Analyse d'AiToken
       │ (chiffrement RSA)                 │ Entrée sans connexion
       ▼                                   ▼
┌──────────────────────────────────────────────────┐
│              Service backend GPTBots              │
│        (Spring Boot + MongoDB + Redis)           │
└──────────────────────────────────────────────────┘
Ce bloc de code dans la fenêtre flottante

Processus d'intégration

Étape Description Documentation détaillée
1. Obtenir la clé publique Obtenir la clé publique RSA dans Paramètres de l'espace → Intégration Chiffrement AiToken
2. Émettre l'AiToken Chiffrer l'e-mail du membre avec la clé publique, y concaténer l'ID du projet, puis l'encoder en Base64 Chiffrement AiToken
3. Ouvrir l'URL dédiée Concaténer l'AiToken à l'URL d'intégration de l'espace de travail Ce document
4. Intégration côté natif Intégrer la WebView et configurer les autorisations côté Android ou iOS Intégration Android / Intégration iOS
5. Communication par pont Implémenter JSBridge / WKScriptMessageHandler Intégration Android / Intégration iOS

URL d'accès à l'espace de travail

Lorsqu'un employé de l'entreprise accède à l'espace de travail depuis l'APP, l'adresse de l'espace de travail doit être ouverte avec l'identité de l'employé de l'entreprise. Les règles de génération de l'adresse d'accès sont les suivantes :

https://gptbots.ai/space/h5/home?AiToken={加密AiToken}&hideClose=true
                      
                      https://gptbots.ai/space/h5/home?AiToken={加密AiToken}&hideClose=true
Ce bloc de code dans la fenêtre flottante
  • {加密AiToken} : l'AiToken chiffré au moyen de la clé publique RSA, contenant l'ID de l'organisation et l'e-mail du compte de l'employé
  • hideClose : paramètre optionnel ; s'il est défini sur true, le bouton « Fermer » est masqué dans la page webview

Comportement du paramètre hideClose

  • Par défaut (non transmis ou false) : le bouton « Fermer » est affiché sur la page ; lorsqu'on clique dessus, une notification de message d'action de fermeture est envoyée via WebViewBridge
  • Défini sur true : le bouton de fermeture est masqué, et l'APP contrôle elle-même le cycle de vie de la WebView

JSON du message d'action de fermeture :

{ "eventType": "click", "data": { "value": "close", "timestamp": 1776921208476, "extendedData": {} } }
                      
                      {
  "eventType": "click",
  "data": {
    "value": "close",
    "timestamp": 1776921208476,
    "extendedData": {}
  }
}
Ce bloc de code dans la fenêtre flottante
  • eventType : chaîne de caractères indiquant le type d'événement, utilisée pour identifier les différents appels de fonctionnalité
  • data : objet JSON contenant les données de paramètres liées à l'événement ; il peut contenir des champs différents selon le eventType

Tableau des types d'événements

Type d'événement Constante Description Paramètres
click EVENT_CLICK événement de clic sur la page webview data : données supplémentaires (optionnel) au format JSON, contenant par défaut les champs value (type d'événement, par ex. « click ») et timestamp (horodatage, en millisecondes)
message EVENT_MESSAGE événement de message sur la page webview data : données supplémentaires (optionnel) au format JSON, contenant par défaut les champs value (type d'événement, par ex. « message ») et timestamp (horodatage, en millisecondes)

Projet DEMO

GPTBots fournit un DEMO complet d'intégration mobile de l'espace de travail :

Plateforme Dépôt
Android android-webview-bridge
iOS ios-webview-bridge

Documents associés