1. مقدمة
في عصر التطبيقات المستندة إلى البيانات، تزايدت أهمية الاستفادة من خدمات تعلُّم الآلة المتقدّمة والذكاء الاصطناعي، مثل تقنية الرؤية الحاسوبية، بشكل متزايد. إحدى هذه الخدمات هي Vision API التي توفّر إمكانيات فعّالة لتحليل الصور. في هذا الدرس التطبيقي حول الترميز، ستتعلم كيفية إنشاء تطبيق Computer Vision باستخدام Spring Boot وJava، مما يمكّنك من إطلاق العنان لإمكانات التعرف على الصور وتحليلها في مشروعاتك. ستقبل واجهة مستخدم التطبيق عناوين URL العامة للصور التي تحتوي على نص مكتوب أو مطبوع كإدخال، وتستخرج النص، وتكتشف اللغة، وإذا كانت إحدى اللغات المعتمدة، سيتم إنشاء الترجمة الإنجليزية لذلك النص.
ما الذي ستقوم ببنائه
ستقوم بإنشاء
- تطبيق Java Spring Boot لاستخدام Vision API وGoogle Cloud Translation API
- تم النشر على Cloud Run
2. المتطلبات
في ما يلي المتطلبات الأساسية:
إنشاء مشروعك
- حساب على Google Cloud يتضمن مشروعًا تم إنشاؤه وتم تفعيل الفوترة
- تم تفعيل واجهات برمجة تطبيقات Vision API وTranslation وCloud Run و Artifact Registry
- تم تفعيل Cloud Shell.
- تم تفعيل Cloud Storage API من خلال حزمة تم إنشاؤها وتحميل صور تحتوي على نص أو كتابة بخط اليد باللغات المحلية المتوافقة (أو يمكنك استخدام نماذج روابط الصور المتوفّرة في هذه المدوّنة).
ارجع إلى المستندات للاطّلاع على خطوات كيفية تفعيل Google Cloud APIs.
تفعيل Cloud Shell
- ستستخدم Cloud Shell، وهي بيئة سطر أوامر تعمل في Google Cloud وتكون محمَّلة مسبقًا بـ bq:
من Cloud Console، انقر على "تفعيل Cloud Shell" في أعلى يسار الصفحة.
- بعد الربط بخدمة Cloud Shell، من المفترَض أن يظهر لك أنّه سبق أن تمت مصادقتك وأنّ المشروع قد تم ضبطه على رقم تعريف مشروعك. شغِّل الأمر التالي في Cloud Shell لتأكيد مصادقتك:
gcloud auth list
- شغّل الأمر التالي في Cloud Shell للتأكد من معرفة الأمر gcloud بمشروعك
gcloud config list project
- إذا لم يتم ضبط مشروعك، استخدِم الأمر التالي لضبطه:
gcloud config set project <PROJECT_ID>
يمكنك الرجوع إلى المستندات حول أوامر gcloud واستخدامها.
3- تجميع عينات عشوائية لتمهيد الربيع
للبدء، عليك إنشاء مشروع Spring Boot جديد باستخدام بيئة IDE أو Spring Initializr المفضّلة لديك. عليك تضمين الاعتماديات اللازمة، مثل Spring Web وSpring Cloud GCP وVision AI، في إعدادات مشروعك. بدلاً من ذلك، يمكنك استخدام Spring Initializr من Cloud Shell باستخدام الخطوات أدناه لبدء تشغيل تطبيق Spring Boot بسهولة.
شغِّل الأمر التالي لإنشاء مشروع Spring Boot:
curl https://start.spring.io/starter.tgz -d packaging=jar -d dependencies=cloud-gcp,web,lombok -d baseDir=spring-vision -d type=maven-project -d bootVersion=3.0.1.RELEASE | tar -xzvf -
spring-vision هو اسم مشروعك، ويمكنك تغييره حسب متطلباتك.
bootVersion هو إصدار Spring Boot، لذا احرص على تحديثه إذا لزم الأمر في وقت التنفيذ.
type هي إصدار نوع أداة إنشاء المشروع، ويمكنك تغييره إلى gradle إذا كنت تفضّل ذلك.
يؤدي هذا إلى إنشاء هيكل للمشروع ضمن "رؤية الربيع" على النحو التالي:
يحتوي ملف pom.xml على جميع الاعتماديات الخاصة بالمشروع (سبق أن تمت إضافة الملحقات التي ضبطتها باستخدام هذا الأمر في ملف pom.xml).
تتضمّن src/main/java/com/example/demo ملفات فئات المصدر .java.
تحتوي resources على الصور وXML والملفات النصية والمحتوى الثابت الذي يستخدمه المشروع، ويتمّ الاحتفاظ به بشكل مستقل.
يتيح لك application.properties الحفاظ على ميزات المشرف لتحديد المواقع الإلكترونية للملف الشخصي للتطبيق.
4. ضبط واجهة Vision API
بعد تفعيل Vision API، يتوفّر لك خيار ضبط بيانات اعتماد واجهة برمجة التطبيقات في تطبيقك. ويمكنك اختياريًا استخدام بيانات الاعتماد التلقائية للتطبيق لإعداد المصادقة. لم أنفِّذ استخدام بيانات الاعتماد في هذا العرض التوضيحي.
تنفيذ خدمات الترجمة والرؤية
إنشاء فئة خدمة تتفاعل مع Vision API يمكنك إدخال الاعتماديات اللازمة واستخدام برنامج Vision API لإرسال طلبات تحليل الصور. يمكنك تنفيذ طرق لتنفيذ مهام، مثل تصنيف الصور والتعرّف على الوجوه والتعرّف على الوجه والمزيد، بناءً على متطلبات تطبيقك. في هذا العرض التوضيحي، سنستخدم طرق استخراج الكتابة بخط اليد والترجمة.
لهذا السبب، تأكَّد من تضمين التبعيات التالية في pom.xml.
<dependency>
<groupId>org.springframework.cloud</groupId>
<artifactId>spring-cloud-gcp-starter-vision</artifactId>
</dependency>
<dependency>
<groupId>com.google.cloud</groupId>
<artifactId>google-cloud-translate</artifactId>
</dependency>
استنساخ الملفات التالية أو استبدِلها من repo وأضِفها إلى المجلدات/المسار المعنيَين في بنية المشروع:
- Application.java (/src/main/java/com/example/demo)
- TranslateText.java (/src/main/java/com/example/demo)
- VisionController.java (/src/main/java/com/example/demo)
- index.html (/src/main/resources/static)
- results.html (/src/main/resources/templates)
- pom.xml
تتيح لك الطريقة extractTextFromImage
في الخدمة org.springframework.cloud.gcp.vision.CloudVisionTemplate
استخراج النص من الصورة التي تم إدخالها. تتيح لك الطريقة getTranslatedText
من الخدمة com.google.cloud.translate.v3
تمرير النص المُستخرَج من صورتك والحصول على النص المُترجَم باللغة الهدف المطلوبة كردّ (إذا كان المصدر في إحدى قائمة اللغات المتوافقة).
إنشاء واجهة برمجة تطبيقات REST
تصميم وتنفيذ نقاط نهاية REST التي ستعرض وظائف Vision API. إنشاء وحدات تحكم تتعامل مع الطلبات الواردة وتستخدم خدمة Vision API لمعالجة الصور وعرض نتائج التحليل. في هذا العرض التوضيحي، تنفِّذ فئة VisionController
نقطة النهاية، وتعالج الطلب الوارد، وتستدعي خدمتَي Vision API وCloud Translation، وتعرِض النتيجة إلى طبقة العرض. فيما يلي تنفيذ طريقة GET لنقطة نهاية REST:
@GetMapping("/extractText")
public String extractText(String imageUrl) throws IOException {
String textFromImage =
this.cloudVisionTemplate.extractTextFromImage(this.resourceLoader.getResource(imageUrl));
TranslateText translateText = new TranslateText();
String result = translateText.translateText(textFromImage);
return "Text from image translated: " + result;
}
تستخدم الفئة TranslateText
في التنفيذ أعلاه الطريقة التي تستدعي خدمة Cloud Translation:
String targetLanguage = "en";
TranslateTextRequest request =
TranslateTextRequest.newBuilder()
.setParent(parent.toString())
.setMimeType("text/plain")
.setTargetLanguageCode(targetLanguage)
.addContents(text)
.build();
TranslateTextResponse response = client.translateText(request);
// Display the translation for each input text provided
for (Translation translation : response.getTranslationsList()) {
res = res + " ::: " + translation.getTranslatedText();
System.out.printf("Translated text : %s\n", res);
}
مع الفئة VisionController
، لدينا طريقة GET لـ REST المنفذة.
دمج Thymeleaf لتطوير الواجهة الأمامية
عند إنشاء تطبيق باستخدام Spring Boot، فإن أحد الخيارات الشائعة لتطوير الواجهة الأمامية هو الاستفادة من قوة Thymeleaf. Thymeleaf هو محرّك نماذج Java من جهة الخادم يسمح لك بدمج المحتوى الديناميكي بسلاسة في صفحات HTML الخاصة بك. يوفِّر تطبيق Thymeleaf تجربة تطوير سلسة من خلال السماح لك بإنشاء نماذج HTML باستخدام تعبيرات مضمَّنة من جهة الخادم. ويمكن استخدام هذه التعبيرات لعرض البيانات ديناميكيًا من الخلفية في Spring Boot، ما يسهِّل عرض نتائج تحليل الصور الذي تجريه خدمة Vision API.
للبدء، تأكد من أن لديك التبعيات اللازمة لـ Thymeleaf في مشروع Spring Boot. يمكنك تضمين تبعية Thymeleaf Starter في ملف pom.xml:
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>
في طريقة وحدة التحكم، استرجع نتيجة التحليل من خدمة Vision API وأضفها إلى النموذج. يمثل النموذج البيانات التي سيستخدمها Thymeleaf لعرض نموذج HTML. بمجرد تعبئة النموذج، قم بإرجاع اسم قالب Thymeleaf الذي تريد عرضه. سيتولى Thymeleaf معالجة النموذج واستبدال تعبيرات جانب الخادم بالبيانات الفعلية وإنشاء محتوى HTML النهائي الذي سيتم إرساله إلى متصفّح العميل.
في حالة استخدام طريقة extractText
في VisionController
، نرجع إلى النتيجة على أنّها String
إلى النموذج ولم تتمّ إضافتها. ولكننا استدعينا طريقة GET extractText
على index.html
عند إرسال الصفحة. يتيح لك تطبيق Thymeleaf تجربة مستخدم سلسة حيث يمكن للمستخدمين تحميل الصور وإجراء تحليلات Vision API وعرض النتائج في الوقت الفعلي. استفِد إلى أقصى حد من إمكانات تطبيق Vision AI من خلال الاستفادة من إمكانيات Thymeleaf في تطوير الواجهة الأمامية.
<form action="/extractText">
Web URL of image to analyze:
<input type="text"
name="imageUrl"
value=""
<input type="submit" value="Read and Translate" />
</form>
5- نشر تطبيق رؤية الكمبيوتر على Cloud Run
اكتب اختبارات الوحدة لفئة الخدمة ووحدة التحكّم لضمان الأداء الوظيفي المناسب ضمن المجلد /src/test/java/com/example
. بعد التأكّد من استقرارها، يمكنك تجميع البيانات في عنصر قابل للنشر، مثل ملف JAR، ونشرها في Cloud Run، وهي منصة حوسبة بدون خادم على Google Cloud. في هذه الخطوة، سنركّز على نشر تطبيق Spring Boot المتوفّر في الحاوية باستخدام Cloud Run.
- يمكنك إنشاء حزمة للتطبيق عن طريق تنفيذ الخطوات التالية من Cloud Shell(تأكَّد من أنّ الوحدة الطرفية تطلب الطلب في المجلد الجذر ضمن المشروع).
الإصدار:
./mvnw package
بعد نجاح عملية الإنشاء، يمكنك التشغيل محليًا لاختبار ما يلي:
./mvnw spring-boot:run
- احتفِظ بتطبيق Spring Boot في حاويات مع Jib:
بدلاً من إنشاء Dockerfile
يدويًا وإنشاء صورة الحاوية، يمكنك استخدام أداة Jib لتبسيط عملية إنشاء الحاوية. Jib هو مكوّن إضافي يتكامل مباشرةً مع أداة التصميم (مثل Maven أو Gradle) ويتيح لك إنشاء صور حاويات محسّنة بدون كتابة Dockerfile
. قبل المتابعة، عليك تفعيل واجهة برمجة تطبيقات Artifact Registry (ويُنصح باستخدام Artifact Registry عبر سجلّ الحاوية). ثم قم بتشغيل Jib لإنشاء صورة Docker ونشرها على السجل:
$ ./mvnw com.google.cloud.tools:jib-maven-plugin:3.1.1:build -Dimage=gcr.io/$GOOGLE_CLOUD_PROJECT/vision-jib
ملاحظة: في هذه التجربة، لم نضبط مكوّن Jib Maven الإضافي في pom.xml، ولكن يمكن إضافته في ملف pom.xml مع المزيد من خيارات الإعداد للاستخدام المتقدّم.
- انشر الحاوية (التي أرسلناها إلى Artifact Registry في الخطوة السابقة) على Cloud Run. هذه مرة أخرى عبارة عن خطوة واحدة:
gcloud run deploy vision-app --image gcr.io/$GOOGLE_CLOUD_PROJECT/vision-jib --platform managed --region us-central1 --allow-unauthenticated --update-env-vars
ويمكنك بدلاً من ذلك إجراء ذلك من واجهة المستخدم أيضًا. انتقِل إلى Google Cloud Console وحدِّد موقع خدمة Cloud Run. انقر على "إنشاء خدمة" واتّبِع التعليمات الظاهرة على الشاشة حدِّد صورة الحاوية التي أرسلتها من قبل إلى قاعدة بيانات المسجّلين واضبط إعدادات النشر المطلوبة (مثل تخصيص وحدة المعالجة المركزية (CPU) والقياس التلقائي)، واختَر المنطقة المناسبة للنشر. يمكنك ضبط متغيّرات البيئة الخاصة بتطبيقك. ويمكن أن تشمل هذه المتغيّرات بيانات اعتماد المصادقة (مفاتيح واجهة برمجة التطبيقات وغيرها) أو سلاسل اتصال قاعدة البيانات أو أي إعدادات أخرى مطلوبة لكي يعمل تطبيق Vision AI بشكل صحيح. وعند اكتمال النشر بنجاح، من المفترض أن تحصل على نقطة نهاية لتطبيقك.
استخدام تطبيق Vision AI
لأغراض التوضيح، يمكنك استخدام عنوان URL للصورة أدناه ليقرأه تطبيقك ويترجمه: https://storage.googleapis.com/img_public_test/tamilwriting1.jfif.
6- تَنظيم
لتجنُّب تحصيل رسوم من حسابك على Google Cloud مقابل الموارد المُستخدَمة في هذه المشاركة، يُرجى اتّباع الخطوات التالية:
- في Google Cloud Console، انتقِل إلى صفحة "إدارة الموارد".
- في قائمة المشاريع، اختَر المشروع الذي تريد حذفه، ثم انقر على "حذف".
- في مربّع الحوار، اكتب معرّف المشروع، ثم انقر على "إيقاف التشغيل" لحذف المشروع.
7. تهانينا
تهانينا! لقد نجحت في إنشاء تطبيق Vision AI باستخدام Spring Boot وJava. باستخدام ميزة Vision AI، يمكن لتطبيقك الآن إجراء تحليل متطوّر للصور، بما في ذلك تصنيف الصور والتعرّف على الوجوه وغير ذلك. يوفّر دمج Spring Boot أساسًا متينًا لإنشاء تطبيقات فعّالة وقابلة للتطوير على Google Cloud Native. يمكنك مواصلة استكشاف الإمكانات الكبيرة للذكاء الاصطناعي Vision AI وCloud Run وCloud Translation وغيرها لتحسين تطبيقك باستخدام ميزات ووظائف إضافية. لمزيد من المعلومات، يمكنك الاطّلاع على مستندات Vision API وCloud Translation وGCP Spring. يمكنك تجربة التجربة نفسها مع الخيار Spring Native. بالإضافة إلى لمحة سريعة عن عالم الذكاء الاصطناعي التوليدي، اطّلِع على كيفية ظهور واجهة برمجة التطبيقات هذه في Model Garden.