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.

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 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.

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
• 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.

In Shopify kann es viele.. Produkteund jedes Produkt kann ein oder mehrere Produktmerkmale haben VariantenIntern ist für jede Produktvariante genau ein.. BestandspositionEin Artikel im Lagerbestand kann mehrere.. LagerbeständeEin Lagerbestand pro Einheit StandortUnd "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.

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:

Um die Standorttabelle für einen Shopify-Shop zu füllen, werden wir eine MapForce-Zuordnung verwenden, um alle Standorte abzufragen.

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 nutzen, um sie als Webdienst verfügbar zu machen:

Vergessen Sie nicht, diese Funktion als Webdienst über HTTP(S) bereitzustellen:

Fügen Sie als Nächstes einen neuen FlowForce-Job als neue Quelle für die erste Anwendungsseite im MobileTogether Designer hinzu.

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 Wir werden etwas Ähnliches sehen:

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.

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:

Das können wir dann auch als Webdienst über HTTP bereitstellen

Nutzen wir diese Zuordnung, die jetzt als HTTP-Dienst auf der zweiten Seite der mobilen Anwendung in MobileTogether Designer verfügbar ist:

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:

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…

…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:

Bitte geben Sie den Barcode und die Menge (über den Scanner) ein:

Aktualisieren und Bestätigung erhalten:

Was kommt als nächstes?

Jetzt, da unsere Barcode-Scanner-App fertig ist, wird sie.. bereitgestellt auf dem MobileTogether Server 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 (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 Testversionund MobileTogether Designer ist ein kostenloses Produkt.