1. Introduzione
Nell'era attuale delle applicazioni basate sui dati, sfruttare servizi avanzati di machine learning e intelligenza artificiale come la computer vision è diventato sempre più importante. Uno di questi servizi è l'API Vision, che offre potenti funzionalità di analisi delle immagini. In questo codelab imparerai a creare un'applicazione Computer Vision utilizzando Spring Boot e Java, in modo da sfruttare il potenziale del riconoscimento e dell'analisi delle immagini nei tuoi progetti. L'interfaccia utente dell'applicazione accetterà come input URL pubblici di immagini contenenti testo scritto o stampato, estrarrà il testo, rileverà la lingua e, se è una delle lingue supportate, genererà la traduzione in inglese del testo.
Cosa creerai
Creerai un
- Un'applicazione Java Spring Boot per utilizzare l'API Vision e l'API Google Cloud Translation
- Eseguito il deployment su Cloud Run
2. Requisiti
Di seguito sono riportati i prerequisiti:
Creazione di un progetto
- Un account Google Cloud con un progetto creato e la fatturazione abilitata.
- API Vision, Translation, Cloud Run e Artifact Registry abilitate
- Cloud Shell attivato
- API Cloud Storage abilitata con un bucket creato e immagini con testo o scrittura a mano nelle lingue locali supportate caricate (oppure puoi utilizzare i link alle immagini di esempio forniti in questo blog)
Consulta la documentazione per i passaggi su come attivare le API Google Cloud.
Attiva Cloud Shell
- Utilizzerai Cloud Shell, un ambiente a riga di comando in esecuzione in Google Cloud precaricato con bq:
Nella console Cloud, fai clic su Attiva Cloud Shell nell'angolo in alto a destra.
- Una volta eseguita la connessione a Cloud Shell, dovresti vedere che il tuo account è già autenticato e il progetto è già impostato sul tuo ID progetto. Esegui questo comando in Cloud Shell per verificare che l'account sia autenticato:
gcloud auth list
- Esegui questo comando in Cloud Shell per verificare che il comando gcloud conosca il tuo progetto
gcloud config list project
- Se il progetto non è impostato, utilizza il seguente comando per impostarlo:
gcloud config set project <PROJECT_ID>
Consulta la documentazione per i comandi e l'utilizzo di gcloud.
3. Bootstrapping di un progetto Spring Boot
Per iniziare, crea un nuovo progetto Spring Boot utilizzando il tuo IDE preferito o Spring Initializr. Includi le dipendenze necessarie, come Spring Web, Spring Cloud GCP e Vision AI, nella configurazione del progetto. In alternativa, puoi utilizzare Spring Initializr da Cloud Shell seguendo i passaggi riportati di seguito per eseguire facilmente il bootstrap dell'applicazione Spring Boot.
Esegui questo comando per creare il progetto 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 è il nome del progetto, modificalo in base alle tue esigenze.
bootVersion è la versione di Spring Boot. Assicurati di aggiornarla se necessario al momento dell'implementazione.
type è la versione del tipo di strumento di compilazione del progetto. Puoi modificarla in gradle, se preferisci.
In "spring-vision" viene creata una struttura di progetto come di seguito:
pom.xml contiene tutte le dipendenze del progetto (le dipendenze che hai configurato utilizzando questo comando sono già state aggiunte al file pom.xml).
src/main/java/com/example/demo contiene i file .java delle classi sorgente.
Le risorse contengono le immagini, i file XML e di testo e i contenuti statici utilizzati dal progetto e gestiti in modo indipendente.
application.properties ti consente di gestire le funzionalità di amministrazione per definire le proprietà specifiche del profilo dell'applicazione.
4. Configurazione dell'API Vision
Una volta attivata l'API Vision, puoi configurare le credenziali dell'API nella tua applicazione. Se vuoi, puoi utilizzare le credenziali predefinite dell'applicazione per configurare l'autenticazione. In questa implementazione demo, tuttavia, non ho implementato l'utilizzo delle credenziali.
Implementazione dei servizi di visione e traduzione
Crea una classe di servizio che interagisca con l'API Vision. Inserisci le dipendenze necessarie e utilizza il client API Vision per inviare richieste di analisi delle immagini. Puoi implementare metodi per eseguire attività come l'etichettatura di immagini, il rilevamento e il riconoscimento di volti e altro ancora, in base ai requisiti della tua applicazione. In questa demo, utilizzeremo metodi di estrazione e traduzione della scrittura a mano.
Per questo, assicurati di includere le seguenti dipendenze in 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>
Clona / sostituisci i seguenti file dal repository e aggiungili alle rispettive cartelle / percorsi nella struttura del progetto:
- 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)
- result.html (/src/main/resources/templates)
- pom.xml
Il metodo extractTextFromImage nel servizio org.springframework.cloud.gcp.vision.CloudVisionTemplate consente di estrarre il testo dall'input dell'immagine. Il metodo getTranslatedText del servizio com.google.cloud.translate.v3 consente di passare il testo estratto dall'immagine e ottenere il testo tradotto nella lingua di destinazione desiderata come risposta (se l'origine è in una delle lingue supportate).
Creazione dell'API REST
Progetta e implementa gli endpoint REST che esporranno le funzionalità dell'API Vision. Crea controller che gestiscono le richieste in entrata e utilizzano il servizio API Vision per elaborare le immagini e restituire i risultati dell'analisi. In questa demo, la nostra classe VisionController implementa l'endpoint, gestisce la richiesta in entrata, richiama i servizi API Vision e Cloud Translation e restituisce il risultato al livello di visualizzazione. L'implementazione del metodo GET per l'endpoint REST è la seguente:
@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;
}
La classe TranslateText nell'implementazione precedente ha il metodo che richiama il servizio 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);
}
Con la classe VisionController, abbiamo implementato il metodo GET per REST.
Integrazione di Thymeleaf per lo sviluppo del frontend
Quando crei un'applicazione con Spring Boot, una scelta popolare per lo sviluppo del frontend è sfruttare la potenza di Thymeleaf. Thymeleaf è un motore di modelli Java lato server che consente di integrare facilmente contenuti dinamici nelle pagine HTML. Thymeleaf offre un'esperienza di sviluppo fluida consentendoti di creare modelli HTML con espressioni lato server incorporate. Queste espressioni possono essere utilizzate per eseguire il rendering dinamico dei dati dal backend Spring Boot, semplificando la visualizzazione dei risultati dell'analisi delle immagini eseguita dal servizio Vision API.
Per iniziare, assicurati di avere le dipendenze necessarie per Thymeleaf nel tuo progetto Spring Boot. Puoi includere la dipendenza Thymeleaf Starter in pom.xml:
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>
Nel metodo del controller, recupera il risultato dell'analisi dal servizio API Vision e aggiungilo al modello. Il modello rappresenta i dati che verranno utilizzati da Thymeleaf per il rendering del modello HTML. Una volta compilato il modello, restituisci il nome del modello Thymeleaf che vuoi eseguire il rendering. Thymeleaf si occuperà di elaborare il modello, sostituendo le espressioni lato server con i dati effettivi e generando l'HTML finale che verrà inviato al browser del client.
Nel caso del metodo extractText in VisionController, abbiamo restituito il risultato come String e non l'abbiamo aggiunto al modello. Tuttavia, abbiamo richiamato il metodo GET extractText sul index.html all'invio della pagina. Con Thymeleaf, puoi creare un'esperienza utente fluida, in cui gli utenti possono caricare immagini, attivare analisi dell'API Vision e visualizzare i risultati in tempo reale. Sfrutta tutto il potenziale della tua applicazione Vision AI sfruttando la potenza di Thymeleaf per lo sviluppo del frontend.
<form action="/extractText">
Web URL of image to analyze:
<input type="text"
name="imageUrl"
value=""
<input type="submit" value="Read and Translate" />
</form>
5. Deployment dell'app di computer vision su Cloud Run
Scrivi test delle unità per le classi di servizio e controller per garantire il corretto funzionamento nella cartella /src/test/java/com/example. Una volta che hai verificato la sua stabilità, pacchettizzalo in un artefatto di cui è possibile eseguire il deployment, ad esempio un file JAR, ed esegui il deployment in Cloud Run, una piattaforma di calcolo serverless su Google Cloud. In questo passaggio, ci concentreremo sul deployment dell'applicazione Spring Boot containerizzata utilizzando Cloud Run.
- Pacchettizza l'applicazione eseguendo i seguenti passaggi da Cloud Shell(assicurati che il terminale richieda la cartella principale del progetto)
Build:
./mvnw package
Una volta completata la build, esegui localmente il test:
./mvnw spring-boot:run
- Containerizza la tua applicazione Spring Boot con Jib:
Anziché creare manualmente un Dockerfile e creare l'immagine container, puoi utilizzare l'utilità Jib per semplificare il processo di containerizzazione. Jib è un plug-in che si integra direttamente con lo strumento di compilazione (ad esempio Maven o Gradle) e ti consente di creare immagini container ottimizzate senza scrivere un Dockerfile. Prima di procedere, devi abilitare l'API Artifact Registry (l'utilizzo di Artifact Registry è consigliato rispetto a Container Registry). Poi esegui Jib per creare un'immagine Docker e pubblicarla nel registro:
$ ./mvnw com.google.cloud.tools:jib-maven-plugin:3.1.1:build -Dimage=gcr.io/$GOOGLE_CLOUD_PROJECT/vision-jib
Nota: in questo esperimento non abbiamo configurato il plug-in Jib Maven in pom.xml, ma per un utilizzo avanzato è possibile aggiungerlo in pom.xml con altre opzioni di configurazione
- Esegui il deployment del container (di cui abbiamo eseguito il push in Artifact Registry nel passaggio precedente) in Cloud Run. Anche questo è un passaggio che richiede un solo comando:
gcloud run deploy vision-app --image gcr.io/$GOOGLE_CLOUD_PROJECT/vision-jib --platform managed --region us-central1 --allow-unauthenticated --update-env-vars
In alternativa, puoi farlo anche dall'interfaccia utente. Vai alla console Google Cloud e individua il servizio Cloud Run. Fai clic su "Crea servizio" e segui le istruzioni sullo schermo. Specifica l'immagine container che hai eseguito il push in precedenza nel registro, configura le impostazioni di deployment desiderate (come l'allocazione della CPU e la scalabilità automatica) e scegli la regione appropriata per il deployment. Puoi impostare variabili di ambiente specifiche per la tua applicazione. Queste variabili possono includere credenziali di autenticazione (chiavi API e così via), stringhe di connessione al database o qualsiasi altra configurazione necessaria per il corretto funzionamento dell'applicazione Vision AI. Al termine del deployment, dovresti ricevere un endpoint per la tua applicazione.
Giocare con l'app Vision AI
A scopo dimostrativo, puoi utilizzare l'URL dell'immagine riportato di seguito per consentire alla tua app di leggerlo e tradurlo: https://storage.googleapis.com/img_public_test/tamilwriting1.jfif
6. Esegui la pulizia
Per evitare che al tuo account Google Cloud vengano addebitati costi relativi alle risorse utilizzate in questo post, segui questi passaggi:
- Nella console Google Cloud, vai alla pagina Gestisci risorse.
- Nell'elenco dei progetti, seleziona il progetto che vuoi eliminare, quindi fai clic su Elimina.
- Nella finestra di dialogo, digita l'ID progetto, quindi fai clic su Chiudi per eliminare il progetto.
7. Complimenti
Complimenti! Hai creato correttamente un'applicazione Vision AI utilizzando Spring Boot e Java. Grazie alla potenza di Vision AI, la tua applicazione ora può eseguire analisi sofisticate delle immagini, tra cui etichettatura, rilevamento del volto e altro ancora. L'integrazione di Spring Boot fornisce una base solida per la creazione di applicazioni Google Cloud native scalabili e robuste. Continua a esplorare le vaste funzionalità di Vision AI, Cloud Run, Cloud Translation e altro ancora per migliorare la tua applicazione con funzionalità aggiuntive. Per saperne di più, consulta la documentazione relativa all'API Vision, a Cloud Translation e a GCP Spring. Prova lo stesso esperimento con l'opzione Spring Native. Inoltre, per dare un'occhiata al mondo dell'AI generativa, scopri come viene visualizzata questa API in Model Garden.