1. Introduction
À l'heure actuelle, où les applications basées sur les données sont omniprésentes, il est devenu de plus en plus important d'exploiter des services avancés de machine learning et d'intelligence artificielle tels que la vision par ordinateur. L'API Vision, qui offre de puissantes fonctionnalités d'analyse d'images, en est un exemple. Dans cet atelier de programmation, vous apprendrez à créer une application de vision par ordinateur à l'aide de Spring Boot et de Java. Vous pourrez ainsi exploiter le potentiel de la reconnaissance et de l'analyse d'images dans vos projets. L'interface utilisateur de l'application accepte en entrée les URL publiques d'images contenant du texte écrit ou imprimé, extrait le texte, détecte la langue et, si elle fait partie des langues acceptées, génère la traduction anglaise de ce texte.
Ce que vous allez faire
Vous allez créer un
- Application Java Spring Boot pour utiliser l'API Vision et l'API Google Cloud Translation
- Déployé sur Cloud Run
2. Conditions requises
Voici les conditions préalables :
Créer un projet
- Un compte Google Cloud avec un projet créé et la facturation activée
- Les API Vision, Translation, Cloud Run et Artifact Registry sont activées
- Cloud Shell activé
- API Cloud Storage activée avec un bucket créé et des images contenant du texte ou de l'écriture manuscrite dans les langues locales acceptées importées (vous pouvez également utiliser les liens vers des exemples d'images fournis dans ce blog)
Consultez la documentation pour savoir comment activer les API Google Cloud.
Activer Cloud Shell
- Vous allez utiliser Cloud Shell, un environnement de ligne de commande exécuté dans Google Cloud et fourni avec bq :
Dans la console Cloud, cliquez sur "Activer Cloud Shell" en haut à droite.
- Une fois connecté à Cloud Shell, vous êtes en principe authentifié, et le projet est déjà défini avec votre ID de projet. Exécutez la commande suivante dans Cloud Shell pour vérifier que vous êtes authentifié :
gcloud auth list
- Exécutez la commande suivante dans Cloud Shell pour vérifier que la commande gcloud reconnaît votre projet
gcloud config list project
- Si votre projet n'est pas défini, utilisez la commande suivante pour le définir :
gcloud config set project <PROJECT_ID>
Consultez la documentation pour connaître les commandes gcloud ainsi que leur utilisation.
3. Amorcer un projet Spring Boot
Pour commencer, créez un projet Spring Boot à l'aide de l'IDE de votre choix ou de Spring Initializr. Incluez les dépendances nécessaires, telles que Spring Web, Spring Cloud GCP et Vision AI, dans la configuration de votre projet. Vous pouvez également utiliser Spring Initializr depuis Cloud Shell en suivant les étapes ci-dessous pour amorcer facilement votre application Spring Boot.
Exécutez la commande suivante pour créer votre projet 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 est le nom de votre projet. Modifiez-le selon vos besoins.
bootVersion correspond à la version de Spring Boot. Assurez-vous de la mettre à jour si nécessaire au moment de l'implémentation.
type correspond à la version du type d'outil de compilation du projet. Vous pouvez la remplacer par Gradle si vous le souhaitez.
Une structure de projet est créée sous "spring-vision", comme suit :
pom.xml contient toutes les dépendances du projet (les dépendances que vous avez configurées à l'aide de cette commande sont déjà ajoutées à votre fichier pom.xml).
src/main/java/com/example/demo contient les fichiers .java des classes sources.
Les ressources contiennent les images, les fichiers XML et texte, ainsi que le contenu statique utilisé par le projet et géré de manière indépendante.
application.properties vous permet de conserver les fonctionnalités d'administration pour définir les propriétés spécifiques au profil de l'application.
4. Configurer l'API Vision
Une fois l'API Vision activée, vous pouvez configurer les identifiants de l'API dans votre application. Vous pouvez également utiliser les identifiants par défaut de l'application pour configurer l'authentification. Toutefois, dans cette implémentation de démonstration, je n'ai pas implémenté l'utilisation d'identifiants.
Implémenter les services de vision et de traduction
Créez une classe de service qui interagit avec l'API Vision. Injectez les dépendances nécessaires et utilisez le client de l'API Vision pour envoyer des requêtes d'analyse d'images. Vous pouvez implémenter des méthodes pour effectuer des tâches telles que l'étiquetage d'images, la détection et la reconnaissance de visages, et plus encore, en fonction des exigences de votre application. Dans cette démonstration, nous allons utiliser des méthodes d'extraction et de traduction de l'écriture manuscrite.
Pour ce faire, assurez-vous d'inclure les dépendances suivantes dans 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>
Clonez / Remplacez les fichiers suivants du dépôt et ajoutez-les aux dossiers / chemins respectifs dans la structure du projet :
- 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
La méthode extractTextFromImage du service org.springframework.cloud.gcp.vision.CloudVisionTemplate vous permet d'extraire du texte à partir de votre entrée d'image. La méthode getTranslatedText du service com.google.cloud.translate.v3 vous permet de transmettre le texte extrait de votre image et d'obtenir le texte traduit dans la langue cible souhaitée en réponse (si la langue source figure dans la liste des langues acceptées).
Créer l'API REST
Concevez et implémentez les points de terminaison REST qui exposeront les fonctionnalités de l'API Vision. Créez des contrôleurs qui gèrent les requêtes entrantes et utilisent le service de l'API Vision pour traiter les images et renvoyer les résultats de l'analyse. Dans cette démo, notre classe VisionController implémente le point de terminaison, gère la requête entrante, appelle les services de l'API Vision et de Cloud Translation, et renvoie le résultat à la couche Vue. L'implémentation de la méthode GET pour le point de terminaison REST est la suivante :
@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 dans l'implémentation ci-dessus comporte la méthode qui appelle le service 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);
}
Avec la classe VisionController, la méthode GET pour le REST est implémentée.
Intégrer Thymeleaf pour le développement du frontend
Lorsque vous créez une application avec Spring Boot, l'un des choix les plus populaires pour le développement du frontend consiste à exploiter la puissance de Thymeleaf. Thymeleaf est un moteur de création de modèles Java côté serveur qui vous permet d'intégrer facilement du contenu dynamique à vos pages HTML. Thymeleaf offre une expérience de développement fluide en vous permettant de créer des modèles HTML avec des expressions côté serveur intégrées. Ces expressions peuvent être utilisées pour afficher dynamiquement les données de votre backend Spring Boot, ce qui facilite l'affichage des résultats de l'analyse d'images effectuée par le service Vision API.
Pour commencer, assurez-vous d'avoir les dépendances nécessaires pour Thymeleaf dans votre projet Spring Boot. Vous pouvez inclure la dépendance Thymeleaf Starter dans votre fichier pom.xml :
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>
Dans la méthode de votre contrôleur, récupérez le résultat de l'analyse du service de l'API Vision et ajoutez-le au modèle. Le modèle représente les données qui seront utilisées par Thymeleaf pour afficher le modèle HTML. Une fois le modèle rempli, renvoyez le nom du modèle Thymeleaf que vous souhaitez afficher. Thymeleaf se chargera de traiter le modèle, de remplacer les expressions côté serveur par les données réelles et de générer le code HTML final qui sera envoyé au navigateur du client.
Dans le cas de la méthode extractText dans VisionController, nous avons renvoyé le résultat en tant que String à et non ajouté au modèle. Cependant, nous avons appelé la méthode GET extractText sur le index.html lors de l'envoi de la page. Avec Thymeleaf, vous pouvez créer une expérience utilisateur fluide, où les utilisateurs peuvent importer des images, déclencher des analyses de l'API Vision et afficher les résultats en temps réel. Exploitez tout le potentiel de votre application Vision AI en tirant parti de la puissance de Thymeleaf pour le développement du 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. Déployer votre application de vision par ordinateur sur Cloud Run
Écrivez des tests unitaires pour vos classes de service et de contrôleur afin de garantir un bon fonctionnement dans le dossier /src/test/java/com/example. Une fois que vous êtes sûr de sa stabilité, empaquetez-le dans un artefact déployable, tel qu'un fichier JAR, et déployez-le sur Cloud Run, une plate-forme de calcul sans serveur sur Google Cloud. Dans cette étape, nous allons nous concentrer sur le déploiement de votre application Spring Boot conteneurisée à l'aide de Cloud Run.
- Empaquetez votre application en exécutant les étapes suivantes depuis Cloud Shell(assurez-vous que le terminal vous invite à saisir une commande dans le dossier racine du projet).
Build :
./mvnw package
Une fois la compilation réussie, exécutez-la en local pour la tester :
./mvnw spring-boot:run
- Conteneurisez votre application Spring Boot avec Jib :
Au lieu de créer manuellement un Dockerfile et de créer l'image de conteneur, vous pouvez utiliser l'utilitaire Jib pour simplifier le processus de conteneurisation. Jib est un plug-in qui s'intègre directement à votre outil de compilation (tel que Maven ou Gradle) et vous permet de créer des images de conteneurs optimisées sans écrire de Dockerfile. Avant de continuer, vous devez activer l'API Artifact Registry (nous vous recommandons d'utiliser Artifact Registry plutôt que Container Registry). Exécutez ensuite Jib pour créer une image Docker et la publier dans le registre :
$ ./mvnw com.google.cloud.tools:jib-maven-plugin:3.1.1:build -Dimage=gcr.io/$GOOGLE_CLOUD_PROJECT/vision-jib
Remarque : Dans cet atelier, nous n'avons pas configuré le plug-in Jib Maven dans pom.xml, mais pour une utilisation avancée, il est possible de l'ajouter dans pom.xml avec d'autres options de configuration.
- Déployez le conteneur (que vous avez transféré vers Artifact Registry à l'étape précédente) sur Cloud Run. Il s'agit à nouveau d'une étape à une seule commande :
gcloud run deploy vision-app --image gcr.io/$GOOGLE_CLOUD_PROJECT/vision-jib --platform managed --region us-central1 --allow-unauthenticated --update-env-vars
Vous pouvez également le faire depuis l'interface utilisateur. Accédez à la console Google Cloud et recherchez le service Cloud Run. Cliquez sur "Créer un service" et suivez les instructions à l'écran. Spécifiez l'image de conteneur que vous avez précédemment envoyée au registre, configurez les paramètres de déploiement souhaités (tels que l'allocation de processeur et l'autoscaling), puis choisissez la région de déploiement appropriée. Vous pouvez définir des variables d'environnement spécifiques à votre application. Ces variables peuvent inclure des identifiants d'authentification (clés API, etc.), des chaînes de connexion à la base de données ou toute autre configuration nécessaire au bon fonctionnement de votre application Vision AI. Une fois le déploiement terminé, vous devriez obtenir un point de terminaison pour votre application.
Jouer avec votre application Vision AI
À des fins de démonstration, vous pouvez utiliser l'URL de l'image ci-dessous pour que votre application la lise et la traduise : https://storage.googleapis.com/img_public_test/tamilwriting1.jfif.
6. Effectuer un nettoyage
Pour éviter que les ressources utilisées dans cet article soient facturées sur votre compte Google Cloud, procédez comme suit :
- Dans la console Google Cloud, accédez à la page "Gérer les ressources".
- Dans la liste des projets, sélectionnez le projet que vous souhaitez supprimer, puis cliquez sur "Supprimer".
- Dans la boîte de dialogue, saisissez l'ID du projet, puis cliquez sur "Arrêter" pour supprimer le projet.
7. Félicitations
Félicitations ! Vous avez créé une application Vision AI à l'aide de Spring Boot et de Java. Grâce à la puissance de Vision AI, votre application peut désormais effectuer des analyses d'images sophistiquées, y compris l'étiquetage, la détection de visages et plus encore. L'intégration de Spring Boot fournit une base solide pour créer des applications Google Cloud Native évolutives et robustes. Continuez à explorer les nombreuses fonctionnalités de Vision AI, Cloud Run, Cloud Translation et plus encore pour améliorer votre application avec des fonctionnalités supplémentaires. Pour en savoir plus, consultez la documentation sur l'API Vision, Cloud Translation et GCP Spring. Essayez la même expérience avec l'option Spring Native. Pour avoir un aperçu du monde de l'IA générative, découvrez comment cette API s'affiche dans Model Garden.