Bilder mit Cloud Vision und Firebase Auth und Firebase-Funktionen auf Apple-Plattformen sicher beschriften

Wenn Sie eine Google Cloud API über Ihre App aufrufen möchten, müssen Sie eine REST API 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 Zwischenservice zu authentifizieren und mit ihm zu kommunizieren.

Eine Möglichkeit, diese REST API zu erstellen, ist die Verwendung von Firebase Authentication und Functions. Damit erhalten Sie ein verwaltetes, serverloses Gateway für 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 diese Methode verwenden, um die Cloud Vision API aus Ihrer App aufzurufen. 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 Firebase noch nicht in Ihre App eingebunden haben, folgen Sie der Anleitung für den Einstieg.

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
  4. Wählen Sie die Firebase ML-Bibliothek aus.
  5. Fügen Sie das Flag -ObjC dem Abschnitt Other Linker Flags (Weitere Linker-Flags) der Build-Einstellungen Ihres Ziels hinzu.
  6. 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;

Es sind nur noch wenige Konfigurationsschritte erforderlich:

  1. Wenn Sie cloudbasierte APIs für Ihr Projekt noch nicht aktiviert haben, holen Sie dies jetzt nach:

    1. Öffnen Sie in der Firebase-Konsole die Seite Firebase ML APIs.
    2. Wenn Sie Ihr Projekt noch nicht auf den Blaze-Tarif (Pay as you go) umgestellt haben, klicken Sie auf Upgraden, um dies zu tun. Sie werden nur dann zum Upgraden aufgefordert, wenn Ihr Projekt nicht im Blaze-Tarif ist.

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

    3. Wenn cloudbasierte APIs noch nicht aktiviert sind, klicken Sie auf Cloudbasierte 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 Abschnitt „Schlüsseleinschränkungen“ alle verfügbaren APIs mit Ausnahme der Cloud Vision API in die Liste ein.

Aufrufbare Funktion bereitstellen

Als Nächstes stellen Sie die Cloud Functions-Funktion bereit, mit der Sie Ihre App und die Cloud Vision API 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 an unterschiedliche Anforderungen anpassen.

So stellen Sie die Funktion bereit:

  1. Klonen oder laden Sie das functions-samples-Repository herunter und wechseln Sie in das 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 Verzeichnis vision-annotate-image. Wählen Sie bei Aufforderung Ihr Projekt in der Liste aus.
    firebase init
  5. Die Funktion bereitstellen:
    firebase deploy --only functions:annotateImage

Firebase Authentication zu Ihrer App hinzufügen

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

Fügen Sie Ihrer App die erforderlichen Abhängigkeiten hinzu

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

Jetzt können Sie Bilder labeln.

1. Eingabebild vorbereiten

Damit Cloud Vision aufgerufen werden kann, 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 das Bild zu kennzeichnen

Um Objekte in einem Bild zu kennzeichnen, rufen Sie die aufrufbare Funktion auf und übergeben Sie eine JSON-Cloud Vision-Anfrage.

  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 mit Typ auf LABEL_DETECTION:

    Swift

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

    Objective-C

    NSDictionary *requestData = @{
      @"image": @{@"content": base64encodedImage},
      @"features": @{@"maxResults": @5, @"type": @"LABEL_DETECTION"}
    };
    
  3. Rufen Sie die Funktion schließlich 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 gelabelten Objekten abrufen

Wenn der Vorgang zum Labeln von Bildern erfolgreich ist, wird im Ergebnis der Aufgabe eine JSON-Antwort vom Typ BatchAnnotateImagesResponse zurückgegeben. Jedes Objekt im labelAnnotations-Array steht für etwas, das im Bild gekennzeichnet wurde. Für jedes Label können Sie die Textbeschreibung des Labels, 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])?["labelAnnotations"] as? [[String:Any]] {
  for labelObj in labelArray {
    let text = labelObj["description"]
    let entityId = labelObj["mid"]
    let confidence = labelObj["score"]
  }
}

Objective-C

NSArray *labelArray = result.data[@"labelAnnotations"];
for (NSDictionary *labelObj in labelArray) {
  NSString *text = labelObj[@"description"];
  NSString *entityId = labelObj[@"mid"];
  NSNumber *confidence = labelObj[@"score"];
}