التعرف على النص في الصور بأمان باستخدام Cloud Vision باستخدام مصادقة Firebase والوظائف على Android

من أجل استدعاء Google Cloud API من تطبيقك ، تحتاج إلى إنشاء واجهة برمجة تطبيقات REST وسيطة تتعامل مع التفويض وتحمي القيم السرية مثل مفاتيح واجهة برمجة التطبيقات. تحتاج بعد ذلك إلى كتابة رمز في تطبيق الهاتف المحمول الخاص بك للمصادقة على هذه الخدمة الوسيطة والتواصل معها.

تتمثل إحدى طرق إنشاء واجهة برمجة تطبيقات REST هذه في استخدام مصادقة ووظائف Firebase ، والتي تمنحك بوابة مُدارة بدون خادم إلى Google Cloud APIs التي تتعامل مع المصادقة ويمكن استدعاؤها من تطبيق الهاتف المحمول الخاص بك باستخدام حزم SDK سابقة الإنشاء.

يوضح هذا الدليل كيفية استخدام هذه التقنية لاستدعاء Cloud Vision API من تطبيقك. ستسمح هذه الطريقة لجميع المستخدمين المعتمدين بالوصول إلى خدمات Cloud Vision التي تتم فوترتها من خلال مشروع Cloud الخاص بك ، لذلك ضع في اعتبارك ما إذا كانت آلية المصادقة هذه كافية لحالة الاستخدام الخاصة بك قبل المتابعة.

قبل ان تبدأ

تكوين مشروعك

  1. أضف Firebase إلى مشروع Android ، إذا لم تكن قد قمت بذلك بالفعل.

  2. إذا لم تكن قد قمت بالفعل بتمكين واجهات برمجة التطبيقات المستندة إلى السحابة لمشروعك ، فقم بذلك الآن:

    1. افتح صفحة Firebase ML APIs بوحدة تحكم Firebase.

    2. إذا لم تكن قد قمت بالفعل بترقية مشروعك إلى خطة تسعير Blaze ، فانقر فوق ترقية للقيام بذلك. (ستتم مطالبتك بالترقية فقط إذا لم يكن مشروعك مدرجًا في خطة Blaze.)

      يمكن فقط للمشاريع على مستوى Blaze استخدام واجهات برمجة التطبيقات المستندة إلى السحابة.

    3. إذا لم تكن واجهات برمجة التطبيقات المستندة إلى السحابة ممكّنة بالفعل ، فانقر فوق تمكين واجهات برمجة التطبيقات المستندة إلى السحابة .
  3. هيئ مفاتيح Firebase API الحالية لعدم السماح بالوصول إلى Cloud Vision API:
    1. افتح صفحة بيانات الاعتماد الخاصة بوحدة التحكم السحابية.
    2. لكل مفتاح API في القائمة ، افتح عرض التحرير ، وفي قسم Key Restrictions ، أضف جميع واجهات برمجة التطبيقات المتاحة باستثناء Cloud Vision API إلى القائمة.

انشر الوظيفة القابلة للاستدعاء

بعد ذلك ، انشر وظيفة السحابة التي ستستخدمها لربط تطبيقك وواجهة Cloud Vision API. يحتوي مستودع functions-samples على مثال يمكنك استخدامه.

بشكل افتراضي ، سيسمح الوصول إلى Cloud Vision API من خلال هذه الوظيفة للمستخدمين المعتمدين فقط من تطبيقك بالوصول إلى Cloud Vision API. يمكنك تعديل الوظيفة لمتطلبات مختلفة.

لنشر الوظيفة:

  1. استنساخ أو تنزيل الريبو الخاص بعينات الوظائف والتغيير إلى دليل Vision vision-annotate-image :
    git clone https://github.com/firebase/functions-samples
cd vision-annotate-image
  2. تثبيت التبعيات:
    cd functions
npm install
cd ..
  3. إذا لم يكن لديك Firebase CLI ، فثبته .
  4. ابدأ مشروع Firebase في دليل Vision vision-annotate-image . عند المطالبة ، حدد مشروعك من القائمة. 
    firebase init
  5. انشر الوظيفة: 
    firebase deploy --only functions:annotateImage

أضف Firebase Auth إلى تطبيقك

سترفض الوظيفة القابلة للاستدعاء التي تم نشرها أعلاه أي طلب من المستخدمين غير المصادق عليهم لتطبيقك. إذا لم تكن قد قمت بذلك بالفعل ، فستحتاج إلى إضافة Firebase Auth إلى تطبيقك.

أضف التبعيات الضرورية إلى تطبيقك

  • أضف تبعيات وظائف Firebase ومكتبات gson Android إلى الوحدة النمطية الخاصة بك (مستوى التطبيق) ملف Gradle (عادةً app / build.gradle): 
    implementation 'com.google.firebase:firebase-functions:20.1.0'
implementation 'com.google.code.gson:gson:2.8.6'

    • أنت الآن جاهز لبدء التعرف على النص في الصور.

    1. تحضير صورة الإدخال

    من أجل استدعاء Cloud Vision ، يجب تنسيق الصورة كسلسلة مشفرة base64. لمعالجة صورة من ملف URI محفوظ:
    1. الحصول على Bitmap ككائن نقطي:

      Java

      Bitmap bitmap = MediaStore.Images.Media.getBitmap(getContentResolver(), uri);

      Kotlin+KTX

      var bitmap: Bitmap = MediaStore.Images.Media.getBitmap(contentResolver, uri)
    2. اختياريًا ، قم بتصغير الصورة لحفظها على النطاق الترددي. راجع أحجام الصور الموصى بها من Cloud Vision.

      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

      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

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

      Kotlin+KTX

      // Scale down bitmap size
bitmap = scaleBitmapDown(bitmap, 640)
    3. تحويل كائن الصورة النقطية إلى سلسلة تشفير base64:

      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);

      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)
      4. يجب أن تكون الصورة التي يمثلها كائن Bitmap في وضع مستقيم ، دون الحاجة إلى تدوير إضافي.

    2. استدعاء الدالة القابلة للاستدعاء للتعرف على النص

    للتعرف على نص في صورة ما ، قم باستدعاء الوظيفة القابلة للاستدعاء ، وتمرير طلب JSON Cloud Vision .

    1. أولاً ، قم بتهيئة مثيل من وظائف السحابة:

      Java

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

      Kotlin+KTX

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

    2. حدد طريقة لاستدعاء الوظيفة:

      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()));
                }
            });
}

      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))
            }
}

    3. أنشئ طلب JSON. تدعم Cloud Vision API نوعين من اكتشاف TEXT_DETECTION و DOCUMENT_TEXT_DETECTION . راجع مستندات Cloud Vision OCR لمعرفة الفرق بين حالتي الاستخدام.

      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);

      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

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

      Kotlin+KTX

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

    4. أخيرًا ، قم باستدعاء الوظيفة:

      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
                    // ...
                }
            }
        });

      Kotlin+KTX

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

    3. استخراج نص من كتل النص الذي تم التعرف عليه

    إذا نجحت عملية التعرف على النص ، فسيتم إرجاع استجابة JSON لـ BatchAnnotateImagesResponse في نتيجة المهمة. يمكن العثور على التعليقات التوضيحية النصية في كائن fullTextAnnotation .

    يمكنك الحصول على النص الذي تم التعرف عليه كسلسلة في حقل text . علي سبيل المثال:

    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());

    Kotlin+KTX

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

    يمكنك أيضًا الحصول على معلومات خاصة بمناطق الصورة. لكل block ، paragraph ، word ، symbol ، يمكنك التعرف على النص في المنطقة والإحداثيات المحيطة بالمنطقة. علي سبيل المثال:

    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);
    }
}

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