1. परिचय
इस कोडलैब में, Java, Spring Boot, Cloud Spanner डेटाबेस, और Vertex AI Imagen API का इस्तेमाल करके, एआई की मदद से पोज़ जनरेट करने वाला ऐप्लिकेशन बनाएं. उपयोगकर्ता एक प्रॉम्प्ट डालेगा और ऐप्लिकेशन उस प्रॉम्प्ट के आधार पर एक पोज़ जनरेट करेगा. हम Spanner डेटाबेस से मिले डेटा का भी इस्तेमाल करेंगे. यह डेटा, REST API के तौर पर उपलब्ध कराया जाता है. यह Google Cloud पर Spring Boot के साथ जनरेटिव एआई की क्षमताओं को दिखाने का मज़ेदार और शिक्षाप्रद तरीका है.
इस्तेमाल की गई सेवाओं की सूची यहां दी गई है:
- Cloud Spanner
- Vertex AI Imagen API
- Cloud Run
हाई लेवल फ़्लो डायग्राम

आपको क्या बनाना है
आपको
- सेवा के तौर पर Spanner डेटा के लिए, Java Spring Boot ऐप्लिकेशन
- इमेज जनरेट करने के लिए, Imagen का इस्तेमाल करने वाला Java Spring Boot ऐप्लिकेशन
- सवाल पूछने और जवाब पाने के लिए इंटरैक्टिव यूज़र इंटरफ़ेस
2. ज़रूरी शर्तें
शुरू करने से पहले
- Google Cloud Console में, प्रोजेक्ट चुनने वाले पेज पर जाकर, Google Cloud प्रोजेक्ट चुनें या बनाएं
- पक्का करें कि आपके Cloud प्रोजेक्ट के लिए बिलिंग चालू हो. किसी प्रोजेक्ट के लिए बिलिंग चालू है या नहीं, यह देखने का तरीका जानें
- पक्का करें कि सभी ज़रूरी एपीआई (Cloud Spanner API, Vertex AI API, Cloud Run API, Cloud Functions API) चालू हों
- आपको Cloud Shell का इस्तेमाल करना होगा. यह Google Cloud में चलने वाला कमांड-लाइन एनवायरमेंट है. इसमें bq पहले से लोड होता है. gcloud कमांड और उनके इस्तेमाल के बारे में जानने के लिए, दस्तावेज़ देखें
Cloud Console में, सबसे ऊपर दाएं कोने में मौजूद, Cloud Shell चालू करें पर क्लिक करें:

अगर आपका प्रोजेक्ट सेट नहीं है, तो इसे सेट करने के लिए इस निर्देश का इस्तेमाल करें:
gcloud config set project <YOUR_PROJECT_ID>
- शुरू करने के लिए, अपने ऐक्टिव Google Cloud प्रोजेक्ट के साथ Cloud Spanner पेज पर जाएं
3. Spanner की मदद से डेटा तैयार करना
ऐप्लिकेशन बनाने से पहले, Cloud Spanner इंस्टेंस, डेटाबेस, और टेबल बनाकर डेटाबेस सेटअप पूरा करें. Cloud Spanner की सुविधाओं, DDL, DML वगैरह के बारे में ज़्यादा जानने के लिए, इस ब्लॉग को पढ़ें. इस प्रोजेक्ट के लिए ज़रूरी डेटाबेस ऑब्जेक्ट बनाने के लिए, यहां दिया गया तरीका अपनाएं:
- उदाहरण बनाने के लिए, उदाहरणों वाले पेज पर मौजूद, उदाहरण बनाएं पर क्लिक करें.
- यहां दी गई इमेज में दिखाई गई जानकारी डालें और बनाएं पर क्लिक करें:

- डेटाबेस बनाने के बाद, इंस्टेंस के खास जानकारी वाले पेज पर जाकर, डेटाबेस बनाएं पर क्लिक करें
- डेटाबेस का नाम "first-spanner-db" के तौर पर दें. इसके बाद, DDL TEMPLATES सेक्शन में यह DDL डालें और SUBMIT पर क्लिक करें:
CREATE TABLE Yoga_Poses(
Pose_Id INT64 NOT NULL,
Name STRING(1024),
Breath STRING(1024),
Description STRING(1024)
) PRIMARY KEY(Pose_Id);
डेटाबेस और टेबल, आखिरी चरण के नतीजे के तौर पर बनाए जाने चाहिए. अब Yoga_Poses टेबल में कुछ लाइनें डालते हैं, ताकि हम अपना Spring Boot ऐप्लिकेशन बना सकें.
- बाईं ओर मौजूद डेटाबेस पैनल में, Spanner Studio पर क्लिक करें. इसके बाद, नीचे दी गई इमेज में दिखाए गए तरीके से, नया क्वेरी एडिटर टैब खोलें:

- INSERT क्वेरी को इस तरह चलाएं:
INSERT INTO Yoga_Poses(Pose_Id, Name, Breath, Description)
VALUES(1, 'STAND', 'INHALE AND EXHALE',
'STAND WITH YOUR FEET HIP WIDTH APART AND ARMS RESTING BY THE SIDES');
INSERT INTO Yoga_Poses(Pose_Id, Name, Breath, Description)
VALUES(2, 'PLANK', 'INHALE OR EXHALE',
'PLANT YOUR TOES AND PALMS ON THE MAT WITH BODY PARALLEL TO THE GROUND');
INSERT INTO Yoga_Poses(Pose_Id, Name, Breath, Description)
VALUES(3, 'SIT', 'INHALE AND EXHALE',
'SIT ON THE FLOOR LEGS CROSSED');
INSERT INTO Yoga_Poses(Pose_Id, Name, Breath, Description)
VALUES(4, 'BEND', 'EXHALE',
'FOLD FORWARD AS YOU STAND, HANDS REACHING TO THE FLOOR');
INSERT INTO Yoga_Poses(Pose_Id, Name, Breath, Description)
VALUES(5, 'PUSH UP', 'EXHALE',
'PLANK WITH ELBOWS ON MAT');
INSERT INTO Yoga_Poses(Pose_Id, Name, Breath, Description)
VALUES(6, 'SEATED FORWARD BEND', 'EXHALE',
'FOLD FORWARD AS YOU SIT, HANDS TRYING TO REACH THE FEET');
INSERT INTO Yoga_Poses(Pose_Id, Name, Breath, Description)
VALUES(7, 'LUNGE', 'EXHALE',
'ONE LEG TO THE FRONT 90 DEGREES TO THE FLOOR AND THE BACK LEG STRAIGHT');
INSERT INTO Yoga_Poses(Pose_Id, Name, Breath, Description)
VALUES(8, 'COURTESY LUNGE', 'INHALE',
'ONE LEG TO THE FRONT 90 DEGREES TO THE FLOOR AND THE BACK KNEE TOUCHING THE FLOOR');
INSERT INTO Yoga_Poses(Pose_Id, Name, Breath, Description)
VALUES(9, 'BANK BEND', 'INHALE',
'STAND WITH ARMS UP AND BODY BENT BACKWARDS, ARCHING YOUR SPINE, LOOKING AT THE SKY');
INSERT INTO Yoga_Poses(Pose_Id, Name, Breath, Description)
VALUES(10, 'BICEP ACTION', 'INHALE AND EXHALE',
'CURL, PRESS AND WORK YOUR BICEPS');
अब हमारे पास Spanner इंस्टेंस, डेटाबेस, टेबल, और डेटा तैयार है. इसका इस्तेमाल ऐप्लिकेशन में किया जा सकता है.
4. पोज़ डेटा के लिए, Spring Boot और Spanner की मदद से REST API बनाना
Spring Boot और Google Cloud Console के बारे में ज़्यादा जानने के लिए, यह ब्लॉग पढ़ें.
- Spring Boot ऐप्लिकेशन को बूटस्ट्रैप करना इस ऐप्लिकेशन को शुरू से बूटस्ट्रैप करने के लिए, इस ब्लॉग को पढ़ें. repo से क्लोन करने और कार्रवाई करने के लिए, अपने क्लाउड शेल टर्मिनल में यहां दिया गया निर्देश चलाएं:
git clone https://github.com/AbiramiSukumaran/spanner-springb
इससे आपकी Cloud Shell मशीन में spanner-springb प्रोजेक्ट बन जाना चाहिए. ऐप्लिकेशन के कॉम्पोनेंट को समझने के लिए, ब्लॉग पढ़ें.
- आइए, ऐप्लिकेशन बनाएं और उसे चलाएं. इसके लिए, क्लाउड शेल टर्मिनल में ये कमांड चलाएं:
cd spanner-springb
./mvnw package
./mvnw spring-boot:run
- ऐप्लिकेशन को Cloud Run में डिप्लॉय करें, ताकि यह पोज़ जनरेट करने वाले ऐप्लिकेशन के लिए उपलब्ध हो. इसके लिए, क्लाउड शेल टर्मिनल में यह कमांड चलाएं:
gcloud run deploy –source .
ज़रूरी पैरामीटर पास करें और पक्का करें कि आपका ऐप्लिकेशन डिप्लॉय किया गया हो. जनरेट किया गया सेवा यूआरएल, Spanner में बनाए गए डेटा को सूची में दिखा सके.
5. Spring Boot, Spanner, और Imagen की मदद से, पोज़ जनरेट करने वाला ऐप्लिकेशन बूटस्ट्रैप करना
इस समय, हमने फ़्लो डायग्राम का ऊपरी हिस्सा पूरा कर लिया है. इसका मतलब है कि हमने Spanner डेटा को सेवा (REST API) के तौर पर उपलब्ध करा दिया है. अब हम एक ऐसा क्लाइंट ऐप्लिकेशन बनाएंगे जो Spanner डेटा को चालू करता है. साथ ही, प्रॉम्प्ट के साथ IMAGEN API को कॉल करता है और Base64 एन्कोड की गई स्ट्रिंग को यूज़र इंटरफ़ेस पर इमेज के तौर पर दिखाता है.
- अब तक, आपको Spring Boot प्रोजेक्ट के स्ट्रक्चर और इसकी अहमियत के बारे में पता चल गया होगा. इसलिए, हम सीधे repo को अपनी Cloud Shell मशीन में क्लोन करने के लिए आगे बढ़ेंगे. इसके लिए, Cloud Shell टर्मिनल में नीचे दी गई कमांड चलाएं:
git clone https://github.com/AbiramiSukumaran/genai-posegen
इससे आपके Cloud Shell मशीन में प्रोजेक्ट genai-posegen बन जाना चाहिए. क्लोन किए गए प्रोजेक्ट का स्ट्रक्चर, Cloud Shell Editor में इस तरह दिखता है:

PromptController Java क्लास में, डेटाबेस सेवा को लागू करने, कारोबार के लॉजिक को लागू करने, और Imagen के जनरेटिव एआई एपीआई को लागू करने की सुविधा होती है. यह क्लास, Thymeleaf टेंप्लेट के साथ इंटरैक्ट करती है. ये टेंप्लेट, यूज़र इंटरफ़ेस में डेटा इंटिग्रेशन का ध्यान रखते हैं. इस क्लास में सेवा देने के तीन तरीके हैं — 1) प्रॉम्प्ट इनपुट पाने के लिए 2) अनुरोध को प्रोसेस करने और Imagen API को शुरू करने के लिए 3) Imagen के जवाब को प्रोसेस करने के लिए.
Prompt और Yoga, POJO क्लास हैं. इनमें फ़ील्ड, गेटर, और सेटर होते हैं. इनका इस्तेमाल, Imagen API और Spanner डेटा सर्वर API के साथ इंटरफ़ेस करने के लिए किया जाता है.
टेम्प्लेट फ़ोल्डर में मौजूद index और getImage एचटीएमएल फ़ाइलों में, यूज़र इंटरफ़ेस के लिए टेम्प्लेट होते हैं. साथ ही, इनमें संबंधित फ़ोल्डर में JS और css स्क्रिप्ट की डिपेंडेंसी होती हैं.
Vertex AI Imagen API इंटिग्रेशन इमेज जनरेट करने के लिए, हम Vertex AI के Imagen API का इस्तेमाल इस फ़ॉर्मैट में कर रहे हैं:
https://<<region>>- aiplatform.googleapis.com/v1/projects/<<your-project-id>>/locations/<<region>>/publishers/google/models/imagegeneration:predict
Imagen की सुविधाओं के बारे में ज़्यादा जानने के लिए, यहां जाएं. यह Base64 कोड में बदले गए स्ट्रिंग फ़ॉर्मैट में जवाब देता है. इसे इमेज में बदलने के लिए, हमने getImage.js फ़ाइल में इमेज ऑब्जेक्ट पर javascript setattribute मेथड का इस्तेमाल किया है. इसे getImage.HTML फ़ाइल में इस तरह दिखाया गया है:
poseImage.setAttribute('src', "data:image/jpg;base64," + baseStr64);
अनुमति Imagen API को ऐक्सेस करने के लिए, आपको बेयरर टोकन की पुष्टि करने की सुविधा चालू करनी होगी. इस उदाहरण में, मैंने ऐप्लिकेशन के डिफ़ॉल्ट क्रेडेंशियल के लिए JSON फ़ाइल का इस्तेमाल किया है. इसे लागू करने के लिए, क्लाउड शेल टर्मिनल में यह कमांड चलाएं. इसके बाद, टर्मिनल में दिए गए निर्देशों का पालन करें:
gcloud auth application-default login
अपने खाते से पुष्टि करने के लिए, "Y" डालें. पॉप-अप में दिखने वाले ऑथराइज़ेशन कोड को कॉपी करें और ऐक्सेस करने की अनुमति दें. ऐसा करने के तुरंत बाद, आपको ऐप्लिकेशन के डिफ़ॉल्ट क्रेडेंशियल मिल जाएंगे. ये क्रेडेंशियल, JSON फ़ाइल में सेव होते हैं. यह फ़ाइल, इस तरह की किसी जगह पर सेव होती है: /tmp/tmp.Fh0Gf4yF0V/application_default_credentials.json.
फ़ाइल डाउनलोड करें या cat कमांड (cat /tmp/tmp.Fh0Gf4yF0V/application_default_credentials.json) चलाकर, JSON फ़ाइल के कॉन्टेंट को कॉपी करें. इसके बाद, इसे PromptController.java क्लास के callImagen() तरीके में ऐप्लिकेशन में इस्तेमाल करें. पुष्टि करने के बारे में ज़्यादा जानने के लिए, यहां जाएं.
यूज़र इंटरफ़ेस हमने टेंप्लेट इंजन के तौर पर Thymeleaf का इस्तेमाल किया है. इससे फ़्रंट एंड टेंप्लेट फ़ाइलों में डेटा को पार्स और रेंडर किया जा सकता है. साथ ही, यूज़र इंटरफ़ेस में बेहतर डिज़ाइन जोड़ा जा सकता है. यह एचटीएमएल की तरह ही होता है, लेकिन रेंडर किए गए डेटा के साथ काम करने के लिए ज़्यादा एट्रिब्यूट इस्तेमाल करता है. index.html में लैंडिंग पेज के डिज़ाइन कॉम्पोनेंट होते हैं. इससे उपयोगकर्ता को विषय चुनने और अपनी पसंद के मुताबिक इमेज जनरेट करने के लिए, प्रॉम्प्ट जोड़ने की सुविधा मिलती है.
6. बनाना और डिप्लॉय करना
अब आपने कोड को क्लोन कर लिया है. साथ ही, अपने प्रोजेक्ट, क्षेत्र, और पुष्टि करने के क्रेडेंशियल के हिसाब से प्लेसहोल्डर की वैल्यू बदल दी हैं. अब ऐप्लिकेशन बनाने और उसे डिप्लॉय करने के लिए आगे बढ़ते हैं. क्लाउड शेल टर्मिनल में प्रोजेक्ट फ़ोल्डर पर जाएं. इसके लिए, इस कमांड का इस्तेमाल करें. इसके बाद, क्लाउड शेल मशीन में स्थानीय तौर पर टेस्ट करने के लिए, एक-एक करके इन तीन कमांड का इस्तेमाल करके ऐप्लिकेशन बनाएं और डिप्लॉय करें:
cd genai-posegen
./mvnw package
./mvnw spring-boot:run
ऐप्लिकेशन को Cloud Run में डिप्लॉय करें, ताकि यह क्लाउड पर उपलब्ध हो. इसके लिए, प्रोजेक्ट फ़ोल्डर में मौजूद क्लाउड शेल टर्मिनल में यह कमांड चलाएं:
gcloud run deploy –source .
ज़रूरी पैरामीटर पास करें और पक्का करें कि आपका ऐप्लिकेशन डिप्लॉय किया गया हो.
7. डेमो
ऐप्लिकेशन डिप्लॉय होने के बाद, आपको टर्मिनल में सेवा का यूआरएल दिखेगा. लिंक पर क्लिक करें और देखें कि पोज़ की इमेज जनरेट करने वाला आपका ऐप्लिकेशन, Google Cloud पर सर्वरलेस तरीके से चल रहा है!

8. व्यवस्थित करें
इस पोस्ट में इस्तेमाल की गई संसाधनों के लिए, अपने Google Cloud खाते से शुल्क न लिए जाने के लिए, यह तरीका अपनाएं:
- Google Cloud Console में, संसाधन मैनेज करें पेज पर जाएं
- प्रोजेक्ट की सूची में, वह प्रोजेक्ट चुनें जिसे आपको मिटाना है. इसके बाद, मिटाएं पर क्लिक करें
- डायलॉग बॉक्स में, प्रोजेक्ट आईडी डालें. इसके बाद, प्रोजेक्ट मिटाने के लिए बंद करें पर क्लिक करें
- अगर आपको प्रोजेक्ट नहीं मिटाना है, तो Spanner इंस्टेंस मिटाएं. इसके लिए, उस इंस्टेंस पर जाएं जिसे आपने इस प्रोजेक्ट के लिए अभी बनाया है. इसके बाद, इंस्टेंस की खास जानकारी वाले पेज के सबसे ऊपर दाएं कोने में मौजूद, इंस्टेंस मिटाएं बटन पर क्लिक करें
- Cloud Run सेवाओं वाले पेज पर जाकर, इस प्रोजेक्ट में बनाई गई सेवाओं को चुना जा सकता है. इसके बाद, सेवाओं को मिटाने के लिए, 'मिटाएं' बटन पर क्लिक करें.
9. बधाई हो
इस ब्लॉग में, हमने Cloud Spanner में डेटा को सेव और मैनेज करने वाले फ़ुल स्टैक Spring Boot ऐप्लिकेशन को Cloud Run में डिप्लॉय किए गए इंटरैक्टिव क्लाइंट ऐप्लिकेशन में Google Cloud Vertex AI के Imagen API का इस्तेमाल करके पोज़ जनरेट करने के लिए तैयार किया. इस ब्लॉग के आर्किटेक्चर डायग्राम सेक्शन में, आपको Cloud Functions (Java) कॉम्पोनेंट दिखता है. हालांकि, हमने इसका इस्तेमाल नहीं किया है. ऐसा क्यों है? अगर आपको योगदान देना है, तो आपके पास यह मौका है. getimage.html फ़ाइल में मौजूद दो तरीकों को लागू करने के लिए, दो Java Cloud फ़ंक्शन लागू किए जा सकते हैं: पोज़ को डेटाबेस में सेव करना और इमेज अपलोड करना. मॉडल के बारे में ज़्यादा जानने के लिए, Vertex AI पर Imagen से जुड़ा दस्तावेज़ देखें.