logo
Entwicklung
ÜbersichtEntwicklungsbereichArbeitsbereichAPI-ReferenzBewährte PraxisÄnderungsprotokoll
Suchen
Deutsch
Arbeitsbereich / Mobile-Integration / Übersicht
Übersicht zur Mobile-Integration des Arbeitsbereichs
Zuletzt aktualisiert：4 months ago

Übersicht zur Mobile-Integration des Arbeitsbereichs

GPTBots unterstützt die vollständige Integration des Arbeitsbereichs in die mobile APP des Unternehmens. Durch die Nutzung des Arbeitsbereichs ohne Anmeldung für Unternehmensbenutzer wird die Verwendung des Arbeitsbereichs für Mitarbeiter des Unternehmens erleichtert. Die Integration erfolgt über den Ansatz WebView + H5-Bridge und unterstützt sowohl Android als auch iOS.

WebViewBridge ist eine Bridge-Schnittstelle für die bidirektionale Kommunikation zwischen nativen Anwendungen und H5-Seiten. Sie stellt ein einheitliches Kommunikationsprotokoll und entsprechende Methoden bereit, sodass nativer Code und H5-Seiten einander bequem aufrufen und Daten austauschen können.

Integrationsarchitektur

┌──────────────┐ WebViewBridge ┌──────────────────┐ │ 企业移动 APP │ ◄────────────────► │ 工作空间 H5 页面 │ │(Android/iOS) │ │ (React + Vite) │ └──────────────┘ └──────────────────┘ │ │ │ AiToken 签发 │ 解析 AiToken │ (RSA 加密) │ 免登录进入 ▼ ▼ ┌──────────────────────────────────────────────────┐ │ GPTBots 后端服务 │ │ (Spring Boot + MongoDB + Redis) │ └──────────────────────────────────────────────────┘
                      
                      ┌──────────────┐    WebViewBridge    ┌──────────────────┐
│  企业移动 APP │ ◄────────────────► │  工作空间 H5 页面 │
│(Android/iOS) │                    │  (React + Vite)  │
└──────────────┘                    └──────────────────┘
       │                                   │
       │ AiToken 签发                       │ 解析 AiToken
       │ (RSA 加密)                         │ 免登录进入
       ▼                                   ▼
┌──────────────────────────────────────────────────┐
│                GPTBots 后端服务                    │
│        (Spring Boot + MongoDB + Redis)           │
└──────────────────────────────────────────────────┘
Dieser Codeblock im schwebenden Fenster

Integrationsablauf

Schritt Beschreibung Detaillierte Dokumentation
1. Öffentlichen Schlüssel abrufen Rufen Sie den öffentlichen RSA-Schlüssel unter Arbeitsbereichseinstellungen → Integration ab AiToken-Verschlüsselung
2. AiToken ausstellen Verschlüsseln Sie die E-Mail-Adresse des Mitglieds mit dem öffentlichen Schlüssel, hängen Sie die Projekt-ID an und kodieren Sie das Ganze anschließend in Base64 AiToken-Verschlüsselung
3. Dedizierte URL öffnen Hängen Sie das AiToken an die Integrations-URL des Arbeitsbereichs an Dieses Dokument
4. Native Anbindung Integrieren Sie WebView auf Android oder iOS und konfigurieren Sie die Berechtigungen Android-Integration / iOS-Integration
5. Bridge-Kommunikation Implementieren Sie JSBridge / WKScriptMessageHandler Android-Integration / iOS-Integration

Zugriffs-URL des Arbeitsbereichs

Wenn ein Mitarbeiter des Unternehmens in der APP auf den Arbeitsbereich zugreift, sollte die Adresse des Arbeitsbereichs mit der Identität des jeweiligen Mitarbeiters geöffnet werden. Die Regel zur Generierung der Zugriffsadresse lautet wie folgt:

https://gptbots.ai/space/h5/home?AiToken={加密AiToken}&hideClose=true
                      
                      https://gptbots.ai/space/h5/home?AiToken={加密AiToken}&hideClose=true
Dieser Codeblock im schwebenden Fenster
  • {加密AiToken}: Das mit dem öffentlichen RSA-Schlüssel verschlüsselte AiToken, das die Organisations-ID und die E-Mail-Adresse des Mitarbeiterkontos enthält
  • hideClose: Optionaler Parameter; wird er auf true gesetzt, so wird die Schaltfläche „Schließen" auf der WebView-Seite ausgeblendet

Verhalten des Parameters hideClose

  • Standard (nicht übergeben oder false): Die Schaltfläche „Schließen" wird auf der Seite angezeigt; beim Anklicken wird über die WebViewBridge eine Nachricht mit der Schließen-Aktion gesendet
  • Auf true gesetzt: Die Schaltfläche „Schließen" wird ausgeblendet; die APP steuert den Lebenszyklus des WebView eigenständig

JSON der Schließen-Aktionsnachricht:

{ "eventType": "click", "data": { "value": "close", "timestamp": 1776921208476, "extendedData": {} } }
                      
                      {
  "eventType": "click",
  "data": {
    "value": "close",
    "timestamp": 1776921208476,
    "extendedData": {}
  }
}
Dieser Codeblock im schwebenden Fenster
  • eventType: Zeichenkette, die den Ereignistyp angibt und zur Identifizierung unterschiedlicher Funktionsaufrufe dient
  • data: JSON-Objekt, das die zum Ereignis gehörenden Parameterdaten enthält und je nach eventType unterschiedliche Felder enthalten kann

Tabelle der Ereignistypen

Ereignistyp Konstante Beschreibung Parameter
click EVENT_CLICK Klickereignis auf der WebView-Seite data: Zusätzliche Daten (optional) im JSON-Format, enthält standardmäßig die Felder value (Ereignistyp, z. B. "click") und timestamp (Zeitstempel in Millisekunden)
message EVENT_MESSAGE Nachrichtenereignis auf der WebView-Seite data: Zusätzliche Daten (optional) im JSON-Format, enthält standardmäßig die Felder value (Ereignistyp, z. B. "message") und timestamp (Zeitstempel in Millisekunden)

DEMO-Projekt

GPTBots stellt ein vollständiges DEMO zur Mobile-Integration des Arbeitsbereichs bereit:

Plattform Repository
Android android-webview-bridge
iOS ios-webview-bridge

Verwandte Dokumentation