קל לראות את הראייה הממוחשבת: Vision AI באתחול האביב וב-Java

1. מבוא

בעידן הנוכחי של אפליקציות מבוססות-נתונים, השימוש בשירותי למידת מכונה מתקדמים ובשירותי בינה מלאכותית (AI) כמו ראייה ממוחשבת הולך וגדל. אחד השירותים האלה הוא Vision API, שמספק יכולות מתקדמות לניתוח תמונות. בשיעור ה-codelab הזה תלמדו איך ליצור אפליקציה של ראיית ממוחשבת באמצעות Spring Boot ו-Java, כדי שתוכלו לממש את הפוטנציאל של זיהוי תמונות וניתוח תמונות בפרויקטים שלכם. ממשק המשתמש של האפליקציה יקבל כקלט, כתובות URL ציבוריות של תמונות שמכילות טקסט כתוב או מודפס, מחלץ את הטקסט, מזהה את השפה ואם זו אחת מהשפות הנתמכות, הוא ייצור תרגום של הטקסט לאנגלית.

מה תפַתחו

תיצור

  • אפליקציה של Java Spring Boot לשימוש ב-Vision API וב-Google Cloud Translation API
  • פרוסות ב-Cloud Run

2. דרישות

  • דפדפן כמו Chrome או Firefox
  • פרויקט ב-Google Cloud שמופעל בו חיוב

אלה הדרישות המוקדמות:

יוצרים פרויקט

  1. חשבון Google Cloud שנוצר בו פרויקט ומופעל בו חיוב
  2. ממשקי ה-API של Vision API, תרגום, Cloud Run ו-Artifact Registry מופעלים
  3. Cloud Shell מופעל
  4. Cloud Storage API הופעל עם קטגוריה שנוצרה ועם תמונות עם טקסט או כתב יד בשפות המקומיות הנתמכות (או באמצעות הקישורים לתמונות לדוגמה שמופיעים בבלוג הזה)

במסמכי העזרה מוסבר איך להפעיל את ממשקי ה-API של Google Cloud.

הפעלת Cloud Shell

  1. תשתמשו ב-Cloud Shell, סביבת שורת הפקודה שרצה ב-Google Cloud וכוללת מראש את bq:

במסוף Cloud, לוחצים על Activate Cloud Shell בפינה הימנית העליונה.

51622c00acec2fa.png

  1. אחרי ההתחברות ל-Cloud Shell, אתם אמורים לראות שכבר בוצע אימות ושהפרויקט כבר מוגדר למזהה הפרויקט שלכם. מריצים את הפקודה הבאה ב-Cloud Shell כדי לוודא שהאימות בוצע:
gcloud auth list
  1. מריצים את הפקודה הבאה ב-Cloud Shell כדי לוודא שהפקודה ב-gcloud יודעת על הפרויקט שלכם.
gcloud config list project
  1. אם הפרויקט לא מוגדר, מגדירים אותו באמצעות הפקודה הבאה:
gcloud config set project <PROJECT_ID>

עיינו במסמכי העזרה לפקודות ולשימוש של gcloud.

3. אתחול פרויקט אתחול באביב

כדי להתחיל, צריך ליצור פרויקט Springboot חדש באמצעות סביבת פיתוח משולבת (IDE) או Spring Initializer. צריך לכלול בהגדרות הפרויקט את יחסי התלות הנדרשים, כמו Spring Web, Spring Cloud GCP ו-Vision AI. לחלופין, אפשר להשתמש ב-Spring Initialzr מ-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 הוא הגרסה של כלי ה-build של הפרויקט. אפשר לשנות אותו לרמת ציון אם רוצים.

37813d3982ce2e42.png

הפעולה הזו יוצרת מבנה של פרויקט לפי 'Spring-vision' כמו בדוגמה הבאה:

3e70d45d88ac6935.png

הקובץ pom.xml מכיל את כל יחסי התלות של הפרויקט (יחסי התלות שהגדרתם באמצעות הפקודה הזו כבר נוספו בקובץ pom.xml).

src/main/java/com/example/demo כולל את קובצי המקור מסוג JavaScript.

המשאבים מכילים את התמונות, ה-XML, קובצי הטקסט והתוכן הסטטי שמשמש את הפרויקט, שמתוחזקים בנפרד.

בעזרת application.properties אפשר לשמור על תכונות הניהול כדי להגדיר מאפיינים ספציפיים לפרופיל של האפליקציה.

4. הגדרת Vision API

אחרי שמפעילים את Vision API, אפשר להגדיר את פרטי הכניסה ל-API באפליקציה. אפשר להשתמש ב-Application Default Credentials להגדרת האימות. עם זאת, בהטמעת ההדגמה לא הטמעתי את השימוש בפרטי כניסה.

יישום של שירותי חזון ותרגום

יצירת סיווג שירות שמקיים אינטראקציה עם 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>

שכפול או החלפה של הקבצים הבאים מהמאגר ומוסיפים אותם לתיקיות או לנתיב המתאימים במבנה הפרויקט:

  1. Application.java (/src/main/java/com/example/demo)
  2. TranslateText.java (/src/main/java/com/example/demo)
  3. VisionController.java (/src/main/java/com/example/demo)
  4. index.html (/src/main/resources/static)
  5. result.html (/src/main/resources/templates)
  6. pom.xml

השיטה extractTextFromImage בשירות org.springframework.cloud.gcp.vision.CloudVisionTemplate מאפשרת לחלץ טקסט מקלט התמונה. השיטה getTranslatedText מהשירות com.google.cloud.translate.v3 מאפשרת להעביר את הטקסט שחולץ מהתמונה ולקבל כתגובה את הטקסט המתורגם בשפת היעד הרצויה (אם המקור הוא באחת מרשימת השפות הנתמכות).

פיתוח ה-API ל-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:

 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 לפיתוח חזית

כשמפתחים אפליקציה באמצעות Springboo, אחת הדרכים הנפוצות לפיתוח קצה קדמי היא להשתמש בכוח של Thymeleaf. Thymeleaf הוא מנוע תבניות Java בצד השרת שמאפשר לשלב תוכן דינמי בדפי HTML, בצורה חלקה. Thymeleaf מספקת חוויית פיתוח חלקה בכך שהיא מאפשרת ליצור תבניות HTML עם ביטויים מוטמעים בצד השרת. אפשר להשתמש בביטויים האלה כדי לעבד באופן דינמי נתונים מהקצה העורפי של Spring Boot, וכך להציג בקלות את התוצאות של ניתוח התמונות שבוצעו על ידי שירות Vision API.

כדי להתחיל, צריך לוודא שיש לכם את יחסי התלות הנדרשים ל-Thymeleaf בפרויקט Spring Boot. אפשר לכלול בקובץ pom.xml את התלות של Thymeleaf Starter:

<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 ולצפות בתוצאות בזמן אמת. משתמשים ביכולות של Thymeleaf לפיתוח חזיתי כדי ליהנות מכל היתרונות של אפליקציית Vision AI.

<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, פלטפורמת מחשוב ללא שרת (serverless) ב-Google Cloud. בשלב הזה נתמקד בפריסת אפליקציית Spring Boot בקונטיינרים באמצעות Cloud Run.

  1. אורזים את האפליקציה על ידי ביצוע השלבים הבאים מ-Cloud Shell(צריך לוודא שהטרמינל מופיע בתיקיית הבסיס של הפרויקט)

גרסה:

./mvnw package

לאחר השלמת ה-build, מריצים באופן מקומי כדי לבדוק:

./mvnw spring-boot:run
  1. יצירת קונטיינרים של אפליקציית אתחול האביב באמצעות Jib:

במקום ליצור Dockerfile באופן ידני ולבנות את קובץ האימג' בקונטיינר, אפשר להשתמש בכלי Jib כדי לפשט את תהליך יצירת הקונטיינר. Jib הוא פלאגין שמשתלב ישירות עם כלי ה-build שלכם (כמו Maven או Gradle) ומאפשר ליצור קובצי אימג' בקונטיינר שעברו אופטימיזציה בלי לכתוב Dockerfile. לפני שממשיכים, צריך להפעיל את Artifact Registry API (מומלץ להשתמש ב-Artifact Registry בלי רישום קונטיינרים). לאחר מכן מריצים את Jib כדי ליצור קובץ אימג' של Docker ולפרסם אותו ב-Registry:

$ ./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 עם אפשרויות הגדרה נוספות.

  1. פורסים את הקונטיינר (שנדחפנו ל-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 ומאתרים את שירות Cloud Run. לוחצים על 'יצירת שירות' ופועלים לפי ההוראות במסך. מציינים את תמונת הקונטיינר שהעברתם למרשם, קובעים את הגדרות הפריסה הרצויות (כמו הקצאת מעבד (CPU) והתאמה לעומס (autoscaling)) ובוחרים את האזור המתאים לפריסה. אתם יכולים להגדיר משתני סביבה ספציפיים לאפליקציה שלכם. המשתנים האלה יכולים לכלול פרטי כניסה לאימות (מפתחות API וכו'), מחרוזות חיבור למסד נתונים או כל הגדרה אחרת שנדרשת כדי שאפליקציית Vision AI תפעל בצורה תקינה. אחרי שהפריסה תושלם, אמורה להיות לכם נקודת קצה לאפליקציה.

משחק באמצעות אפליקציית Vision AI

אפשר להשתמש בכתובת ה-URL של התמונה שלמטה כדי לקרוא ולתרגם את האפליקציה: https://storage.googleapis.com/img_public_test/tamilwriting1.jfif

654c1b0de0db482.gif

6. הסרת המשאבים

כדי להימנע מצבירת חיובים בחשבון Google Cloud על המשאבים שבהם השתמשתם בפוסט הזה:

  1. במסוף Google Cloud, נכנסים לדף Manage resources
  2. ברשימת הפרויקטים, בוחרים את הפרויקט שרוצים למחוק ולוחצים על Delete (מחיקה).
  3. כדי למחוק את הפרויקט, כותבים את מזהה הפרויקט בתיבת הדו-שיח ולוחצים על Shut down

7. מזל טוב

מעולה! יצרתם בהצלחה אפליקציה Vision AI (בינה מלאכותית) באמצעות Springboo ו-Java. בעזרת היכולות של Vision AI, האפליקציה יכולה עכשיו לבצע ניתוח תמונות מתוחכם, כולל הוספת תוויות, זיהוי פנים ועוד. השילוב של Springboot מספק בסיס חזק לבניית אפליקציות Google Cloud Native עם יכולת התאמה ואמינות. ממשיכים לבחון את היכולות המתקדמות של Vision AI, Cloud Run, Cloud Translation ועוד, כדי לשפר את האפליקציה בעזרת תכונות ופונקציות נוספות. למידע נוסף, תוכלו לעיין במסמכים Vision API, Cloud Translation ו-GCP Spring. כדאי לנסות את אותו הניסוי עם האפשרות Spring Native (מודעות מותאמות באביב)! הצצה מוקדמת לעולם של ה-AI הגנרטיבי? תוכלו לקרוא איך ה-API הזה מוצג ב-Model Garden.