Mit Cloud Vision und Firebase Auth und Firebase-Funktionen unter Android Text in Bildern sicher erkennen

Um eine Google Cloud API aus Ihrer Anwendung heraus aufzurufen, müssen Sie eine Zwischendatei REST API, die die Autorisierung verarbeitet und Secret-Werte wie API-Schlüssel schützt. Anschließend müssen Sie Schreiben Sie Code in Ihre mobile App, 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 and Functions, einem verwalteten, serverlosen Gateway, über das Sie Google Cloud APIs, die die Authentifizierung übernehmen und über Ihre mobile App mit vordefinierten SDKs.

In diesem Leitfaden wird gezeigt, wie Sie mit dieser Technik die Cloud Vision API über Ihre Anwendung aufrufen. Mit dieser Methode können alle authentifizierten Nutzer über Ihr Cloud-Projekt auf in Cloud Vision abgerechnete Dienste zugreifen. Prüfen Sie, ob dieser Authentifizierungsmechanismus für Ihren Anwendungsfall ausreicht, bevor Sie fortfahren.

Hinweis

Projekt konfigurieren

  1. Falls noch nicht geschehen, Fügen Sie Firebase zu Ihrem Android-Projekt hinzu.

  2. Wenn Sie noch keine cloudbasierten APIs für Ihr Projekt aktiviert haben, tun Sie dies jetzt. jetzt:

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

    2. Wenn Sie für Ihr Projekt noch kein Upgrade auf das Blaze-Preismodell durchgeführt haben, klicken Sie auf Führen Sie ein Upgrade durch. Sie werden nur dann zum Upgrade aufgefordert, Projekt nicht im Tarif "Blaze" ist.)

      Nur Projekte auf Blaze-Ebene können cloudbasierte APIs verwenden.

    3. Wenn cloudbasierte APIs noch nicht aktiviert sind, klicken Sie auf Cloudbasierte APIs aktivieren.
  3. Vorhandene Firebase API-Schlüssel konfigurieren, um den Zugriff auf die Cloud zu verhindern Vision API:
    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 „Einschränkungen für Schlüssel“ alle verfügbaren APIs außer der Cloud Vision API hinzu.

Aufrufbare Funktion bereitstellen

Stellen Sie als Nächstes die Cloud Functions-Funktion bereit, mit der Sie die Anwendung und die Cloud verbinden möchten Vision API Das Repository functions-samples enthält ein Beispiel die Sie verwenden können.

Wenn Sie über diese Funktion auf die Cloud Vision API zugreifen, Nur authentifizierte Nutzer Ihrer Anwendung haben Zugriff auf die Cloud Vision API. Sie können die Funktion an unterschiedliche Anforderungen anpassen können.

So stellen Sie die Funktion bereit:

  1. Klonen Sie das Repository „functions-samples“ oder laden Sie es 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. Firebase-Projekt in vision-annotate-image initialisieren -Verzeichnis. Wählen Sie Ihr Projekt in der Liste aus, wenn Sie dazu aufgefordert werden. 
    firebase init
  5. Die Funktion bereitstellen: 
    firebase deploy --only functions:annotateImage

Firebase Auth zur 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.

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

  • Abhängigkeiten für die Cloud Functions for Firebase-(Client-) und gcloud-Android-Bibliotheken hinzufügen in die Gradle-Datei des Moduls (auf App-Ebene) (normalerweise <project>/<app-module>/build.gradle.kts oder <project>/<app-module>/build.gradle): 
    implementation("com.google.firebase:firebase-functions:21.0.0")
implementation("com.google.code.gson:gson:2.8.6")

    • Jetzt können Sie mit der Texterkennung in Bildern beginnen.

    1. Eingabebild vorbereiten

    Zum Aufrufen von Cloud Vision muss das Bild als base64-codierter String formatiert werden. Um eine Bild aus dem URI einer gespeicherten Datei:
    1. Rufen Sie das Bild als Bitmap-Objekt ab:

      Kotlin+KTX

      var bitmap: Bitmap = MediaStore.Images.Media.getBitmap(contentResolver, uri)

      Java

      Bitmap bitmap = MediaStore.Images.Media.getBitmap(getContentResolver(), uri);
    2. Optional können Sie das Bild verkleinern, um Bandbreite zu sparen. Siehe Von Cloud Vision empfohlene Bildgrößen.

      Kotlin+KTX

      private fun scaleBitmapDown(bitmap: Bitmap, maxDimension: Int): Bitmap {
    val originalWidth = bitmap.width
    val originalHeight = bitmap.height
    var resizedWidth = maxDimension
    var resizedHeight = maxDimension
    if (originalHeight > originalWidth) {
        resizedHeight = maxDimension
        resizedWidth =
            (resizedHeight * originalWidth.toFloat() / originalHeight.toFloat()).toInt()
    } else if (originalWidth > originalHeight) {
        resizedWidth = maxDimension
        resizedHeight =
            (resizedWidth * originalHeight.toFloat() / originalWidth.toFloat()).toInt()
    } else if (originalHeight == originalWidth) {
        resizedHeight = maxDimension
        resizedWidth = maxDimension
    }
    return Bitmap.createScaledBitmap(bitmap, resizedWidth, resizedHeight, false)
}

      Java

      private Bitmap scaleBitmapDown(Bitmap bitmap, int maxDimension) {
    int originalWidth = bitmap.getWidth();
    int originalHeight = bitmap.getHeight();
    int resizedWidth = maxDimension;
    int resizedHeight = maxDimension;

    if (originalHeight > originalWidth) {
        resizedHeight = maxDimension;
        resizedWidth = (int) (resizedHeight * (float) originalWidth / (float) originalHeight);
    } else if (originalWidth > originalHeight) {
        resizedWidth = maxDimension;
        resizedHeight = (int) (resizedWidth * (float) originalHeight / (float) originalWidth);
    } else if (originalHeight == originalWidth) {
        resizedHeight = maxDimension;
        resizedWidth = maxDimension;
    }
    return Bitmap.createScaledBitmap(bitmap, resizedWidth, resizedHeight, false);
}

      Kotlin+KTX

      // Scale down bitmap size
bitmap = scaleBitmapDown(bitmap, 640)

      Java

      // Scale down bitmap size
bitmap = scaleBitmapDown(bitmap, 640);
    3. Konvertiere das Bitmapobjekt in einen base64-codierten String:

      Kotlin+KTX

      // Convert bitmap to base64 encoded string
val byteArrayOutputStream = ByteArrayOutputStream()
bitmap.compress(Bitmap.CompressFormat.JPEG, 100, byteArrayOutputStream)
val imageBytes: ByteArray = byteArrayOutputStream.toByteArray()
val base64encoded = Base64.encodeToString(imageBytes, Base64.NO_WRAP)

      Java

      // Convert bitmap to base64 encoded string
ByteArrayOutputStream byteArrayOutputStream = new ByteArrayOutputStream();
bitmap.compress(Bitmap.CompressFormat.JPEG, 100, byteArrayOutputStream);
byte[] imageBytes = byteArrayOutputStream.toByteArray();
String base64encoded = Base64.encodeToString(imageBytes, Base64.NO_WRAP);
      4. Das vom Bitmap-Objekt dargestellte Bild muss aufrecht sein und darf nicht zusätzlich gedreht werden.

    2. Rufen Sie die aufrufbare Funktion auf, um Text zu erkennen

    Um Text in einem Bild zu erkennen, rufen Sie die aufrufbare Funktion auf, indem Sie eine JSON-Cloud Vision-Anfrage.

    1. Initialisieren Sie zuerst eine Instanz von Cloud Functions:

      Kotlin+KTX 

      private lateinit var functions: FirebaseFunctions
// ...
functions = Firebase.functions

      Java 

      private FirebaseFunctions mFunctions;
// ...
mFunctions = FirebaseFunctions.getInstance();

    2. Definieren Sie eine Methode zum Aufrufen der Funktion:

      Kotlin+KTX 

      private fun annotateImage(requestJson: String): Task<JsonElement> {
    return functions
        .getHttpsCallable("annotateImage")
        .call(requestJson)
        .continueWith { task ->
            // This continuation runs on either success or failure, but if the task
            // has failed then result will throw an Exception which will be
            // propagated down.
            val result = task.result?.data
            JsonParser.parseString(Gson().toJson(result))
        }
}

      Java 

      private Task<JsonElement> annotateImage(String requestJson) {
    return mFunctions
            .getHttpsCallable("annotateImage")
            .call(requestJson)
            .continueWith(new Continuation<HttpsCallableResult, JsonElement>() {
                @Override
                public JsonElement then(@NonNull Task<HttpsCallableResult> task) {
                    // This continuation runs on either success or failure, but if the task
                    // has failed then getResult() will throw an Exception which will be
                    // propagated down.
                    return JsonParser.parseString(new Gson().toJson(task.getResult().getData()));
                }
            });
}

    3. Erstellen Sie die JSON-Anfrage. Die Cloud Vision API unterstützt zwei Typen der Texterkennung: TEXT_DETECTION und DOCUMENT_TEXT_DETECTION. Cloud Vision-OCR-Dokumentation um die Differenz zwischen den beiden Anwendungsfällen zu ermitteln.

      Kotlin+KTX 

      // Create json request to cloud vision
val request = JsonObject()
// Add image to request
val image = JsonObject()
image.add("content", JsonPrimitive(base64encoded))
request.add("image", image)
// Add features to the request
val feature = JsonObject()
feature.add("type", JsonPrimitive("TEXT_DETECTION"))
// Alternatively, for DOCUMENT_TEXT_DETECTION:
// feature.add("type", JsonPrimitive("DOCUMENT_TEXT_DETECTION"))
val features = JsonArray()
features.add(feature)
request.add("features", features)

      Java 

      // Create json request to cloud vision
JsonObject request = new JsonObject();
// Add image to request
JsonObject image = new JsonObject();
image.add("content", new JsonPrimitive(base64encoded));
request.add("image", image);
//Add features to the request
JsonObject feature = new JsonObject();
feature.add("type", new JsonPrimitive("TEXT_DETECTION"));
// Alternatively, for DOCUMENT_TEXT_DETECTION:
//feature.add("type", new JsonPrimitive("DOCUMENT_TEXT_DETECTION"));
JsonArray features = new JsonArray();
features.add(feature);
request.add("features", features);

      Optional: Gib Sprachhinweise an zur Unterstützung bei der Spracherkennung (siehe Unterstützte Sprachen):

      Kotlin+KTX 

      val imageContext = JsonObject()
val languageHints = JsonArray()
languageHints.add("en")
imageContext.add("languageHints", languageHints)
request.add("imageContext", imageContext)

      Java 

      JsonObject imageContext = new JsonObject();
JsonArray languageHints = new JsonArray();
languageHints.add("en");
imageContext.add("languageHints", languageHints);
request.add("imageContext", imageContext);

    4. Rufen Sie abschließend die folgende Funktion auf:

      Kotlin+KTX 

      annotateImage(request.toString())
    .addOnCompleteListener { task ->
        if (!task.isSuccessful) {
            // Task failed with an exception
            // ...
        } else {
            // Task completed successfully
            // ...
        }
    }

      Java 

      annotateImage(request.toString())
        .addOnCompleteListener(new OnCompleteListener<JsonElement>() {
            @Override
            public void onComplete(@NonNull Task<JsonElement> task) {
                if (!task.isSuccessful()) {
                    // Task failed with an exception
                    // ...
                } else {
                    // Task completed successfully
                    // ...
                }
            }
        });

    3. Text aus erkannten Textblöcken extrahieren

    Wenn der Texterkennungsvorgang erfolgreich war, wird im Ergebnis der Aufgabe eine JSON-Antwort vom Typ BatchAnnotateImagesResponse zurückgegeben. Die Textanmerkungen sind in der fullTextAnnotation-Objekt.

    Sie können den erkannten Text als String im Feld text abrufen. Beispiel:

    Kotlin+KTX 

    val annotation = task.result!!.asJsonArray[0].asJsonObject["fullTextAnnotation"].asJsonObject
System.out.format("%nComplete annotation:")
System.out.format("%n%s", annotation["text"].asString)

    Java 

    JsonObject annotation = task.getResult().getAsJsonArray().get(0).getAsJsonObject().get("fullTextAnnotation").getAsJsonObject();
System.out.format("%nComplete annotation:%n");
System.out.format("%s%n", annotation.get("text").getAsString());

    Sie können auch Informationen zu Regionen des Bildes abrufen. Für jeden block, paragraph, word und symbol, Sie können den Text in der Region erkennen lassen und die Begrenzungskoordinaten der Region. Beispiel:

    Kotlin+KTX 

    for (page in annotation["pages"].asJsonArray) {
    var pageText = ""
    for (block in page.asJsonObject["blocks"].asJsonArray) {
        var blockText = ""
        for (para in block.asJsonObject["paragraphs"].asJsonArray) {
            var paraText = ""
            for (word in para.asJsonObject["words"].asJsonArray) {
                var wordText = ""
                for (symbol in word.asJsonObject["symbols"].asJsonArray) {
                    wordText += symbol.asJsonObject["text"].asString
                    System.out.format(
                        "Symbol text: %s (confidence: %f)%n",
                        symbol.asJsonObject["text"].asString,
                        symbol.asJsonObject["confidence"].asFloat,
                    )
                }
                System.out.format(
                    "Word text: %s (confidence: %f)%n%n",
                    wordText,
                    word.asJsonObject["confidence"].asFloat,
                )
                System.out.format("Word bounding box: %s%n", word.asJsonObject["boundingBox"])
                paraText = String.format("%s%s ", paraText, wordText)
            }
            System.out.format("%nParagraph: %n%s%n", paraText)
            System.out.format("Paragraph bounding box: %s%n", para.asJsonObject["boundingBox"])
            System.out.format("Paragraph Confidence: %f%n", para.asJsonObject["confidence"].asFloat)
            blockText += paraText
        }
        pageText += blockText
    }
}

    Java 

    for (JsonElement page : annotation.get("pages").getAsJsonArray()) {
    StringBuilder pageText = new StringBuilder();
    for (JsonElement block : page.getAsJsonObject().get("blocks").getAsJsonArray()) {
        StringBuilder blockText = new StringBuilder();
        for (JsonElement para : block.getAsJsonObject().get("paragraphs").getAsJsonArray()) {
            StringBuilder paraText = new StringBuilder();
            for (JsonElement word : para.getAsJsonObject().get("words").getAsJsonArray()) {
                StringBuilder wordText = new StringBuilder();
                for (JsonElement symbol : word.getAsJsonObject().get("symbols").getAsJsonArray()) {
                    wordText.append(symbol.getAsJsonObject().get("text").getAsString());
                    System.out.format("Symbol text: %s (confidence: %f)%n", symbol.getAsJsonObject().get("text").getAsString(), symbol.getAsJsonObject().get("confidence").getAsFloat());
                }
                System.out.format("Word text: %s (confidence: %f)%n%n", wordText.toString(), word.getAsJsonObject().get("confidence").getAsFloat());
                System.out.format("Word bounding box: %s%n", word.getAsJsonObject().get("boundingBox"));
                paraText.append(wordText.toString()).append(" ");
            }
            System.out.format("%nParagraph:%n%s%n", paraText);
            System.out.format("Paragraph bounding box: %s%n", para.getAsJsonObject().get("boundingBox"));
            System.out.format("Paragraph Confidence: %f%n", para.getAsJsonObject().get("confidence").getAsFloat());
            blockText.append(paraText);
        }
        pageText.append(blockText);
    }
}