--- title: Aktualisierung des Shopify-Bestands über eine mobile App date: 2025-04-01 categories: - data-integration - etl tags: - "#mapforce" description: Hier ist ein praktisches Beispiel für die Entwicklung einer mobilen App zur Aktualisierung des Lagerbestands in einem Shopify-Shop, die dank der GraphQL-Unterstützung in MapForce möglich ist. --- Status: #blog Tags: #mapforce #shopify Categories: [data-integration](/blog/de/category/data-integration.md) | [etl](/blog/de/category/etl.md) # Aktualisierung des Shopify-Bestands über eine mobile App Einer der Vorteile der Nutzung von Shopify als E-Commerce-Plattform ist, dass sie umfassende Funktionen zur Lagerverwaltung bietet. Die Pflege genauer Lagerbestandsdaten in Echtzeit kann jedoch eine Herausforderung darstellen, insbesondere für Händler, die bei der Inventur oder beim Nachbestellen manuell Daten eingeben. Handheld-Barcode-Scanner sind eine hervorragende Lösung, um die Geschwindigkeit und Genauigkeit bei Inventurkontrollen zu erhöhen. Allerdings fehlt es vielen Einzelhändlern oft an einer nahtlosen Möglichkeit, die Daten des Scanners direkt mit dem Shopify-System zu verbinden. Ohne eine ordnungsgemäße Integration müssen Mitarbeiter möglicherweise die gescannten Daten weiterhin manuell in Shopify eingeben, wodurch ein Teil der Effizienzgewinne, die Barcode-Scanner eigentlich bieten sollen, verloren geht. Schauen wir uns ein reales Beispiel an: die Entwicklung einer mobilen App mit Barcode-Scanfunktion, die direkt in Shopify integriert ist, um eine Echtzeit-Bestandsverwaltung zu ermöglichen. ![Mobile App für Shopify](/blog/images/Shopify-updating_inventory.jpg) Shopify tracks key inventory metrics, including the quantity on hand at each location, the number of items committed to existing orders, and the availability for new orders. Keeping these numbers accurate is important to prevent overselling or accumulating inactive, non-moving stock. Eine effektive Methode, um die Genauigkeit des Lagerbestands zu gewährleisten, ist die Durchführung regelmäßiger Inventurprüfungen oder Bestandserfassungen. Eine mobile App, mit der Sie die aktuell verfügbaren Mengen für jede Produktvariante direkt in Ihrem Shopify-Shop schnell aktualisieren können, kann diesen Prozess optimieren, wodurch die Geschwindigkeit erhöht und die Kosten für manuelle Lagerbestandsprüfungen reduziert werden. Mit Produkten der [Altova Data Platform](https://www.altova.com/de/data-platform) können wir einen Workflow erstellen, um Barcodedaten mit einem Handscanner zu erfassen und diese in Echtzeit mit Shopify zu verknüpfen. ## Shopify und GraphQL Shopify setzt standardmäßig auf die GraphQL-API für die Interaktion mit externen Daten, sei es zum Extrahieren von Daten für Analysen oder, in unserem Fall, zum Importieren von Daten für die Lagerverwaltung. Für weitere Informationen darüber, wie die Shopify GraphQL-APIs funktionieren und wie man sich mit ihnen verbindet, sehen Sie bitte unseren vorherigen Artikel zum Thema [Datenexport aus Shopify](/blog/de/2025/03/exporting-products-from-shopify-as-csv.md). ## Anforderungen und Design einer Shopify-App zur Lagerverwaltung Unser Arbeitsablauf wird eine Reihe von Altova-Produkten nutzen, die zusammenarbeiten: - MobileTogether Designer – für die Entwicklung einer App zum Scannen von Barcodes - MobileTogether Server – für die Bereitstellung der App auf mobilen Geräten - MapForce – für [Die Daten aus der App werden mit Shopify verknüpft](https://www.altova.com/de/mapforce/convert-shopify-graphql) - MapForce Server – für die Ausführung der Datenmapping-Prozesse auf einem Server - FlowForce Server – für die Orchestrierung von Arbeitsabläufen und die Bereitstellung von Zuordnungen als Webdienste Der Entwicklungsprozess beginnt in MobileTogether, dem Low-Code-Anwendungsentwicklungsframework von Altova, das für die Erstellung von datenzentrierten Anwendungen verwendet wird. Das Framework bietet umfassende Unterstützung für die Entwicklung von Anwendungen, die [Daten von Handheld-Barcode-Scannern speichern und verarbeiten](https://www.altova.com/de/mobiletogether/mobile-scanner-apps). In Shopify kann es viele.. [Produkte](https://help.shopify.com/en/manual/products)und jedes Produkt kann ein oder mehrere Produktmerkmale haben [Varianten](https://help.shopify.com/en/manual/products/variants)Intern ist für jede Produktvariante genau ein.. [Bestandsposition](https://shopify.dev/docs/api/admin-graphql/latest/objects/InventoryItem)Ein Artikel im Lagerbestand kann mehrere.. [Lagerbestände](https://shopify.dev/docs/api/admin-graphql/latest/objects/InventoryLevel)Ein Lagerbestand pro Einheit [Standort](https://shopify.dev/docs/api/admin-graphql/latest/objects/Location)Und "Standorte" repräsentieren einen geografischen Ort, an dem ein Händler Geschäfte betreibt, wie beispielsweise ein Einzelhandelsgeschäft oder ein Lager. Sie finden weitere Informationen über die Beziehungen zwischen diesen Objekten [hier](https://shopify.dev/docs/apps/build/orders-fulfillment/inventory-management-apps/manage-quantities-states#inventory-object-relationships). Um die Mengen einer Produktvariante zu aktualisieren, müssen wir die Lagerbestände für einen bestimmten Artikel an einem bestimmten Standort ändern (im GraphQL-Jargon: aktualisieren). Mit diesem Wissen können wir unseren Anwendungsworkflow in MobileTogether Designer starten, indem wir den Benutzer zunächst bitten, den Standort auszuwählen, an dem wir die Lagerbestände erfassen: ![Start der Shopify-Bestandsverwaltung-App](/blog/images/shopify-location.png) Um die Standorttabelle für einen Shopify-Shop zu füllen, werden wir eine MapForce-Zuordnung verwenden, um alle Standorte abzufragen. ![Auswahl von Shopify-Standorten](/blog/images/shopify-locations.png) Hier ist die GraphQL-Abfrage, die wir im Shopify/GraphQL-Webanfrage-Komponente auf der linken Seite verwenden werden: `{`     `locations(first: 100) {`         `nodes {`             `id`             `name`         `}`     `}` `}` Als Nächstes werden wir diese Zuordnung auf dem MapForce Server bereitstellen und den [FlowForce Server](https://www.altova.com/de/flowforceserver) nutzen, um sie als Webdienst verfügbar zu machen: ![FlowForce-Einstellungen für Aufgaben](/blog/images/flowforce-job.png) Vergessen Sie nicht, diese Funktion als Webdienst über HTTP(S) bereitzustellen: ![FlowForce als Webdienst](/blog/images/flowforce-service-locations.png) Fügen Sie als Nächstes einen neuen FlowForce-Job als neue Quelle für die erste Anwendungsseite im MobileTogether Designer hinzu. ![FlowForce in MobileTogether](/blog/images/flowforce-mobiletogether.png) Bitte beachten Sie, dass die URL auf den Hostnamen des FlowForce-Servers verweisen sollte, es sei denn, der FlowForce-Server und der MobileTogether-Server laufen auf derselben Maschine. In diesem Fall funktioniert "localhost". Obwohl wir für unser Beispiel, das auf einer lokalen Maschine läuft, einfach "http:" verwenden, sollten Sie in jeder Produktionsumgebung aus Sicherheitsgründen unbedingt "https:" verwenden. Wenn wir unsere App jetzt in der MobileTogether-Umgebung testen.. [App-Simulator](https://www.altova.com/de/mobiletogether/app-simulator) Wir werden etwas Ähnliches sehen: ![Bestandsverwaltung-App im Simulator](/blog/images/simulated-app.png) Nachdem der Standort festgelegt wurde, konfigurieren wir die nächste Seite in der App, um einen Barcode und eine Menge abzufragen. Diese Informationen werden dann an die nächste MapForce-Zuordnung weitergeleitet. Dadurch wird die aktuelle Lagerbestandsmenge des Artikels, der dem Barcode zugeordnet ist, aktualisiert. ![Shopify-Datenzuordnung](/blog/images/shopify-mapping.png) Hier wird der erste Shopify-Webservice-Aufruf über GraphQL verwendet, um die Artikel-ID für den angegebenen Barcode abzurufen: `query ($query: String = null) {`     `productVariants(first: 1, query: $query) {`         `nodes {`             `id`             `barcode`             `inventoryItem {`                 `id`             `}`         `}`     `}` `}` Und der zweite Aufruf des Shopify-Webservices sendet dann die Anfrage zur Aktualisierung des aktuellen Lagerbestands mutation InventorySet($input: InventorySetQuantitiesInput!) {     `inventorySetQuantities(input: $input) {`         `inventoryAdjustmentGroup {`             `createdAt`             `reason`             `referenceDocumentUri`             `changes {`                 `name`                 `delta`             `}`         `}`         `userErrors {`             `field`             `message`         `}`     `}` `}` Die erstellte Zuordnung kann dann in einem zweiten FlowForce-Prozess verwendet werden: ![FlowForce-Jobparameter für mobile Anwendungen](/blog/images/FlowForce-job-parameters.png) Das können wir dann auch als Webdienst über HTTP bereitstellen ![Zweiter FlowForce-Service](/blog/images/flowforce-service2.png) Nutzen wir diese Zuordnung, die jetzt als HTTP-Dienst auf der zweiten Seite der mobilen Anwendung in MobileTogether Designer verfügbar ist: ![Zweite Seite der mobilen Inventar-App](/blog/images/app-page2.png) Hier wird der zuvor ausgewählte Standort angezeigt, und es wird darum gebeten, den Barcode und die Menge einzugeben. Das Anklicken des Buttons "Menge aktualisieren" ruft den HTTP-Dienst des FlowForce-Servers auf: ![Aufruf eines FlowForce-Jobs über HTTP](/blog/images/flowforce-http-service.png) Bitte beachten Sie erneut, dass die URL auf den Hostnamen des FlowForce-Servers verweisen sollte, es sei denn, der FlowForce-Server und der MobileTogether-Server laufen auf derselben Maschine. Das Ergebnis der Mutation werden wir auf der dritten Seite der mobilen Anwendung zeigen… ![Aktualisierungsschritt für den Lagerbestand](/blog/images/updating-inventory.png) …wobei der "Fortfahren"-Button uns zurück zur zweiten Seite führen würde, um einen neuen Barcode und eine neue Menge für den nächsten Artikel bei der Inventur einzugeben. Der vollständige Arbeitsablauf könnte wie folgt aussehen. Standort auswählen: ![Bestandsaufnahme-App, Schritt 1](/blog/images/step1.png) Bitte geben Sie den Barcode und die Menge (über den Scanner) ein: ![Bestandsaufnahme-App, Schritt 2](/blog/images/step2.png) Aktualisieren und Bestätigung erhalten: ![Bestandsaufnahme-App, Schritt 3](/blog/images/step3.png) ## Was kommt als nächstes? Jetzt, da unsere Barcode-Scanner-App fertig ist, wird sie.. [bereitgestellt auf dem MobileTogether Server](https://www.altova.com/de/data-platform) Dadurch kann es auf mobilen Geräten ausgeführt werden. Die App funktioniert auf mobilen Geräten, die einen integrierten Hardware-Barcode-Scanner besitzen, mit dem Barcodes mit einem Knopfdruck gescannt und eingegeben werden können. MobileTogether unterstützt außerdem.. [Externe, kabellose Barcode-Scanner](https://www.altova.com/de/mobiletogether/mobile-scanner-apps#config) (wie Zebra oder Datalogic), die in den Arbeitsablauf der mobilen App integriert werden können. Die Integration von MapForce mit Shopify ist im Projekt "MapForce Examples" enthalten, das mit der Software ausgeliefert wird (Datei: Shopify_UpdateInventory.mfd). Sie können Ihren eigenen Shopify-Shopnamen und Ihren Zugriffstoken eingeben, um die Integration zu testen. Alle in diesem Beispiel verwendeten Altova-Produkte sind erhältlich für.. [kostenlose Testversion](https://www.altova.com/de/download)und MobileTogether Designer ist ein kostenloses Produkt.