---
title: "Academy App"
canonical_url: "https://academy.laioutr.com/apps/jtl-wawi-anbinden"
locale: de
meta:
"og:title": "Academy App"
---
[Zur Startseite](https://academy.laioutr.com/)
- [Apps](https://academy.laioutr.com/bereiche/apps)
- [Commerce-Systeme](https://academy.laioutr.com/leitfaeden/commerce-systeme)
- [JTL-Wawi anbinden](https://academy.laioutr.com/apps/jtl-wawi-anbinden)
# JTL-Wawi anbinden
Die App JTL Platform verbindet einen Mandanten der JTL-Wawi ERP Cloud über die native GraphQL API mit Laioutr. Die App liefert Artikel für Produktlisten und die Volltextsuche, nur lesend.
## Bevor du startest
- Tarif
- Jeder Laioutr-Plan, dazu ein Mandant der JTL-Wawi ERP Cloud
- Rolle
- Developer-Rolle in der Umgebung
- Dauer
- 8 Min.
### Voraussetzungen
- Zugang zum JTL-Entwicklerportal
- Tenant-ID des Händlers
- Berechtigung items.read für die registrierte App
Zuletzt geprüft am 15. Oktober 2026
Liest Artikel aus einem Mandanten der JTL-Wawi ERP Cloud über die native GraphQL API und liefert Produktlisten und Volltextsuche mit Name, Beschreibung, Hersteller und Bruttopreis. Nur lesend, ohne Warenkorb, Checkout und Kundenkonto.
[Entwicklerdokumentation](https://docs.laioutr.com/apps/app-docs/jtl-platform)
## So funktioniert es
1. Cloud-App registrieren und Client-Zugangsdaten notierenWo: JTL-Entwicklerportal · Rolle: JTL-Admin · Dauer: 10 min
2. Berechtigung items.read erteilen und Tenant-ID ermittelnWo: JTL-Entwicklerportal · Rolle: JTL-Admin · Dauer: 5 min
3. App im Katalog installierenWo: Laioutr Cockpit, Apps · Rolle: Developer · Dauer: 2 min
4. Werte unter Configuration eintragen, testen und speichernWo: Laioutr Cockpit, Configuration · Rolle: Developer · Dauer: 5 min
5. Umgebung deployen und Daten in Studio prüfenWo: Laioutr Cockpit und Studio · Rolle: Developer, Content Manager · Dauer: 10 min
## Konfiguration
| Feld | Zweck | Woher | Pflicht | Pro Environment |
| --- | --- | --- | --- | --- |
| `clientId` | OAuth2 Client ID der registrierten Cloud-App. | JTL-Entwicklerportal. | Ja | Ja |
| `clientSecret` | OAuth2 Client Secret, nur serverseitig genutzt. | JTL-Entwicklerportal. | Ja | Ja |
| `tenantId` | Mandant, dessen Daten gelesen werden, gesendet als X-Tenant-ID. | Tenant-ID des Händlers in der JTL Cloud. | Ja | Ja |
| `graphqlUrl` | GraphQL-Endpunkt, Standard https://api.jtl-cloud.com/erp/v2/graphql. | Nur bei abweichendem Host des Mandanten setzen. | Nein | Ja |
| `tokenUrl` | OAuth2-Token-Endpunkt, Standard https://auth.jtl-cloud.com/oauth2/token. | Nur bei abweichendem Host des Mandanten setzen. | Nein | Ja |
| `scope` | Optionaler OAuth2-Scope. | Nach Vorgabe der App-Registrierung. | Nein | Ja |
## Häufige Fehler
- Abfragen scheitern mit 400 TenantIdMissing.
- **Ursache:** Die Tenant-ID fehlt.
- **Lösung:** tenantId unter Configuration eintragen, speichern und deployen.
- Datenabfragen scheitern mit 403.
- **Ursache:** Der registrierten App fehlt die Berechtigung items.read.
- **Lösung:** items.read im JTL-Entwicklerportal erteilen.
- Studio zeigt Beispielprodukte statt eigener Artikel.
- **Ursache:** Es sind keine Zugangsdaten wirksam, der Connector liefert eingebaute Beispieldaten.
- **Lösung:** Client ID, Client Secret und Tenant-ID eintragen und die Umgebung deployen.
- Neue Zugangsdaten zeigen keine Wirkung auf der Storefront.
- **Ursache:** Gespeicherte Einstellungen gelten erst ab dem nächsten Deployment der Umgebung.
- **Lösung:** Die Umgebung mit Deploy neu bauen.
JTL-Wawi ist im deutschsprachigen Mittelstand ein verbreitetes Warenwirtschaftssystem. Die App **JTL Platform** macht einen Mandanten der JTL-Wawi ERP Cloud zur Datenquelle der Laioutr-Storefront. Die App spricht mit der nativen JTL GraphQL API und übersetzt die Artikel über Orchestr in das einheitliche Produktmodell von Laioutr.
Der Connector ist ein reiner Katalog-Connector und arbeitet nur lesend. Er liefert Produktlisten und die Volltextsuche mit Name, Beschreibung, Kurzbeschreibung, Hersteller und Bruttopreis. Warenkorb, Checkout, Kundenkonten und Mediathek gehören nicht dazu, diese Aufgaben übernehmen andere Apps im Projekt. Die Darstellung kommt aus den Standard-Sections von Laioutr.
Die Anmeldung läuft über OAuth2 Client Credentials. Das Client Secret bleibt auf dem Server und erreicht nie den Browser. Ohne Zugangsdaten zeigt der Connector eingebaute Beispieldaten, damit eine Storefront auch vor der Anbindung durchgängig rendert.
## Schritt für Schritt
1. 1 ### Schritt 1: Cloud-App registrieren
Im JTL-Entwicklerportal eine Cloud-App registrieren und Client ID sowie Client Secret notieren.
2. 2 ### Schritt 2: Rechte und Mandant klären
Der registrierten App die Berechtigung `items.read` erteilen und die Tenant-ID des Händlers ermitteln.
3. 3 ### Schritt 3: App installieren
Im Cockpit unter **Apps** im Reiter **Ecommerce** die App JTL Platform mit **Install** zum Projekt hinzufügen.
4. 4 ### Schritt 4: Werte eintragen und testen
Im Umgebungsmenü **Configuration** öffnen, die Werte eintragen, mit **Test connection** prüfen und mit **Save settings** speichern.
5. 5 ### Schritt 5: Deployen und prüfen
Die Umgebung mit **Deploy** neu bauen und danach in Studio prüfen, ob Produkte und Kategorien in der Vorschau erscheinen.
## Ergebnis prüfen
Der Verbindungstest meldet Erfolg, und Produktlisten sowie Suchergebnisse in Studio zeigen die eigenen Artikel aus JTL-Wawi statt der Beispieldaten.
## Häufige Fragen
Gibt es Warenkorb und Checkout mit JTL?
Nicht über diese App. Die App liefert nur Katalogdaten. Warenkorb und Checkout kommen aus einer anderen App im Projekt.
Warum zeigt die Vorschau fremde Beispielprodukte?
Ohne Zugangsdaten liefert der Connector eingebaute Beispieldaten. Sobald Client ID, Client Secret und Tenant-ID gespeichert und deployt sind, erscheinen die eigenen Artikel.
Müssen die Endpunkte angegeben werden?
Nein. Die Standardadressen für GraphQL und Token gelten für die JTL Cloud. Nur wenn der Mandant auf einem anderen Host läuft, werden sie überschrieben.
## Passend dazu
- [Apps finden, installieren und konfigurieren](https://academy.laioutr.com/artikel/apps-finden-installieren-und-konfigurieren)6 Min.
Apps stehen im Cockpit unter Apps als Katalog bereit, werden je Umgebung installiert und unter Configuration eingerichtet. Die Storefront nutzt sie ab dem nächsten Deployment.
- [Zugangsdaten eintragen und Verbindung testen](https://academy.laioutr.com/artikel/zugangsdaten-eintragen-und-verbindung-testen)5 Min.
Zugangsdaten einer App werden je Umgebung unter Configuration eingetragen, mit Test connection geprüft und mit Save settings gespeichert. Wirksam werden sie mit dem nächsten Deployment.
- [Produktlisten mit Filter und Sortierung einrichten](https://academy.laioutr.com/artikel/produktlisten-mit-filter-und-sortierung-einrichten)6 Min.
Eine Produktliste entsteht in Studio aus Product Listing Grid, Filter Bar und Sortierung; Produkte, Filter und Sortieroptionen liefert die angebundene Commerce-App über Orchestr. Welche Filter erscheinen, hängt davon ab, was das Backend bereitstellt.
- [Suche und Suchergebnisseite einrichten](https://academy.laioutr.com/artikel/suche-und-suchergebnisseite-einrichten)6 Min.
Die Suche besteht aus dem Suchfeld mit Vorschlägen im Shop-Header und der Suchergebnisseite mit Suchbegriff, Trefferzahl, Filtern und Produktraster. Vorschläge und Treffer liefert die Such- oder Commerce-App über Orchestr, die Qualität der Suche hängt also vom angebundenen Suchdienst ab.
- [Echte Daten in Studio prüfen](https://academy.laioutr.com/artikel/echte-daten-in-studio-pruefen)5 Min.
Studio zeigt in der Vorschau echte Daten aus den angebundenen Apps. Auf dynamischen Seiten wie der Produktdetailseite wählt das Feld Preview Data, welches Produkt die Vorschau zeigt.
## [Commerce-Systeme](https://academy.laioutr.com/leitfaeden/commerce-systeme)
In diesem Leitfaden suchen
1. [Shopify anbinden](https://academy.laioutr.com/apps/shopify-anbinden)10 Min.
2. [Shopware mit Checkout-Plugin anbinden](https://academy.laioutr.com/apps/shopware-mit-checkout-plugin-anbinden)12 Min.
3. [VTEX anbinden](https://academy.laioutr.com/apps/vtex-anbinden)8 Min.
4. [Sylius anbinden](https://academy.laioutr.com/apps/sylius-anbinden)8 Min.
5. [JTL-Wawi anbinden](https://academy.laioutr.com/apps/jtl-wawi-anbinden)8 Min.
6. [B2B Sellers für Shopware anbinden](https://academy.laioutr.com/apps/b2b-sellers-fuer-shopware-anbinden)8 Min.
7. [Magento 2 anbinden](https://academy.laioutr.com/apps/magento-2-anbinden)10 Min. In Vorbereitung
## Structured Data
```json
{
"@context": "https://schema.org",
"@graph": [
{
"@id": "https://academy.laioutr.com/#website",
"@type": "WebSite",
"inLanguage": "de",
"name": "Default",
"url": "https://academy.laioutr.com/",
"workTranslation": {
"@id": "https://academy.laioutr.com/#website"
}
},
{
"@id": "https://academy.laioutr.com/apps/jtl-wawi-anbinden#webpage",
"name": "Academy App",
"url": "https://academy.laioutr.com/apps/jtl-wawi-anbinden",
"@type": [
"WebPage",
"FAQPage"
],
"breadcrumb": {
"@id": "https://academy.laioutr.com/apps/jtl-wawi-anbinden#breadcrumb"
},
"isPartOf": {
"@id": "https://academy.laioutr.com/#website"
},
"mainEntity": [
{
"@id": "https://academy.laioutr.com/apps/jtl-wawi-anbinden#/schema/question/1"
},
{
"@id": "https://academy.laioutr.com/apps/jtl-wawi-anbinden#/schema/question/2"
},
{
"@id": "https://academy.laioutr.com/apps/jtl-wawi-anbinden#/schema/question/3"
}
],
"potentialAction": [
{
"@type": "ReadAction",
"target": [
"https://academy.laioutr.com/apps/jtl-wawi-anbinden"
]
}
]
},
{
"@id": "https://academy.laioutr.com/apps/jtl-wawi-anbinden#breadcrumb",
"@type": "BreadcrumbList",
"itemListElement": [
{
"@type": "ListItem",
"name": "Home",
"item": "https://academy.laioutr.com/",
"position": 1
},
{
"@type": "ListItem",
"name": "Apps",
"item": "https://academy.laioutr.com/bereiche/apps",
"position": 2
},
{
"@type": "ListItem",
"name": "Commerce-Systeme",
"item": "https://academy.laioutr.com/leitfaeden/commerce-systeme",
"position": 3
},
{
"@type": "ListItem",
"name": "JTL-Wawi anbinden",
"item": "https://academy.laioutr.com/apps/jtl-wawi-anbinden",
"position": 4
}
]
},
{
"@id": "https://academy.laioutr.com/apps/jtl-wawi-anbinden#/schema/question/1",
"@type": "Question",
"inLanguage": "de",
"name": "Gibt es Warenkorb und Checkout mit JTL?",
"acceptedAnswer": {
"@type": "Answer",
"text": "Nicht über diese App. Die App liefert nur Katalogdaten. Warenkorb und Checkout kommen aus einer anderen App im Projekt.
"
}
},
{
"@id": "https://academy.laioutr.com/apps/jtl-wawi-anbinden#/schema/question/2",
"@type": "Question",
"inLanguage": "de",
"name": "Warum zeigt die Vorschau fremde Beispielprodukte?",
"acceptedAnswer": {
"@type": "Answer",
"text": "Ohne Zugangsdaten liefert der Connector eingebaute Beispieldaten. Sobald Client ID, Client Secret und Tenant-ID gespeichert und deployt sind, erscheinen die eigenen Artikel.
"
}
},
{
"@id": "https://academy.laioutr.com/apps/jtl-wawi-anbinden#/schema/question/3",
"@type": "Question",
"inLanguage": "de",
"name": "Müssen die Endpunkte angegeben werden?",
"acceptedAnswer": {
"@type": "Answer",
"text": "Nein. Die Standardadressen für GraphQL und Token gelten für die JTL Cloud. Nur wenn der Mandant auf einem anderen Host läuft, werden sie überschrieben.
"
}
}
]
}
```