Beispiele
In diesem Kapiteln finden Sie einige Beispiele dafür, wie Sie Abfragen und Mutationen für die Shopify API erstellen können. In allen diesen Beispielen stellen wir eine Verbindung zur Shopify Admin API her. Wir nennen unseren Shop altovamapforcetest.
Eine Anleitung, wie Sie eine Verbindung zur Shopify API herstellen, finden Sie im Kapitel Shopify API und GraphQL API. Informationen zum Arbeiten mit dem Editor im Dialogfeld GraphQL-Einstellungen finden Sie im Kapitel Abfrage/Mutations-Editor.
Beispiel 1: Abrufen der ersten 10 Produkte
In diesem Beispiel sollen die Daten der ersten 10 Produkte aus unserem Shop abgerufen werden. Im unten gezeigten Dialogfeld GraphQL-Einstellungen sehen Sie die URL unseres Shops und das Access Token als Header-Parameter sowie die Definition einer Abfrage-Operation.
Die Abfrage-Operation wurde folgendermaßen definiert:
•Der Root Operation Type ist der Objekttyp query - er dient als Eintrittspunkt in die API.
•In der Abfragestruktur wird die Auswahlgruppe der gewünschten Felder definiert. In unserem Beispiel soll eine Liste von Produkten abgerufen werden.
•Das Feld products hat ein first :10-Argument, das die Anzahl der abgerufenen Produkte auf die ersten 10 einschränkt.
•Das Feld nodes ist ein Verbindungsfeld, über das einzelne Produktdaten aus der Liste products aufgerufen werden.
•In den Feldern id und title sind die Produktattribute definiert, die abgerufen werden sollen.
Im GIF angezeigte Abfragedefinition
Im GIF im Kapitel Abfrage/Mutations-Editor finden Sie eine kurze Demo, in der gezeigt wird, wie Sie im Editor des Dialogfelds GraphQL-Einstellungen eine Abfrage erstellen.
Mapping
Sobald Sie im Dialogfeld GraphQL-Einstellungen auf OK klicken, wird im Mapping-Bereich eine Webservice-Call-Komponente angezeigt. Die Response-Struktur in der Komponente wird vom Shopify GraphQL-Schema und den in der Abfrage ausgewählten Feldern definiert (in unserem Beispiel id und title der ersten 10 Produkte). Die Response wird auf eine CSV-Datei gemappt (Abbildung unten).
Ausgabe
Es wurde die folgende Response vom Server abgerufen:
gid://shopify/Product/9881539871060,Very Nice Gift Card
gid://shopify/Product/9881539903828,Cool Snowboard
gid://shopify/Product/9881539936596,Super Snowboard
gid://shopify/Product/9881539969364,Epic Ski Wax
gid://shopify/Product/9881540002132,Super-Duper Snowboard
gid://shopify/Product/9881540034900,Crazy Snowboard
gid://shopify/Product/9881540067668,Best Snowboard
gid://shopify/Product/9881540100436,Incredible Snowboard
gid://shopify/Product/9881540133204,Fantastic Snowboard
gid://shopify/Product/9881540165972,Terrific Snowboard
Beispiel 2: Abrufen der Daten eines bestimmten Produkts
In diesem Beispiel sollen die Daten eines Produkts mit einer bestimmten ID abgerufen werden. Die Abfrage-Operation wurde folgendermaßen definiert (Abbildung unten):
•In der Abfrage wird eine Variable namens $productId verwendet. Die Variable hat den Typ ID!. Das Ausrufezeichen ! zeigt an, dass der Input erforderlich ist. Für den Request-Teil der Webservice-Call-Komponente wird ein Input-Wert bereitgestellt.
•Für das Feld product wird über die productId des jeweiligen Produkts ein einzelnes Produkt aus Shopify abgerufen.
•Für das Feld variants werden Produktvarianten (betreffend die Größe, Farbe, usw.) abgerufen.
•Das Feld variants hat ein first :10-Argument. D.h. es werden nur die ersten 10 Varianten des Produkts abgerufen.
•Innerhalb der variants-Substruktur werden durch Auswahl der folgenden Felder innerhalb des Felds nodes Daten zu den einzelnen Varianten angefordert: displayName, price, updatedAt, availableForSale und taxable.
Mapping
Im Folgenden sehen Sie das Mapping mit dem konfigurierten Webservice-Aufruf. Der Request-Teil des Aufrufs enthält die zuvor in der Abfrage-Operation definierten Input-Parameter (productId). Dieser Input-Parameter erhält aus der Konstante die ID eines Produkts. Die Response-Struktur wird auf eine JSON-Datei gemappt.
Ausgabe
Es wurden die folgenden Daten vom Server abgerufen:
[
{
"displayName": "Legendary Snowboard",
"price": "749.95",
"updatedAt": "2024-10-29T19:55:34Z",
"availableForSale": true,
"taxable": true
}
]
Beispiel 3: Erstellen eines neuen Produkts
In diesem Beispiel soll auf dem Server ein neues Produkt erstellt werden. Wir haben zu diesem Zweck folgendermaßen eine Mutation definiert (Abbildung unten):
•Die Mutation hat eine Variable namens $product, die Input-Daten für die Mutationsfunktion productCreate enthält Mit Hilfe der Variablen können wir die Produktinformationen dynamisch für den Request-Teil des Webservice-Aufrufs bereitstellen. Die Variable hat den Typ ProductCreateInput!, wobei es sich um einen vordefinierten Datentyp im Shopify GraphQL-Schema handelt. Das Ausrufezeichen ! zeigt an, dass der Input erforderlich ist.
•Die Mutationsfunktion productCreate erstellt ein neues Produkt.
•Die Mutationsfunktion productCreate hat ein product-Argument, das als seinen Wert die Variable $product erhält.
•In der product-Substruktur sind die Felder definiert, die Shopify nach Erstellung des neuen Produkts zurückgeben soll. Zu diesen Feldern gehören: id, title und descriptionHtml.
Mapping
Im Folgenden sehen Sie das Mapping mit dem konfigurierten Webservice-Aufruf. Da das Feld id automatisch generiert wird, haben wir nur für die Felder title und descriptionHtml Werte bereitgestellt. Beachten Sie, dass die Daten, die Sie für ein neues Produkt bereitstellen, nicht mit den ausgewählten Feldern in der Response-Struktur übereinstimmen müssen: Sie können in der Request-Struktur z.B. mehrere Produktdetails bereitstellen (z.B. Titel, Preise, Varianten, usw.), aber nur eine Untergruppe dieser Daten abrufen (z.B. nur Titel).
Die Response wird auf eine JSON-Datei gemappt.
Ausgabe
Es wurden die folgenden Daten vom Server abgerufen:
[
{
"productCreate": {
"product": {
"id": "gid://shopify/Product/11863012147540",
"title": "Awesome Snowboard",
"descriptionHtml": "<p>This awesome snowboard is for the bold rider who demands power and precision. Choose the color and size that fits your style and your adventure.</p>"
}
}
}
]
Beispiel 4: Abruf der vollständigen Response (Debugging)
Gemäß der GraphQL-Spezifikation befinden sich die von der Abfrage oder Mutation zurückgegebenen Daten im data-Schlüssel. Neben dem data-Schlüssel gibt es auch einen errors- und einen extensions-Schlüssel. Der errors-Schlüssel enthält Fehler, die bei der Ausführung auftreten. Der extensions-Schlüssel enthält zusätzliche servicespezifische Daten, die normalerweise zum Debuggen und zu Protokollierungszwecken verwendet werden.
Zu Test- und Debuggingzwecken sollte daher die vollständige Response gemappt werden. Die einfachste Methode ist, das Response-Objekt, das die Werte des data-, errors- und extensions-Schlüssels enthält, auf ein any-JSON-Schema zu mappen. Der Grundgedanke ist, dass es sich bei any um einen flexiblen Datentyp handelt, der für beliebige gültige JSON-Daten steht. Das bedeutet auch, dass Sie kein spezielles Schema erstellen müssen, das der Response-Struktur entspricht.
Um ein solches JSON-Schema zu definieren, erstellen Sie eine JSON-Schema-Datei (z.B. any.schema.json), öffnen Sie das JSON-Schema in einem Editor und geben Sie den Wert {} ein.
Im nachstehenden Mapping sehen Sie einen Webservice-Aufruf, dessen Response auf ein any-JSON-Schema gemappt wurde.
Ausgabe
Neben IDs und Produktnamen wurden die folgenden Daten vom Server abgerufen:
Extension
"cost": {
"requestedQueryCost": 6,
"actualQueryCost": 6,
"throttleStatus": {
"maximumAvailable": 2000,
"currentlyAvailable": 1994,
"restoreRate": 100
}
}
}