Back-End für die Bildersuche mit der Vision API-Produktsuche erstellen

1. Hinweis

25939f5a13eeb3c3

Zu Beginn des Lernpfads zur Produktbildsuche haben Sie gelernt, wie Sie ein mit der Vision API-Produktsuche erstelltes Produkt-Back-End nach visuell ähnlichen Produkten aus einem Produktkatalog aufrufen.

In diesem Codelab erfahren Sie, wie Sie ein ähnliches Back-End erstellen, verwenden dafür jedoch Ihren Produktkatalog.

Lerninhalte

  • Back-End für die Produktsuche mit der Vision API-Produktsuche erstellen
  • API-Schlüssel für den Zugriff auf die Vision API über mobile Apps einrichten

Voraussetzungen

  • Google Cloud-Konto mit aktivierter Abrechnung (es kann ein kostenloses Testkonto sein)

2. Vision API-Produktsuche

Die Vision API-Produktsuche ist eine Funktion in Google Cloud, mit der Einzelhändler Produkte erstellen können, die jeweils Referenzbilder enthalten, die das Produkt aus verschiedenen Blickwinkeln beschreiben. Einzelhändler können diese Produkte dann Produktgruppen hinzufügen. Derzeit unterstützt die Vision API-Produktsuche die folgenden Produktkategorien: Haushaltswaren, Bekleidung, Spielzeug, abgepackte Waren und allgemein.

Wenn ein Nutzer seine Produkte mit eigenen Bildern abfragen, wird die Produktsuche in der Vision API-Produktsuche mithilfe des maschinellen Lernens abgeglichen. So wird das Produkt in der Suchanfrage des Nutzers mit den Bildern aus der Produktgruppe verglichen. Anschließend wird eine Rangliste mit optisch und semantisch ähnlichen Ergebnissen zurückgegeben.

3. Back-End mit Google Cloud erstellen

Zuvor haben Sie ein Lern-Back-End der Produktsuche verwendet, das mit der Vision API-Produktsuche erstellt wurde. Erstellen Sie anhand dieser Anleitung ein Back-End in Ihrem Google Cloud-Konto:

Nachdem du die Anleitung abgeschlossen hast, kannst du mit den folgenden Schritten einen API-Schlüssel zum Aufrufen des Back-Ends in deinen mobilen Apps einrichten.

4. API-Schlüssel einrichten

In der Kurzanleitung für die Vision API-Produktsuche haben Sie ein Produktsuch-Back-End erstellt, das ein Abfragebild aufnehmen und visuell ähnliche Produkte zurückgeben kann. Damit die Product Search API über eine mobile App aufgerufen werden kann, müssen Sie einen API-Schlüssel einrichten und dann den Zugriff auf die eigenen mobilen Apps einschränken.

API-Schlüssel erstellen

  1. Gehen Sie zu Cloud Console > APIs & Services > Anmeldedaten. Sie können auch auf diese URL klicken und das Projekt auswählen, das Sie in der Kurzanleitung für die Produktsuche verwendet haben.
  2. Wähle Anmeldedaten erstellen > API-Schlüssel aus. Dieses Dialogfeld wird angezeigt, wenn Ihr API-Schlüssel erfolgreich erstellt wurde:

d0bc04782a41a698

Notieren Sie sich diesen API-Schlüssel. Sie benötigen es später in diesem Codelab.

Zugriff auf den API-Schlüssel einschränken

Wenn die Aufforderung oben angezeigt wird, wähle Schlüssel einschränken aus.

Folgen Sie der Anleitung auf dem Bildschirm, um diese Einschränkungen anzuwenden:

  • App-Einschränkungen &Android-Apps
  • API-Einschränkungen & Schlüssel; Cloud Vision-Schlüssel einschränken

5. App herunterladen und ausführen

Sie können die Android-App, die Sie zuvor erstellt haben, für die das Demo-Produktsuch-Back-End verwendet wurde, ändern und es so anpassen, dass das neu erstellte Back-End verwendet wird.

Code herunterladen

Klicken Sie auf den folgenden Link, um den gesamten Code für dieses Codelab herunterzuladen:

Entpacken Sie die heruntergeladene ZIP-Datei. Dadurch wird ein Root-Ordner (odml-pathway-codelabs) mit allen erforderlichen Ressourcen entpackt. Für dieses Codelab benötigen Sie nur die Quellen im Unterverzeichnis product-search/codelab2/android/final.

In der App werden die ML Kit Object Detection and Tracking API und ein Demo-Back-End für die Produktsuche verwendet, das mit der Vision API-Produktsuche erstellt wurde. Damit können Nutzer ein Foto aufnehmen und nach visuell ähnlichen Produkten im Demoproduktkatalog suchen.

App in Android Studio importieren

Importieren Sie zuerst die Starter-App in Android Studio.

Gehen Sie zu Android Studio und wählen Sie Import Project (Gradle, Eclipse ADT usw.) und den Ordner product-search/codelab2/android/final aus dem Quellcode aus, den Sie zuvor heruntergeladen haben.

7c0f27882a2698ac

Starter-App ausführen

Nachdem Sie das Projekt in Android Studio importiert haben, können Sie die App jetzt zum ersten Mal ausführen.

Verbinden Sie Ihr Android-Gerät per USB mit Ihrem Host oder starten Sie den Android Studio Emulator und klicken Sie in der Symbolleiste von Android Studio auf Ausführen ( Ausführen.png).

Wenn diese Schaltfläche deaktiviert ist, achten Sie darauf, dass Sie nur „final/app/build.gradle“ importieren, nicht das gesamte Repository.

Die App sollte jetzt auf Ihrem Android-Gerät installiert sein. Es funktioniert bereits, verwendet jedoch das Demo-Back-End für die Produktsuche, das Google für Sie bereitgestellt hat.

Als Nächstes aktualisieren Sie die App, um das zuvor in diesem Codelab erstellte Back-End zu verwenden.

6. API-Endpunkte aktualisieren

API-Konfigurationen ändern

Wechseln Sie zur Klasse ProductSearchAPIClient. Die Konfigurationen des Produktsuch-Back-Ends sind bereits definiert. Kommentieren Sie die Konfigurationen des Demo-Back-Ends aus:

// Define the product search backend
// Option 1: Use the demo project that we have already deployed for you
// const val VISION_API_URL =
    "https://us-central1-odml-codelabs.cloudfunctions.net/productSearch"
// const val VISION_API_KEY = ""
// const val VISION_API_PROJECT_ID = "odml-codelabs"
// const val VISION_API_LOCATION_ID = "us-east1"
// const val VISION_API_PRODUCT_SET_ID = "product_set0"

Ersetzen Sie sie anschließend durch Ihre Konfiguration:

// Option 2: Go through the Vision API Product Search quickstart and deploy to your project.
// Fill in the const below with your project info.
const val VISION_API_URL = "https://vision.googleapis.com/v1"
const val VISION_API_KEY = "YOUR_API_KEY"
const val VISION_API_PROJECT_ID = "YOUR_PROJECT_ID"
const val VISION_API_LOCATION_ID = "YOUR_LOCATION_ID"
const val VISION_API_PRODUCT_SET_ID = "YOUR_PRODUCT_SET_ID"
  • VISION_API_URL ist der API-Endpunkt der Cloud Vision API.
  • VISION_API_KEY ist der API-Schlüssel, den Sie zuvor in diesem Codelab erstellt haben.
  • VISION_API_PROJECT_ID, VISION_API_LOCATION_ID, VISION_API_PRODUCT_SET_ID ist der Wert, den Sie in der Kurzanleitung zur Vision API-Produktsuche weiter oben in diesem Codelab verwendet haben.

Ausführen

Klicken Sie in der Android Studio Symbolleiste auf Ausführen (Ausführen.png). Sobald die App geladen wurde, tippen Sie auf eines der voreingestellten Bilder und wählen Sie ein erkanntes Objekt aus. Tippen Sie auf die Schaltfläche Suchen, um die Suchergebnisse aufzurufen. Die Anwendung verwendet nun das soeben erstellte Produkt-Back-End der Produktsuche.

25939f5a13eeb3c3

7. Glückwunsch!

Sie haben gelernt, wie Sie mit der Vision API-Produktsuche ein Back-End für die Produktsuche erstellen.

Mehr ist nicht nötig.

Behandelte Themen

  • Back-End für die Produktsuche mit Ihrem Produktkatalog und der Vision API-Produktsuche erstellen
  • So richten Sie einen API-Schlüssel ein, um das Back-End der Produktsuche aus einer mobilen App aufzurufen
  • Back-End über eine mobile App aufrufen

Nächste Schritte

  • In diesem Video erfahren Sie, wie Sie mit der Vision API-Produktsuche einen intelligenten Kleiderschrank erstellen können.
  • Informieren Sie sich über den ML-Lernpfad für die Produktsuche und lernen Sie alle Schritte zum Erstellen einer Produktsuche kennen.
  • Gelerntes in deiner eigenen App anwenden

Weitere Informationen