Skip to content

Iframe Shopintegration Hybrid

Bei der IFrame Shopintegration hast Du die Möglichkeit eine Shop-Oberfläche von uns via HTML iframe in deine Website zu integrieren.

Das nachfolgende Schaubild stellt beispielhaft den Bestellprozess dar.

sequenceDiagram
    actor Benutzer

    Benutzer->>Dein System: Login
    Dein System->>Unser Shop: Einbindung via HTML iframe
    Benutzer->>Unser Shop: Auswahl von Werbeflächen und abschließen einer Bestellung
    Unser Shop->>Dein System: Nach Abschluss Umleitung des Benutzers auf dein System
    Dein System->>Warenkorb API: Abruf des Warenkorbs, individuelle Integration in deinem System
    Benutzer->>Dein System: Abschluss der Bestellung auf deiner Website
    Dein System->>Bestell API: Übermittlung der Bestellung
    Anbieter->>Unser Shop: Bestellbestätigung
    Unser Shop->>Dein System: Callback Statusänderung Bestellposition
    Benutzer->>Dein System: Motivzuweisung
    Dein System->>Unser Shop: Motivzuweisung via API
    actor Anbieter

Händler anlegen

Siehe Iframe Shopintegration, Händler anlegen

Shop Login

Damit Du deine Benutzer / Händler auf unsere Shop-Oberfläche weiterleiten kannst, musst Du zunächst einen Login durchführen. Um einen Login durchführen zu können, musst Du die /shoplogin API verwenden und eine haendlerIdClient übergeben. Sofern der Aufruf erfolgreich ist, erhältst Du eine URL zurück, welche Du in einen HTML iframe auf deiner Website integrieren kannst.

sequenceDiagram
    Client->>API: POST /shoplogin/
    API->>Client: 201 https://ops-jvb-test-shop.mggm.de/cgi-bin/ops.dll

Die zurückgegebene URL kann für einen HTML iframe verwendet werden.

Bestellung durchführen

Der Shop

  • Der Benutzer wählt über die Shop-Oberfläche freie Flächen und Termine
  • Innerhalb der Shop-Oberfläche bestätigt der Benutzer seinen Warenkorb
  • Durch die Bestätigung wird der Benutzer umgeleitet auf dein System
  • Über unsere Warenkorb API kann dein System sich den Warenkorb aus unserem System abholen für die weitere Verarbeitung
  • Der Benutzer durchläuft in deinem System deinen individuellen Bestellprozess
  • Der Benutzer schließt auf deiner Website die Bestellung ab
  • Dein System übermittelt uns via Bestellungen API die abgeschlossene Bestellung und ggf. Motive

Checkout done

Motive

Nachdem der Benutzer die Bestellung abgeschlossen und dein System die Daten via Warenkorb API abgeholt hast, kannst Du uns zu einem späteren Zeitpunkt die Motive via Motiv API übermitteln.

⚠ Bitte sprich im Projekt mit uns über Fristen, die gegenüber Anbietern und Klebern eingehalten werden müssen.

Callbacks

Für bestimmte Ereignisse kann dein System von uns informiert werden. Dazu ist es erforderlich, das dein System einige REST API Endpunkte zur Verfügung stellt. Diese werden dann von unserem System aufgerufen, sobald das Ereignis eintritt. Ganz typische Ereignisse sind zum Beispiel Callbacks für neue getätigte Bestellungen oder geänderte Status an Bestellpositionen.

Damit unser System die Callbacks an dein System zurücksenden kann, muss das Feld 'metaData' mit dem Wert 'baseUrl' befüllt werden wenn die Bestellung übermittelt wird. Beispiel metaData für Request Neue Bestellung anlegen:

"metaData": {
    "environment": "dev",
    "baseUrl:" : "https://deine-callback-url.de"
}

Authentifizierung an deinem System

Um die Callbacks abzusichern unterstützen wir OAUTH. Bevor ein Callback ausgelöst wird, holt sich unser System von deinem System einen gültigen Token. Dazu muss dein System einen entsprechenden Endpunkt bereitstellen:

POST {baseUrl}/callback/login

Wir übermitteln dann die mit dir abgestimmten Zugangsdaten in folgendem Format:

Payload Body
{
   "client_id": "weischer",
   "client_secret": "geheim",
   "grant_type": "client_credentials"
}

Unser System erwartet als Antwort einen gültigen OAUTH Bearer Token:

{
    "access_token": "{token}",
}

Dieser Token wird für alle Callbacks verwendet.

Callback für Statusänderungen

Sobald sich der Bestellstatus einer Bestellpositionen ändert (z. B. Anbieter bestätigt oder storniert Flächenbuchung), kann diese Änderung an dein System zurück übermittelt werden.

Dazu muss dein System folgenden Callback von unserem System entgegennehmen können:

Bestätigung: PATCH {baseUrl}/callback/bestellungen/{bestellnummer}/{flaechenNummer}/confirmed

Storno: PATCH {baseUrl}/callback/bestellungen/{bestellnummer}/{flaechenNummer}/canceled