Mit Cloud Vision und Firebase Auth und Firebase-Funktionen auf Apple-Plattformen Sehenswürdigkeiten sicher erkennen

Wenn Sie eine Google Cloud API über Ihre App aufrufen möchten, müssen Sie eine REST API als Zwischenschicht erstellen, die die Autorisierung übernimmt und geheime Werte wie API-Schlüssel schützt. Anschließend müssen Sie Code in Ihrer mobilen App schreiben, um sich bei diesem Zwischendienst zu authentifizieren und mit ihm zu kommunizieren.

Eine Möglichkeit, diese REST API zu erstellen, ist die Verwendung von Firebase Authentication und Functions. Dadurch erhalten Sie ein verwaltetes, serverloses Gateway zu Google Cloud APIs, das die Authentifizierung übernimmt und über Ihre mobile App mit vorgefertigten SDKs aufgerufen werden kann.

In diesem Leitfaden wird gezeigt, wie Sie mit dieser Methode die Cloud Vision API über Ihre App aufrufen. Mit dieser Methode können alle authentifizierten Nutzer über Ihr Cloud-Projekt auf kostenpflichtige Cloud Vision-Dienste zugreifen. Überlegen Sie daher, ob dieser Authentifizierungsmechanismus für Ihren Anwendungsfall ausreichend ist, bevor Sie fortfahren.

Hinweis

Projekt konfigurieren

Wenn Sie Ihrer App noch kein Firebase hinzugefügt haben, folgen Sie der Anleitung im Startleitfaden.

Verwenden Sie Swift Package Manager, um Firebase-Abhängigkeiten zu installieren und zu verwalten.

  1. Öffnen Sie Ihr App-Projekt und gehen Sie in Xcode zu File > Add Packages (Datei > Pakete hinzufügen).
  2. Fügen Sie bei entsprechender Aufforderung das Firebase Apple Platforms SDK-Repository hinzu:
    3.   https://github.com/firebase/firebase-ios-sdk.git
  3. Wählen Sie die Firebase ML Bibliothek aus.
  4. Fügen Sie das Flag -ObjC im Bereich Other Linker Flags (Weitere Verknüpfungsmerker) der Build-Einstellungen Ihres Ziels hinzu.
  5. Wenn Sie fertig, beginnt Xcode automatisch, Ihre Abhängigkeiten im Hintergrund aufzulösen und herunterzuladen.

Führen Sie als Nächstes einige In-App-Einrichtungsschritte aus:

  1. Importieren Sie Firebase in Ihre App:

    Swift

    import FirebaseMLModelDownloader

    Objective-C

    @import FirebaseMLModelDownloader;

Einige weitere Konfigurationsschritte und wir sind bereit:

  1. Wenn Sie Cloud-basierte APIs für Ihr Projekt noch nicht aktiviert haben, tun Sie das jetzt:

    1. Öffnen Sie in der Firebase Konsole die Firebase ML APIs-Seite.

    2. Wenn Sie Ihr Projekt noch nicht auf den Blaze-Tarif (Pay as you go) umgestellt haben, klicken Sie auf Upgrade , um dies zu tun. (Sie werden nur dann aufgefordert, ein Upgrade durchzuführen, wenn Ihr Projekt nicht den Blaze-Tarif verwendet.)

      Nur Projekte mit dem Blaze-Tarif können Cloud-basierte APIs verwenden.

    3. Wenn Cloud-basierte APIs noch nicht aktiviert sind, klicken Sie auf Cloud-basierte APIs aktivieren.
  2. Konfigurieren Sie Ihre vorhandenen Firebase API-Schlüssel so, dass der Zugriff auf die Cloud Vision API nicht zulässig ist:
    1. Öffnen Sie in der Cloud Console die Seite „Anmeldedaten“.
    2. Öffnen Sie für jeden API-Schlüssel in der Liste die Bearbeitungsansicht und fügen Sie im Bereich „Schlüssel Einschränkungen“ alle verfügbaren APIs außer der Cloud Vision API der Liste hinzu.

Aufrufbare Funktion bereitstellen

Stellen Sie als Nächstes die Cloud Functions-Funktion bereit, die Sie verwenden, um Ihre App und die Cloud Vision API zu verbinden. Das functions-samples Repository enthält ein Beispiel das Sie verwenden können.

Standardmäßig können nur authentifizierte Nutzer Ihrer App über diese Funktion auf die Cloud Vision API zugreifen. Sie können die Funktion für verschiedene Anforderungen ändern.

So stellen Sie die Funktion bereit:

  1. Klonen oder laden Sie das Repository „functions-samples“ herunter und wechseln Sie zum Verzeichnis Node-1st-gen/vision-annotate-image: 
    git clone https://github.com/firebase/functions-samples
cd Node-1st-gen/vision-annotate-image
  2. Installieren Sie die Abhängigkeiten: 
    cd functions
npm install
cd ..
  3. Wenn Sie die Firebase CLI nicht haben, installieren Sie sie.
  4. Initialisieren Sie ein Firebase-Projekt im vision-annotate-image Verzeichnis. Wählen Sie bei Aufforderung Ihr Projekt aus der Liste aus. 
    firebase init
  5. Die Funktion bereitstellen: 
    firebase deploy --only functions:annotateImage

Firebase Auth zu Ihrer App hinzufügen

Die oben bereitgestellte aufrufbare Funktion lehnt alle Anfragen von nicht authentifizierten Nutzern Ihrer App ab. Wenn Sie dies noch nicht getan haben, müssen Sie Ihrer App Firebase Auth hinzufügen.

Erforderliche Abhängigkeiten zu Ihrer App hinzufügen

Verwenden Sie Swift Package Manager, um die Cloud Functions for Firebase-Bibliothek zu installieren.

1. Eingabebild vorbereiten

Wenn Sie Cloud Vision aufrufen möchten, muss das Bild als base64-codierter String formatiert sein. So verarbeiten Sie ein UIImage:

Swift

guard let imageData = uiImage.jpegData(compressionQuality: 1.0) else { return }
let base64encodedImage = imageData.base64EncodedString()

Objective-C

NSData *imageData = UIImageJPEGRepresentation(uiImage, 1.0f);
NSString *base64encodedImage =
  [imageData base64EncodedStringWithOptions:NSDataBase64Encoding76CharacterLineLength];

2. Aufrufbare Funktion aufrufen, um Sehenswürdigkeiten zu erkennen

Wenn Sie Sehenswürdigkeiten in einem Bild erkennen möchten, rufen Sie die aufrufbare Funktion auf und übergeben Sie eine JSON-Anfrage an Cloud Vision.

  1. Initialisieren Sie zuerst eine Instanz von Cloud Functions:

    Swift

    lazy var functions = Functions.functions()

    Objective-C

    @property(strong, nonatomic) FIRFunctions *functions;

  2. Erstellen Sie eine Anfrage, bei der der Typ auf LANDMARK_DETECTION festgelegt ist:

    Swift

    let requestData = [
  "image": ["content": base64encodedImage],
  "features": ["maxResults": 5, "type": "LANDMARK_DETECTION"]
]

    Objective-C

    NSDictionary *requestData = @{
  @"image": @{@"content": base64encodedImage},
  @"features": @{@"maxResults": @5, @"type": @"LANDMARK_DETECTION"}
};

  3. Rufen Sie schließlich die Funktion auf:

    Swift

    do {
  let result = try await functions.httpsCallable("annotateImage").call(requestData)
  print(result)
} catch {
  if let error = error as NSError? {
    if error.domain == FunctionsErrorDomain {
      let code = FunctionsErrorCode(rawValue: error.code)
      let message = error.localizedDescription
      let details = error.userInfo[FunctionsErrorDetailsKey]
    }
    // ...
  }
}

    Objective-C

    [[_functions HTTPSCallableWithName:@"annotateImage"]
                          callWithObject:requestData
                              completion:^(FIRHTTPSCallableResult * _Nullable result, NSError * _Nullable error) {
        if (error) {
          if ([error.domain isEqualToString:@"com.firebase.functions"]) {
            FIRFunctionsErrorCode code = error.code;
            NSString *message = error.localizedDescription;
            NSObject *details = error.userInfo[@"details"];
          }
          // ...
        }
        // Function completed succesfully
        // Get information about labeled objects

      }];

3. Informationen zu den erkannten Sehenswürdigkeiten abrufen

Wenn der Vorgang zur Erkennung von Sehenswürdigkeiten erfolgreich ist, wird eine JSON-Antwort von BatchAnnotateImagesResponse im Ergebnis der Aufgabe zurückgegeben. Jedes Objekt im Array landmarkAnnotations stellt eine Sehenswürdigkeit dar, die im Bild erkannt wurde. Für jede Sehenswürdigkeit können Sie die Begrenzungskoordinaten im Eingabebild, den Namen der Sehenswürdigkeit, den Breiten- und Längengrad, die Knowledge Graph-Entitäts-ID (falls verfügbar) und den Konfidenzwert der Übereinstimmung abrufen. Beispiel:

Swift

if let labelArray = (result?.data as? [String: Any])?["landmarkAnnotations"] as? [[String:Any]] {
  for labelObj in labelArray {
    let landmarkName = labelObj["description"]
    let entityId = labelObj["mid"]
    let score = labelObj["score"]
    let bounds = labelObj["boundingPoly"]
    // Multiple locations are possible, e.g., the location of the depicted
    // landmark and the location the picture was taken.
    guard let locations = labelObj["locations"] as? [[String: [String: Any]]] else { continue }
    for location in locations {
      let latitude = location["latLng"]?["latitude"]
      let longitude = location["latLng"]?["longitude"]
    }
  }
}

Objective-C

NSArray *labelArray = result.data[@"landmarkAnnotations"];
for (NSDictionary *labelObj in labelArray) {
  NSString *landmarkName = labelObj[@"description"];
  NSString *entityId = labelObj[@"mid"];
  NSNumber *score = labelObj[@"score"];
  NSArray *bounds = labelObj[@"boundingPoly"];
  // Multiple locations are possible, e.g., the location of the depicted
  // landmark and the location the picture was taken.
  NSArray *locations = labelObj[@"locations"];
  for (NSDictionary *location in locations) {
    NSNumber *latitude = location[@"latLng"][@"latitude"];
    NSNumber *longitude = location[@"latLng"][@"longitude"];
  }
}