Google Chat ऐप्लिकेशन में एआई के बुनियादी कॉन्सेप्ट इंटिग्रेट करना

1. अनचाहे डेटा को फ़िल्टर करने से पहले ज़रूरी जानकारी

एआई की सुविधा वाले Google Chat ऐप्लिकेशन कौनसे हैं?

एआई की सुविधा वाले Google Chat ऐप्लिकेशन, ये काम करते हैं:

  • अपनी सेवाओं और संसाधनों को Google Chat में जोड़ें. इससे उपयोगकर्ता, बातचीत छोड़े बिना जानकारी पा सकते हैं और कार्रवाई कर सकते हैं.
  • जनरेटिव एआई मॉडल के साथ इंटिग्रेट करके, टेक्स्ट या इमेज जैसे डेटा को बनाया, खोजा, और बदला जा सकता है.
  • बातचीत करने वाले एआई के कॉन्सेप्ट लागू करके, एजेंट के तौर पर काम करने वाले एआई को बेहतर अनुभव दें. इससे आपको ज़्यादा व्यावहारिक, स्वाभाविक, बेहतर, और मददगार इंटरैक्शन मिलेंगे.

Google Chat ऐप्लिकेशन को एआई के साथ क्यों इंटिग्रेट करना चाहिए?

आम तौर पर, इस्तेमाल के उदाहरण इन कैटगरी में आते हैं:

  • कॉन्टेंट बनाना और उसमें बदलाव करना. मार्केटिंग कॉपी जनरेट करना, सोशल मीडिया पोस्ट बनाना, असली जैसी दिखने वाली इमेज बनाना, संगीत तैयार करना या वीडियो कॉन्टेंट बनाने में मदद करना.
  • डेटा खोजना और उसका विश्लेषण करना. बेतरतीब तरीके से व्यवस्थित नॉलेज बेस से अहम जानकारी निकालें, लंबे टेक्स्ट का सारांश बनाएं, कॉन्टेंट को कैटगरी में बांटें या बेहतर सटीकता और तेज़ी से भाषाओं का अनुवाद करें.
  • बातचीत. किसी असिस्टेंट की तरह, सामान्य तरीके से बातचीत करें. साथ ही, ज़्यादा जानकारी पाएं और बेहतर तरीके से बातचीत करें.
  • टास्क ऑटोमेशन. उपयोगकर्ता की ओर से कार्रवाइयां करना. जैसे, नया कैलेंडर इवेंट बनाना, कोई दस्तावेज़ भेजना या किसी बाहरी सिस्टम में टिकट मैनेज करना.

इन सुविधाओं को सीधे तौर पर Google Chat के जाने-पहचाने इंटरफ़ेस में इंटिग्रेट करने की सुविधा, उन सभी लोगों के लिए एक बेहतरीन अवसर है जो अपने उपयोगकर्ताओं के अनुभव और उनकी प्रॉडक्टिविटी को बेहतर बनाना चाहते हैं.

ज़रूरी शर्तें

आपको क्या बनाना है

इस कोडलैब में, आपको कम एलिमेंट वाले आठ Google Chat ऐप्लिकेशन बनाने हैं. इनमें एआई के बुनियादी सिद्धांतों को शामिल किया गया है, ताकि यह दिखाया जा सके कि इन्हें असल दुनिया के ऐप्लिकेशन में कैसे लागू किया जा सकता है. ये सभी Google Workspace ऐड-ऑन के तौर पर बनाए गए हैं और एचटीटीपी आर्किटेक्चर पर काम करते हैं:

2f1e2c66f6e2e2f0.png

यह इस तरह से काम करता है:

  1. कोई व्यक्ति, Google Chat में Chat ऐप्लिकेशन को मैसेज भेजता है. यह मैसेज, डायरेक्ट मैसेज के तौर पर या Chat स्पेस में भेजा जाता है.
  2. Chat ऐप्लिकेशन के लॉजिक वाले Node.js Google Cloud Run फ़ंक्शन के तौर पर चल रहे वेब सर्वर को एचटीटीपी अनुरोध भेजा जाता है.
  3. Chat ऐप्लिकेशन के लॉजिक को Google Workspace की सेवाओं (जैसे, Calendar और Sheets), Google की अन्य सेवाओं (जैसे, Maps, YouTube, और Vertex AI) या अन्य वेब सेवाओं (जैसे, प्रोजेक्ट मैनेजमेंट सिस्टम या टिकट सिस्टम) के साथ इंटिग्रेट किया जा सकता है. हालांकि, ऐसा करना ज़रूरी नहीं है.
  4. वेब सर्वर, Chat ऐप्लिकेशन की सेवा को Chat में एचटीटीपी जवाब भेजता है.
  5. जवाब, उपयोगकर्ता को भेजा जाता है.
  6. Chat ऐप्लिकेशन, Chat API को कॉल करके मैसेज पोस्ट कर सकता है या अन्य कार्रवाइयां कर सकता है. हालांकि, ऐसा करना ज़रूरी नहीं है.

हर Google Chat ऐप्लिकेशन के Node.js Google Cloud Run फ़ंक्शन में, यहां दी गई सोर्स फ़ाइलों का अपना वर्शन होता है. इससे ऊपर दिए गए तीसरे और छठे चरण में ज़रूरी कार्रवाइयां की जा सकती हैं:

  • package.json: यह एक सेंट्रल मेनिफ़ेस्ट है, जो Node.js प्रोजेक्ट के लिए ब्लूप्रिंट के तौर पर काम करता है. इसका इस्तेमाल मेटाडेटा, डिपेंडेंसी, और स्क्रिप्ट तय करने के लिए किया जाता है.
  • env.js: यह स्क्रिप्ट, एक्ज़ीक्यूशन के लिए ज़रूरी कॉन्स्टेंट सेट करती है. इसे एनवायरमेंट और कॉन्फ़िगरेशन के हिसाब से बदला जाना चाहिए.
  • index.js: यह मुख्य स्क्रिप्ट है. यह Google Chat के इंटरैक्शन इवेंट के लॉजिक को हैंडल करती है. इस कोडलैब में सिर्फ़ मैसेज इवेंट टाइप लागू किया गया है. हालांकि, आम तौर पर इसमें कार्ड पर क्लिक करना, स्लैश कमांड, और डायलॉग जैसे अन्य टाइप शामिल होते हैं.

Prompt ऐप्लिकेशन

यह ऐप्लिकेशन, Gemini के मॉडल पर काम करता है. इससे उपयोगकर्ताओं के साथ उनकी सामान्य भाषा में बातचीत की जा सकती है. साथ ही, छोटे और आसान शब्दों में जवाब दिए जा सकते हैं.

5975b36968ab597a.gif

ऐप्लिकेशन फ़ॉर्मैट करें

यह ऐप्लिकेशन, Prompt app पर आधारित है. इसमें Google Chat के मैसेज के टेक्स्ट फ़ॉर्मैट के मुताबिक, रिच टेक्स्ट वाले जवाब देने की सुविधा जोड़ी गई है.

bc49e0acf0838f28.gif

Ground ऐप्लिकेशन

यह ऐप्लिकेशन, Format app पर आधारित है. इसमें Google Search टूल का इस्तेमाल किया जा सकता है. साथ ही, जवाब वाले मैसेज में कार्ड के साथ सोर्स भी दिखाए जाते हैं.

3cf232bf153f6abc.gif

MCP ऐप्लिकेशन

यह ऐप्लिकेशन, Format app पर आधारित है. इसमें Google Workspace Developer Assist के मॉडल कॉन्टेक्स्ट प्रोटोकॉल (एमसीपी) के लिए सहायता जोड़ी गई है.

8219c29366e9120e.gif

कई चरणों वाला ऐप्लिकेशन

यह ऐप्लिकेशन, Format app पर आधारित है. इसमें Google Cloud Firestore डेटाबेस की मदद से, बातचीत की मेमोरी की सुविधा जोड़ी गई है.

a819c274ce586451.gif

कस्टम टूल ऐप्लिकेशन

यह ऐप्लिकेशन, Multi-turn app पर आधारित है. इसमें फ़ंक्शन कॉल करने वाले कस्टम टूल की सुविधा जोड़ी गई है. यह टूल, उपयोगकर्ता की दी गई जानकारी के आधार पर Google Workspace Calendar API को कॉल करता है.

a1c4f586b7ab2e24.gif

Stream ऐप्लिकेशन

यह ऐप्लिकेशन, Gemini के मॉडल पर निर्भर करता है. यह मॉडल, उपयोगकर्ताओं की ओर से दी गई थीम के आधार पर छोटी कहानियां जनरेट करता है. Google Chat API का इस्तेमाल, मैसेज में नतीजे और स्टेटस भेजने के लिए किया जाता है.

fd347ba03fe86e22.gif

मल्टीमॉडल ऐप्लिकेशन

यह ऐप्लिकेशन, Gemini के मॉडल का इस्तेमाल करके इमेज में बदलाव करता है. इसके लिए, यह उपयोगकर्ताओं के टेक्स्ट वाले निर्देशों पर निर्भर करता है. Google Chat API का इस्तेमाल, मैसेज अटैचमेंट के तौर पर इमेज डाउनलोड और अपलोड करने के लिए किया जाता है.

57574be33474bbc.gif

आपको क्या सीखने को मिलेगा

  • एआई के बुनियादी सिद्धांत, Google Chat ऐप्लिकेशन और उन्हें लागू करने के तरीके से जुड़े हैं.
  • Google Gen AI SDK का इस्तेमाल करके, Vertex AI को ऐक्सेस करने के लिए.
  • Google Workspace API का इस्तेमाल करके, बेहतरीन और काम की सुविधाएं डेवलप करने के लिए.
  • ज़्यादा उपयोगकर्ताओं को हैंडल करने वाले Google Chat ऐप्लिकेशन बनाने के लिए, Cloud Run का इस्तेमाल करना.

आपको इन चीज़ों की ज़रूरत होगी

  • Node.js का इस्तेमाल करके, एचटीटीपी Google Chat ऐप्लिकेशन बनाएं क्विकस्टार्ट पूरा किया गया हो. यह कोडलैब, Google Cloud प्रोजेक्ट, Google Chat ऐप्लिकेशन, और Google Cloud Run फ़ंक्शन के नतीजों पर आधारित है.

2. सेट अप करें

संसाधनों को शुरू करना और उन्हें ऐक्सेस करना

इस सेक्शन में, अपने पसंदीदा वेब ब्राउज़र से इन संसाधनों को ऐक्सेस और कॉन्फ़िगर किया जा सकता है.

Google Chat API का कॉन्फ़िगरेशन

Google Cloud Console को नए टैब में खोलें. इसके बाद, यह तरीका अपनाएं:

  1. अपना प्रोजेक्ट चुनें.
  2. Google Cloud के खोज फ़ील्ड में, "Google Chat API" खोजें. इसके बाद, Google Chat API पर क्लिक करें. इसके बाद, मैनेज करें पर क्लिक करें. इसके बाद, कॉन्फ़िगरेशन पर क्लिक करें.

  1. ऐप्लिकेशन का नाम और ब्यौरे को Gen AI App पर सेट करें.
  2. सेव करें पर क्लिक करें.

9a06649cf9285b99.png

Google Chat स्पेस

Google Chat को नए टैब में खोलें. इसके बाद, यह तरीका अपनाएं:

  1. अगर आपने अब तक ऐसा नहीं किया है, तो Chat ऐप्लिकेशन में जाकर कोई डायरेक्ट मैसेज स्पेस खोलें.
  2. Hello टाइप करें और enter दबाएं. Chat ऐप्लिकेशन को आपके नाम और अवतार की इमेज के साथ जवाब देना चाहिए.

e3b195c7b7b8e2af.png

Google Cloud Run फ़ंक्शन सेवा

Google Cloud Console को नए टैब में खोलें. इसके बाद, यह तरीका अपनाएं:

  1. अपना प्रोजेक्ट चुनें.
  2. मेन्यू ☰ > Cloud Run > सेवाएं पर क्लिक करें.

  1. सेवाओं की सूची में, addonchatapp पर क्लिक करें. इसके बाद, सोर्स टैब खोलें.

b69df34ea0dc48a5.png

सोर्स कोड और संसाधनों को स्थानीय तौर पर डाउनलोड करना

  1. GitHub की इस रिपॉज़िटरी को डाउनलोड करें.

  1. अपने पसंदीदा लोकल डेवलपमेंट एनवायरमेंट में, node/chat/gen-ai-apps डायरेक्ट्री खोलें.

3c57c15db4ebfddb.png

3. प्रॉम्प्ट ऐप्लिकेशन

यह ऐप्लिकेशन, Vertex AI पर Gemini को प्रॉम्प्ट करता है, ताकि वह उपयोगकर्ताओं के साथ उनकी सामान्य भाषा में बातचीत कर सके. इसके लिए, वह कम शब्दों में और सामान्य टेक्स्ट में जवाब देता है. इसे लागू करने के लिए, Node.js के लिए Google Gen AI SDK का इस्तेमाल किया जाता है.

कॉन्सेप्ट की समीक्षा करें

असली लगने वाली भाषा

ऐसी भाषा जिसे लोग रोज़ाना बातचीत करने के लिए बोलते या लिखते हैं. यह आर्टिफ़िशियल या कंप्यूटर आधारित भाषाओं से अलग होती है.

Cloud Run फ़ंक्शन

Cloud Run फ़ंक्शन, बिना सर्वर वाले बैकएंड बनाने, रीयल-टाइम में डेटा प्रोसेस करने, और स्मार्ट ऐप्लिकेशन बनाने के लिए बेहतरीन हैं. सर्वर को मैनेज, पैच या अपडेट करने की ज़रूरत नहीं होती. ये अपने-आप स्केल हो जाते हैं. साथ ही, ये आसानी से उपलब्ध होते हैं और इनमें गड़बड़ी होने की आशंका कम होती है.

प्रॉम्प्ट देना

प्रॉम्प्ट देना, इनपुट (प्रॉम्प्ट) तैयार करने की एक तकनीक है. इससे जनरेटिव एआई मॉडल को मनमुताबिक आउटपुट जनरेट करने में मदद मिलती है. इसमें आम तौर पर, मॉडल से खास और काम के जवाब पाने के लिए, सवालों को ध्यान से तैयार करना, संदर्भ देना, निर्देश देना या उदाहरण देना शामिल होता है.

Vertex AI

Vertex AI में, जनरेटिव एआई को बनाने और इस्तेमाल करने के लिए ज़रूरी सभी चीज़ें उपलब्ध हैं. जैसे, एआई के समाधान, खोज और बातचीत, 130 से ज़्यादा बुनियादी मॉडल, और यूनिफ़ाइड एआई प्लैटफ़ॉर्म.

c9e9c7a1945b22ac.png

Gemini

Gemini, Google का एक मल्टीमॉडल एलएलएम है. इसे Vertex AI के ज़रिए ऐक्सेस किया जा सकता है. इससे लोगों को अपनी पूरी क्षमता का इस्तेमाल करने में मदद मिलती है. इससे वे अपनी कल्पना को और बेहतर बना पाते हैं, नई चीज़ें जानने की इच्छा को बढ़ा पाते हैं, और अपनी प्रॉडक्टिविटी को बेहतर बना पाते हैं.

Google Gen AI SDK

Google Gen AI SDK को डेवलपर के लिए डिज़ाइन किया गया है, ताकि वे Gemini की मदद से ऐप्लिकेशन बना सकें. यह एक ऐसा यूनीफ़ाइड इंटरफ़ेस उपलब्ध कराता है जो Gemini Developer API और Vertex AI, दोनों के साथ काम करता है. यह Python, Go, Node.js, और Java में क्लाइंट लाइब्रेरी के साथ आता है.

समीक्षा का तरीका

c625fdcc8b4a27f4.png

सोर्स कोड की समीक्षा करना

env.js

...
// Replace with your GCP project ID.
projectID: process.env.PROJECT_ID || 'your-google-cloud-project-id',

// Replace with your GCP project location.
location: process.env.LOCATION || 'your-google-cloud-project-location',

// Replace with the Gemini model to use.
model: process.env.MODEL || 'gemini-2.5-flash-lite',
...

index.js

// Import the Google Gen AI SDK.
import { GoogleGenAI } from '@google/genai';
...
// Use Vertex AI.
const genAI = new GoogleGenAI({vertexai: true, project: env.projectID, location: env.location});

http('gen-ai-app', async (req, res) => {
 // Send a new Chat message with the generated answer
 return res.send({ hostAppDataAction: { chatDataAction: { createMessageAction: { message: {
   text: await generateAnswer(req.body.chat.messagePayload.message.text)
 }}}}});
});

async function generateAnswer(message) {
 // The prompt is made of the user's message and specific instructions for the model.
 const prompt = 'In a consice and with plain text only (no formatting), '
                 + 'answer the following message in the same language: ' + message;
 const aiResponse = await genAI.models.generateContent({model: env.model, contents: prompt});
 return aiResponse.candidates[0].content.parts[0].text;
};
...

package.json

...
"main": "index.js",
"type": "module",
"scripts": {
  "start": "node index.js"
},
"dependencies": {
  "@google-cloud/functions-framework": "^4.0.0",
  "@google/genai": "1.15.0"
},
...

Vertex AI API चालू करना

  1. Google Cloud Console में जाकर, Vertex AI API चालू करें:

  1. मेन्यू ☰ > एपीआई और सेवाएं > चालू किए गए एपीआई और सेवाएं पर क्लिक करें. इसके बाद, पुष्टि करें कि सूची में Vertex AI API मौजूद है.

Google Cloud Run Node.js फ़ंक्शन को अपडेट करना

  1. अपने लोकल डेवलपमेंट एनवायरमेंट में, मौजूदा डायरेक्ट्री को node/chat/gen-ai-apps/1-prompt में बदलें. इसमें पूरा सोर्स कोड और संसाधन शामिल होते हैं.
  2. एडिटर में env.js खोलें और ये सेटिंग करें:
  3. projectID: यह आपके Google Cloud प्रोजेक्ट का आईडी होता है. इसे Google Cloud Console के वेलकम पेज से वापस पाया जा सकता है.

  1. location: यह Google Cloud Run फ़ंक्शन सेवा का क्षेत्र है. इसे Google Cloud Run फ़ंक्शन की सेवा के बारे में जानकारी देने वाले पेज से वापस पाया जा सकता है.

  1. model: इस्तेमाल किया जाने वाला मॉडल. Vertex AI के दस्तावेज़ में, आपको सभी उपलब्ध मॉडल मिल सकते हैं. डिफ़ॉल्ट रूप से, तेज़ और कम कीमत में काम करने के लिए Flash मॉडल सेट किया जाता है.

6c2fb9f554f53a4a.png

  1. Google Cloud Run फ़ंक्शन की सेवा के बारे में ज़्यादा जानकारी वाले पेज के सोर्स टैब पर जाएं.

  1. सोर्स में बदलाव करें पर क्लिक करें.
  2. फ़ंक्शन एंट्री पॉइंट को gen-ai-app पर सेट करें.
  3. ➕ पर क्लिक करें. इसके बाद, env.js टाइप करें और ✔️ पर क्लिक करके, सोर्स फ़ाइल बनाएं.
  4. index.js, env.js, और package.json फ़ाइलों के पूरे कॉन्टेंट को, अपने लोकल डेवलपमेंट एनवायरमेंट में मौजूद कॉन्टेंट से बदलें.
  5. सेव करें और फिर से डिप्लॉय करें पर क्लिक करें.
  6. बदलाव को लागू करने की प्रोसेस पूरी होने तक इंतज़ार करें.

487b64f2d3b1a104.png

इसे आज़माएँ

  1. Google Chat में Chat ऐप्लिकेशन के साथ डायरेक्ट मैसेज स्पेस में, Hello, how are you? टाइप करें और enter दबाएं. ऐप्लिकेशन को प्रॉम्प्ट में दिए गए हमारे निर्देशों के मुताबिक, सादे टेक्स्ट में कम शब्दों में जवाब देना चाहिए.

3cc1fd1de2a9e239.png

  1. Google Chat में Chat ऐप्लिकेशन के साथ डायरेक्ट मैसेज स्पेस में, Bonjour comment allez-vous? टाइप करें और enter दबाएं. ऐप्लिकेशन को प्रॉम्प्ट में दिए गए हमारे निर्देशों के मुताबिक, फ़्रेंच में जवाब देना चाहिए.

77010f4ad0bde5da.png

4. ऐप्लिकेशन फ़ॉर्मैट करें

यह ऐप्लिकेशन, Prompt app पर आधारित है. इसमें Google Chat के टेक्स्ट मैसेज फ़ॉर्मैट के मुताबिक, रिच टेक्स्ट वाले जवाब देने की सुविधा जोड़ी गई है. प्रॉम्प्ट में दिए गए निर्देशों को अपडेट किया जाता है. इसमें उन सभी विकल्पों के बारे में पूरी जानकारी दी जाती है जिनका इस्तेमाल मॉडल कर सकता है.

कॉन्सेप्ट की समीक्षा करें

Google Chat के टेक्स्ट मैसेज

Google Chat में भेजे जाने वाले टेक्स्ट मैसेज में फ़ॉर्मैटिंग के कई विकल्प उपलब्ध होते हैं. इससे Google Chat इंटरफ़ेस में ही, साफ़ तौर पर और ज़्यादा जानकारी वाले मैसेज भेजे जा सकते हैं. ये खास मार्कडाउन नियमों पर आधारित होते हैं. इनका इस्तेमाल बोल्ड, इटैलिक, स्ट्राइकथ्रू, हाइपरलिंक बनाने वगैरह के लिए किया जाता है.

समीक्षा का तरीका

c625fdcc8b4a27f4.png

सोर्स कोड की समीक्षा करना

index.js

...
async function generateAnswer(message) {
 // Specify formatting options that are compatible with Google Chat messages
 // https://developers.google.com/workspace/chat/format-messages#format-texts
 const prompt = `Use simple text for concise answers. The only formatting options you can use is to
(1) surround some text with a single star for bold such as *text* for strong emphasis
(2) surround some text with a single underscore for italic such as _text_ for gentle emphasis
(3) surround some text with a single tild for strikethrough such as ~text~ for removal
(4) use a less than before followed by a URL followed by a pipe followed by a link text followed
    by a more than for a hyperlink such as <https://example.com|link text> for resource referencing
(5) use a backslash followed by the letter n for a new line such as \n for readibility
(6) surround some text with a single backquote such as \`text\` for quoting code
(7) surround an entire paragraph with three backquotes in dedicated lines such as
    \`\`\`\nparagraph\n\`\`\` for quoting code
(8) prepend lines with list items with a single star or hyphen followed by a single space
    such as * list item or - list item for bulleting ;
DO NOT USE ANY OTHER FORMATTING OTHER THAN THOSE.
Answer the following message in the same language: ${message}`;
...
};
...

Google Cloud Run Node.js फ़ंक्शन को अपडेट करना

  1. अपने लोकल डेवलपमेंट एनवायरमेंट में, मौजूदा डायरेक्ट्री को node/chat/gen-ai-apps/2-format में बदलें. इसमें पूरा सोर्स कोड और संसाधन शामिल होते हैं.
  2. Google Cloud Run फ़ंक्शन की सेवा के बारे में ज़्यादा जानकारी वाले पेज के सोर्स टैब पर जाएं.

  1. सोर्स में बदलाव करें पर क्लिक करें.
  2. index.js फ़ाइल के पूरे कॉन्टेंट को, अपने लोकल डेवलपमेंट एनवायरमेंट में मौजूद कॉन्टेंट से बदलें.
  3. सेव करें और फिर से डिप्लॉय करें पर क्लिक करें.
  4. बदलाव को लागू करने की प्रोसेस पूरी होने तक इंतज़ार करें.

487b64f2d3b1a104.png

इसे आज़माएँ

  1. Google Chat में Chat ऐप्लिकेशन के साथ डायरेक्ट मैसेज स्पेस में, Showcase all formatting options you have with one paragraph each टाइप करें और enter दबाएं. ऐप्लिकेशन को, प्रॉम्प्ट में दिए गए हमारे निर्देशों के आधार पर, फ़ॉर्मैटिंग के सैंपल के साथ जवाब देना चाहिए.

cc7f7101d9f7c10.png

  1. Google Chat में Chat ऐप्लिकेशन के साथ डायरेक्ट मैसेज स्पेस में, What are Google Chat apps? What's great about them? टाइप करें और enter दबाएं. जब फ़ॉर्मैटिंग के साथ जवाब देना मददगार हो, तब ऐप्लिकेशन को ऐसा करना चाहिए.

83557d4c7071aac8.png

5. Ground ऐप्लिकेशन

यह ऐप्लिकेशन, Format app पर आधारित है. इसमें जवाब के सोर्स की जानकारी देने और जवाब को भरोसेमंद बनाने की सुविधा जोड़ी गई है. यह Google Search टूल को चलाता है और जवाबों के लिंक वाले कार्ड अटैच करता है.

कॉन्सेप्ट की समीक्षा करना

भरोसेमंद स्रोतों से जानकारी का हवाला देना (Grounding)

ग्राउंडिंग, मॉडल को जानकारी के सोर्स से कनेक्ट करने की एक तकनीक है. इसका इस्तेमाल अक्सर व्यावहारिक ऐप्लिकेशन में किया जाता है. इससे, जनरेट किए गए कॉन्टेंट को ज़्यादा सटीक और काम का बनाया जा सकता है. इसके लिए, यह मॉडल असल दुनिया के डेटा का इस्तेमाल करता है. इससे मॉडल को तथ्यों के हिसाब से गलत जानकारी देने या काल्पनिक जानकारी जनरेट करने से रोका जा सकता है.

Google Search टूल

Google Search टूल की मदद से, मॉडल को रीयल-टाइम में वेब पर जानकारी खोजने की अनुमति मिलती है. इससे, मॉडल को जवाब देने के लिए भरोसेमंद सोर्स से जानकारी मिलती है. साथ ही, यह पक्का किया जा सकता है कि जवाब सटीक और अप-टू-डेट हों.

Google Workspace Card फ़्रेमवर्क

Google Workspace में मौजूद कार्ड फ़्रेमवर्क की मदद से डेवलपर, बेहतर और इंटरैक्टिव यूज़र इंटरफ़ेस बना सकते हैं. इससे व्यवस्थित और देखने में आकर्षक कार्ड बनाए जा सकते हैं. इनमें टेक्स्ट, इमेज, बटन, और अन्य विजेट शामिल किए जा सकते हैं. इन कार्ड से उपयोगकर्ता अनुभव बेहतर होता है. ऐसा इसलिए, क्योंकि इनमें व्यवस्थित तरीके से जानकारी दी जाती है. साथ ही, बातचीत के दौरान ही तुरंत कार्रवाई करने की सुविधा मिलती है.

समीक्षा फ़्लो

b72d69a6e79858d6.png

सोर्स कोड की समीक्षा करना

index.js

...
const aiResponse = await genAI.models.generateContent({
 model: env.model,
 contents: prompt,
 // Google Search tool is enabled
 config: { tools: [{ googleSearch: {}}]}
});

let groundingCardsV2 = undefined;
const grounding = aiResponse.candidates[0].groundingMetadata;
// Go through the grounding metadata if any
if (grounding && grounding.groundingChunks && grounding.groundingChunks.length > 0) {
 let linkButtons = [];
 grounding.groundingChunks.forEach(groundingChunk => {
   if (groundingChunk.web) {
     // Create one link button per web URL returned
     linkButtons.push({
       text: groundingChunk.web.domain,
       onClick: { openLink: { url: groundingChunk.web.uri}}
     });
   }
 });
 // Create a card with link buttons
 groundingCardsV2 = [{
   cardId: "sourcesCard",
   card: { sections: [{
     header: "Sources",
     widgets: [{ buttonList: { buttons: linkButtons}}]
   }]}
 }];
}

// Send a Chat message with the generated answer
return res.send({ hostAppDataAction: { chatDataAction: { createMessageAction: { message: {
 text: aiResponse.candidates[0].content.parts[0].text,
 // The sources are referenced in the card
 cardsV2: groundingCardsV2
}}}}});
...

Google Cloud Run Node.js फ़ंक्शन को अपडेट करना

  1. अपने लोकल डेवलपमेंट एनवायरमेंट में, मौजूदा डायरेक्ट्री को node/chat/gen-ai-apps/3-ground में बदलें. इसमें पूरा सोर्स कोड और संसाधन शामिल होते हैं.
  2. Google Cloud Run फ़ंक्शन की सेवा के बारे में ज़्यादा जानकारी वाले पेज के सोर्स टैब पर जाएं.

  1. सोर्स में बदलाव करें पर क्लिक करें.
  2. index.js फ़ाइल के पूरे कॉन्टेंट को, अपने लोकल डेवलपमेंट एनवायरमेंट में मौजूद कॉन्टेंट से बदलें.
  3. सेव करें और फिर से डिप्लॉय करें पर क्लिक करें.
  4. बदलाव को लागू करने की प्रोसेस पूरी होने तक इंतज़ार करें.

487b64f2d3b1a104.png

इसे आज़माएँ

Google Chat में Chat ऐप्लिकेशन के साथ डायरेक्ट मैसेज स्पेस में, What's the world population? टाइप करें और enter दबाएं. ऐप्लिकेशन को जवाब में, कार्ड में सोर्स के लिंक अटैच करके जवाब देना चाहिए.

cff461da29c05873.png

6. MCP ऐप्लिकेशन

यह ऐप्लिकेशन, Format app पर आधारित है. इसमें रिमोट तौर पर होस्ट किए गए मॉडल कॉन्टेक्स्ट प्रोटोकॉल (एमसीपी) सर्वर से मिले टूल के लिए सहायता जोड़ी गई है. यह Google Workspace Developer Assist MCP से कनेक्ट होता है. यह Google Workspace Developers के दस्तावेज़ को ऐक्सेस करने और खोजने के लिए टूल उपलब्ध कराता है.

कॉन्सेप्ट की समीक्षा करें

मॉडल कॉन्टेक्स्ट प्रोटोकॉल (एमसीपी)

मॉडल कॉन्टेक्स्ट प्रोटोकॉल एक ओपन-सोर्स फ़्रेमवर्क है. यह मॉडल को बाहरी सेवाओं के साथ स्टैंडर्ड तरीके से इंटिग्रेट करता है. मॉडल, प्रोग्राम के हिसाब से अलग-अलग टूल को ढूंढ सकते हैं, उन्हें समझ सकते हैं, और उनके साथ इंटरैक्ट कर सकते हैं. इससे उनकी क्षमताओं में बढ़ोतरी होती है, वे असल दुनिया में काम कर पाते हैं, और अपडेट की गई जानकारी को ऐक्सेस कर पाते हैं.

MCP TypeScript SDK

TypeScript SDK, एमसीपी की पूरी खास जानकारी को लागू करता है. इससे, एमसीपी क्लाइंट बनाना आसान हो जाता है. ये क्लाइंट, किसी भी एमसीपी सर्वर से कनेक्ट हो सकते हैं. इससे ऐसे एमसीपी सर्वर भी बनाए जा सकते हैं जो संसाधनों, प्रॉम्प्ट, और टूल का ऐक्सेस देते हैं.

समीक्षा का तरीका

e0b324e2cca21915.png

सोर्स कोड की समीक्षा करना

index.js

// Import the MCP TypeScript SDK.
import { Client } from "@modelcontextprotocol/sdk/client/index.js";
import { StreamableHTTPClientTransport } from "@modelcontextprotocol/sdk/client/streamableHttp.js";
import { SSEClientTransport } from "@modelcontextprotocol/sdk/client/sse.js";
...
// Create and connect the MCP client from the URL.
const mcpServerUrl = new URL("https://workspace-developer.goog/mcp");
const client = new Client({ name: "gen-ai-app-mcp", version: "1.0.0" });
// Try Streamable HTTP first (new) and SSE (old) as fallback for transport
try {
 await client.connect(new StreamableHTTPClientTransport(mcpServerUrl));
} catch (error) {
 await client.connect(new SSEClientTransport(mcpServerUrl));
}

http('gen-ai-app', async (req, res) => {
 ...
 const aiResponse = await genAI.models.generateContent({
   model: env.model,
   contents: prompt,
   // MCP tools are enabled
   config: { tools: [mcpToTool(client)]}
 });
 ...
}
...

package.json

...
"dependencies": {
  ...
  "@modelcontextprotocol/sdk": "^1.18.1"
},
...

Google Cloud Run Node.js फ़ंक्शन को अपडेट करना

  1. अपने लोकल डेवलपमेंट एनवायरमेंट में, मौजूदा डायरेक्ट्री को node/chat/gen-ai-apps/4-mcp में बदलें. इसमें पूरा सोर्स कोड और संसाधन शामिल होते हैं.
  2. Google Cloud Run फ़ंक्शन की सेवा के बारे में ज़्यादा जानकारी वाले पेज के सोर्स टैब पर जाएं.

  1. सोर्स में बदलाव करें पर क्लिक करें.
  2. index.js और package.json फ़ाइलों के पूरे कॉन्टेंट को, अपने लोकल डेवलपमेंट एनवायरमेंट में मौजूद कॉन्टेंट से बदलें.
  3. सेव करें और फिर से डिप्लॉय करें पर क्लिक करें.
  4. बदलाव को लागू करने की प्रोसेस पूरी होने तक इंतज़ार करें.

487b64f2d3b1a104.png

इसे आज़माएँ

  1. Google Chat में Chat ऐप्लिकेशन के साथ डायरेक्ट मैसेज स्पेस में, What can you do for me? टाइप करें और enter दबाएं. ऐप्लिकेशन में यह बताया जाना चाहिए कि वह क्या-क्या कर सकता है (एमसीपी टूल).

13535bfd31d85a50.png

  1. Google Chat में Chat ऐप्लिकेशन के साथ डायरेक्ट मैसेज स्पेस में, I would like to get the latest official documentation for the Google Sheets API append values टाइप करें और enter दबाएं. ऐप्लिकेशन को, एमसीपी टूल का इस्तेमाल करके, अनुरोध किए गए दस्तावेज़ों के साथ जवाब देना चाहिए.

8a6f4ac5b7d5fa4a.png

7. एक से ज़्यादा बार बातचीत करने की सुविधा वाला ऐप्लिकेशन

यह ऐप्लिकेशन, Format app पर आधारित है. यह चैट इंटरैक्शन के इतिहास को ट्रैक करके, बातचीत की मेमोरी की सुविधा जोड़ता है. इससे आपको ज़्यादा नैचुरल, स्मार्ट, और अपने हिसाब से अनुभव मिलता है. यह ऐप्लिकेशन, स्टोरेज के लिए अपने Google Cloud प्रोजेक्ट से जुड़े डिफ़ॉल्ट Google Cloud Firestore डेटाबेस का इस्तेमाल करता है.

कॉन्सेप्ट की समीक्षा करना

कई बार बातचीत करना

कई बार बातचीत करने के कॉन्सेप्ट का मतलब है कि मॉडल, कई बार बातचीत करने और अलग-अलग विषयों पर बातचीत करने के दौरान, संदर्भ और निरंतरता बनाए रख सकता है. यह सुविधा, जटिल बातचीत, एआई की मदद से काम करने वाली बेहतर सुविधाओं, और उपयोगकर्ता को बेहतर अनुभव देने के लिए ज़रूरी है.

Google Cloud Firestore

Google Cloud Firestore, मोबाइल, वेब, और सर्वर डेवलपमेंट के लिए एक फ़्लेक्सिबल और स्केलेबल NoSQL क्लाउड डेटाबेस है. यह डेटा को दस्तावेज़ों में सेव करता है. इन दस्तावेज़ों को कलेक्शन में व्यवस्थित किया जाता है. साथ ही, यह रीयल-टाइम में सिंक करने और ऑफ़लाइन सहायता की सुविधा देता है.

समीक्षा का तरीका

52920a2227467218.png

सोर्स कोड की समीक्षा करना

index.js

// Import the Google Cloud Firestore client library.
import { Firestore } from '@google-cloud/firestore';
...
// Configure DB
const USERS_PREFIX = 'users/';
const CHATS_COLLECTION = 'chats';
const db = new Firestore();
...
// Create or update data for a given user
async function createOrUpdateChatHistory(userId, data) {
 await db.collection(CHATS_COLLECTION).doc(userId.replace(USERS_PREFIX, '')).set(data);
};

// Retrieve data snapshot for a given user
async function getChatHistory(userId) {
 return await db.collection(CHATS_COLLECTION).doc(userId.replace(USERS_PREFIX, '')).get();
};
...

...
http('gen-ai-app', async (req, res) => {
 // Retrieve the chat history of the user
 const chatHistory = await getChatHistory(userId);
 const chat = genAI.chats.create({
   model: env.model,
   // Initiate the model with chat history for context
   history: chatHistory.exists ? chatHistory.data().contents : []
 });
 // If no history, send a first message to the model with instructions on how to behave
 if(!chatHistory.exists) {
   const preambule = 'The only formatting options you can use is to '
                   + ...
                   + 'DO NOT USE ANY OTHER FORMATTING OTHER THAN THOSE. '
                   + 'Answer in the same language that I use.';
   // The answer to this message is ignored
   await chat.sendMessage({message: preambule});
 }

 // Send the user's message to the model to generate the answer
 const aiResponse = await chat.sendMessage({message: userMessage});

 // Persist the updated chat history of the user
 await createOrUpdateChatHistory(userId, {contents: chat.getHistory({curated: true})});

 // Send a Chat message with the generated answer
 return res.send({ hostAppDataAction: { chatDataAction: { createMessageAction: { message: {
   text: aiResponse.candidates[0].content.parts[0].text
 }}}}});
});
...

package.json

...
"dependencies": {
  ...
  "@google-cloud/firestore": "^7.11.5"
},
...

Google Cloud Firestore API चालू करें

  1. Google Cloud Console में जाकर, Google Cloud Firestore API को चालू करें:

  1. मेन्यू ☰ > एपीआई और सेवाएं > चालू किए गए एपीआई और सेवाएं पर क्लिक करें. इसके बाद, पुष्टि करें कि सूची में Cloud Firestore API मौजूद है.

Cloud Firestore डेटाबेस बनाना

  1. Google Cloud Console में, मेन्यू ☰ > Firestore पर क्लिक करें

  1. Firestore डेटाबेस बनाएं पर क्लिक करें
  2. डिफ़ॉल्ट कॉन्फ़िगरेशन को ऐसे ही रहने दें और डेटाबेस बनाएं पर क्लिक करें

Google Cloud Run Node.js फ़ंक्शन को अपडेट करना

  1. अपने लोकल डेवलपमेंट एनवायरमेंट में, मौजूदा डायरेक्ट्री को node/chat/gen-ai-apps/5-multi-turn में बदलें. इसमें पूरा सोर्स कोड और संसाधन शामिल होते हैं.
  2. Google Cloud Run फ़ंक्शन की सेवा के बारे में ज़्यादा जानकारी वाले पेज के सोर्स टैब पर जाएं.

  1. सोर्स में बदलाव करें पर क्लिक करें.
  2. index.js और package.json फ़ाइलों के पूरे कॉन्टेंट को, अपने लोकल डेवलपमेंट एनवायरमेंट में मौजूद कॉन्टेंट से बदलें.
  3. सेव करें और फिर से डिप्लॉय करें पर क्लिक करें.
  4. बदलाव को लागू करने की प्रोसेस पूरी होने तक इंतज़ार करें.

487b64f2d3b1a104.png

इसे आज़माएँ

  1. Google Chat में Chat ऐप्लिकेशन के साथ डायरेक्ट मैसेज स्पेस में, Can you speak with the English from the 80's for now on? टाइप करें और enter दबाएं. ऐप्लिकेशन को सकारात्मक जवाब देना चाहिए.

b273beda7e203b23.png

  1. Google Chat में Chat ऐप्लिकेशन के साथ डायरेक्ट मैसेज स्पेस में, Define what Google Chat apps are in one sentence टाइप करें और enter दबाएं. ऐप्लिकेशन को 80 के दशक की अंग्रेज़ी में जवाब देना जारी रखना चाहिए.

9156f563c369f186.png

8. कस्टम टूल ऐप्लिकेशन

यह ऐप्लिकेशन, Multi-turn app पर आधारित है. इसमें फ़ंक्शन कॉल करने वाले कस्टम टूल के लिए सहायता जोड़ी गई है. यह टूल, सार्वजनिक कैलेंडर से अगला इवेंट पाने के लिए Google Workspace Calendar API पर निर्भर करता है. यह मॉडल, उपयोगकर्ता के सभी इंटरैक्शन को मैनेज करता है. इसमें टूल से इनपुट पाना और आउटपुट देना शामिल है. हालांकि, ज़रूरी एपीआई कॉल करने और अनुरोध करने पर मॉडल को नतीजे देने की ज़िम्मेदारी अब भी ऐप्लिकेशन की होती है. ऐप्लिकेशन, Google API कुंजी का इस्तेमाल करता है. ऐसा इसलिए, क्योंकि सार्वजनिक कैलेंडर का डेटा फ़ेच करने के लिए, उपयोगकर्ता के क्रेडेंशियल की ज़रूरत नहीं होती.

कॉन्सेप्ट की समीक्षा करें

फ़ंक्शन कॉलिंग

फ़ंक्शन कॉलिंग की मदद से, मॉडल यह पता लगा सकता है कि उपयोगकर्ता के अनुरोध को किसी बाहरी टूल या एपीआई की मदद से पूरा किया जा सकता है या नहीं. इसके बाद, मॉडल उस टूल को कॉल करने के लिए ज़रूरी पैरामीटर देता है. इससे बाहरी फ़ंक्शन को अपने जवाबों में इंटिग्रेट किया जा सकता है.

Google Workspace APIs

Google Workspace API की मदद से डेवलपर, अपने ऐप्लिकेशन को Google Workspace की अलग-अलग सेवाओं के साथ इंटिग्रेट कर सकते हैं. ये एपीआई, Gmail, Chat, Calendar, Drive, Docs, Sheets वगैरह जैसे प्रॉडक्ट की सुविधाओं को प्रोग्राम के हिसाब से ऐक्सेस करने की सुविधा देते हैं. इससे ऑटोमेशन, डेटा सिंक करने, और कस्टम वर्कफ़्लो बनाने की सुविधा मिलती है.

समीक्षा का तरीका

ed866ca369a4512f.png

सोर्स कोड की समीक्षा करना

env.js

...
// Replace with your Google API key.
googleApiKey: process.env.GOOGLE_API_KEY || 'your-google-api-key',
...

index.js

// Import parameter type definitions from Google Gen AI SDK.
import { GoogleGenAI, Type } from '@google/genai';
// Import Google APIs that include the Google Calendar API.
import { google } from 'googleapis';
...
// Create a Google Calendar API client using a Google API key.
const calendar = google.calendar({version: 'v3', auth: env.googleApiKey});
...
// Define the tool used for function calling
const getNextPublicCalendarEventTitleFunctionDeclaration = {
 name: 'getNextPublicCalendarEventTitle',
 parameters: {
   type: Type.OBJECT,
   description: 'Get the title of the next event of a public calendar.',
   properties: {
     calendarId: {
       type: Type.STRING,
       description: 'ID of the public calendar to get the next event title.',
     }
   },
   required: ['calendarId']
 }
};

// The function referenced in the tool definition
async function getNextPublicCalendarEventTitle(calendarId) {
 // Use Calendar API to retrieve the next event in the given calendar
 const response = await calendar.events.list({
   calendarId: calendarId,
   timeMin: new Date().toISOString(),
   maxResults: 1,
   singleEvents: true,
   orderBy: 'startTime',
 });
 const events = response.data.items;
 if (!events || events.length === 0) {
   return null;
 }
 return `${events[0].summary}`;
};
...

...
http('gen-ai-app', async (req, res) => {
 ...
 // Send the user's message to the model to generate the answer
 let aiResponse = await chat.sendMessage({
   message: userMessage,
   // The tool used for function calling is enabled
   config: { tools: [{ functionDeclarations: [getNextPublicCalendarEventTitleFunctionDeclaration]}]}
 });

 // Handle the function calling turn with the model if any
 const functionCall = aiResponse.candidates[0].content.parts[0].functionCall;
 if (functionCall) {
   let functionResult = null;
   switch(functionCall.name) {
     case 'getNextPublicCalendarEventTitle':
       // Make the function call as per model request
       functionResult = await getNextPublicCalendarEventTitle(functionCall.args['calendarId']);
       break;
     default:
   }
   // Finish the function calling turn by sending the execution result to the model
   aiResponse = await chat.sendMessage({ message: { functionResponse: {
     name: functionCall.name,
     response: { output: functionResult }
   }}});
 }
 ...
 // Send a Chat message with the generated answer
 return res.send({ hostAppDataAction: { chatDataAction: { createMessageAction: { message: {
   text: aiResponse.candidates[0].content.parts[0].text
 }}}}});
});
...

package.json

...
"dependencies": {
  ...
   "googleapis": "^160.0.0"
},
...

Calendar API चालू करना

  1. Google Cloud Console में जाकर, Google Calendar API को चालू करें:

  1. मेन्यू ☰ > एपीआई और सेवाएं > चालू किए गए एपीआई और सेवाएं पर क्लिक करें. इसके बाद, पुष्टि करें कि सूची में Google Calendar API मौजूद है.

Google API पासकोड बनाना

Google Cloud Console में जाकर, यह तरीका अपनाएं:

  1. मेन्यू ☰ > एपीआई और सेवाएं > क्रेडेंशियल पर क्लिक करें.

  1. + क्रेडेंशियल बनाएं पर क्लिक करें. इसके बाद, एपीआई पासकोड चुनें.
  2. कार्रवाई पूरी होने तक इंतज़ार करें.
  3. पुष्टि करने वाले डायलॉग बॉक्स में, आपका एपीआई पासकोड टेक्स्ट फ़ील्ड ढूंढें. इसके बाद, क्लिपबोर्ड पर कॉपी करें पर क्लिक करें.

Google Cloud Run Node.js फ़ंक्शन को अपडेट करना

  1. अपने लोकल डेवलपमेंट एनवायरमेंट में, मौजूदा डायरेक्ट्री को node/chat/gen-ai-apps/6-custom-tool में बदलें. इसमें पूरा सोर्स कोड और संसाधन शामिल होते हैं.
  2. Google Cloud Run फ़ंक्शन की सेवा के बारे में ज़्यादा जानकारी वाले पेज के सोर्स टैब पर जाएं.

  1. सोर्स में बदलाव करें पर क्लिक करें.
  2. index.js और package.json फ़ाइलों के पूरे कॉन्टेंट को, अपने लोकल डेवलपमेंट एनवायरमेंट में मौजूद कॉन्टेंट से बदलें.
  3. env.js फ़ाइल खोलें और यह तरीका अपनाएं
  4. एक्सपोर्ट किए गए फ़ील्ड में googleApiKey जोड़ें
export const env = {
 ...
 googleApiKey: 'your-google-api-key',
};
  1. your-google-api-key को पिछले चरण में कॉपी किए गए Google API पासकोड से बदलें. इसे Google Cloud के क्रेडेंशियल पेज से वापस पाया जा सकता है. इसके लिए, Show key पर क्लिक करें.

  1. सेव करें और फिर से डिप्लॉय करें पर क्लिक करें.
  2. बदलाव को लागू करने की प्रोसेस पूरी होने तक इंतज़ार करें.

487b64f2d3b1a104.png

इसे आज़माएँ

  1. Google Calendar में जाकर, यह तरीका अपनाएं:
  2. दूसरे कैलेंडर में जाकर, + पर क्लिक करें. इसके बाद, नया कैलेंडर बनाएं पर क्लिक करें.
  3. Name को My Public Calendar पर सेट करें
  4. कैलेंडर बनाएं पर क्लिक करें
  5. कार्रवाई पूरी होने तक इंतज़ार करें.
  6. मेरे कैलेंडर की सेटिंग में जाकर, नया बनाया गया कैलेंडर मेरा सार्वजनिक कैलेंडर चुनें
  7. इवेंट के ऐक्सेस से जुड़ी अनुमतियां में जाकर, सार्वजनिक तौर पर उपलब्ध कराएं को चुनें. इसके बाद, चेतावनी वाले डायलॉग बॉक्स में ठीक है पर क्लिक करें.
  8. इवेंट के ऐक्सेस से जुड़ी अनुमतियां में जाकर, सार्वजनिक तौर पर उपलब्ध कराएं विकल्प के बगल में मौजूद ड्रॉपडाउन मेन्यू से, इवेंट से जुड़ी सारी जानकारी दिखना विकल्प चुनें
  9. कैलेंडर जोड़ें में जाकर, कैलेंडर आईडी फ़ील्ड की वैल्यू को क्लिपबोर्ड पर कॉपी करें
  10. सेटिंग से बाहर निकलने के लिए, सबसे ऊपर बाएं कोने में मौजूद बाईं ओर वाले ऐरो पर क्लिक करें.
  11. कल के लिए नया इवेंट बनाने के लिए, कैलेंडर पर क्लिक करें. इसके बाद, Important meeting टाइप करें. ड्रॉपडाउन से मेरा सार्वजनिक कैलेंडर चुनें. इसके बाद, सेव करें पर क्लिक करें
  12. Google Chat में Chat ऐप्लिकेशन के साथ डायरेक्ट मैसेज स्पेस में, When is the next meeting? टाइप करें और enter दबाएं. ऐप्लिकेशन को सटीक जानकारी का अनुरोध करना चाहिए, क्योंकि यह साफ़ तौर पर नहीं बताया गया है कि किस कैलेंडर के बारे में बात की जा रही है.

40383099311b0813.png

  1. Google Chat में Chat ऐप्लिकेशन के साथ डायरेक्ट मैसेज स्पेस में, उस कैलेंडर आईडी को चिपकाएं जिसे आपने पहले क्लिपबोर्ड पर कॉपी किया था. इसके बाद, enter दबाएं. ऐप्लिकेशन को, पहले बनाए गए इवेंट की जानकारी के साथ जवाब देना चाहिए.

4c614c7e444e3b45.png

9. ऐप्लिकेशन स्ट्रीम करना

यह ऐप्लिकेशन, Gemini के मॉडल पर काम करता है. यह लोगों के दिए गए विषयों के आधार पर, दो मिनट की कहानियां जनरेट करता है. पूरे जवाब जनरेट होने में समय लगता है. इसलिए, ऐप्लिकेशन स्ट्रीमिंग मोड में मॉडल को कॉल करता है. साथ ही, Google Chat API पर भरोसा करता है, ताकि मैसेज में कॉन्टेंट और स्टेटस भेजे जा सकें.

कॉन्सेप्ट की समीक्षा करें

Google Chat API

Google Chat API की मदद से, डेवलपर प्रोग्राम के ज़रिए Google Chat से इंटरैक्ट कर सकते हैं. इससे वे मैसेज भेज सकते हैं, स्पेस बना सकते हैं, सदस्यों को मैनेज कर सकते हैं, और अन्य काम कर सकते हैं. साथ ही, कस्टम इंटिग्रेशन और बॉट बना सकते हैं.

स्ट्रीमिंग

स्ट्रीमिंग का मतलब है कि पूरे जवाब के जनरेट होने का इंतज़ार करने के बजाय, लगातार डेटा पाना. एआई मॉडल कॉल के मामले में, स्ट्रीमिंग की सुविधा की मदद से ऐप्लिकेशन, उपयोगकर्ताओं को नतीजे का कुछ हिस्सा तुरंत दिखा सकते हैं. इससे, परफ़ॉर्मेंस और उपयोगकर्ता अनुभव बेहतर होता है. खास तौर पर, जनरेट करने से जुड़े लंबे टास्क के लिए यह सुविधा बहुत काम की है. यह खास तौर पर जनरेटिव एआई मॉडल के लिए ज़रूरी है, क्योंकि इन्हें पूरा आउटपुट जनरेट करने में काफ़ी समय लग सकता है.

समीक्षा का तरीका

25f9036eecd9a48b.png

सोर्स कोड की समीक्षा करना

index.js

// Import Google Auth library used to create Google Chat API client
import { GoogleAuth } from 'google-auth-library';
...
http('gen-ai-app', async (req, res) => {
 // Use app authentication.
 // Application Default Credentials (ADC) will use the Cloud Run function's
 // default service account, we just need to specify the Chat API app auth scopes.
 const auth = new GoogleAuth({
   // Chat API app authentication scopes
   scopes: ['https://www.googleapis.com/auth/chat.bot']
 });

 // Create Chat service client with application credentials
 const chatClient = google.chat({
   version: 'v1',
   auth: await auth.getClient()
 });

 // Send a server streaming request to generate the answer
 const aiResponse = await genAI.models.generateContentStream({
   model: env.model,
   contents: `Generate a story about a ${userMessage}. `
               + `It should take 2 minutes to read it out loud.`
 });

 // Send a first Chat message to summarize what will be done
 await chatClient.spaces.messages.create({
   parent: spaceName,
   requestBody: { text: `Sure, let me work on generating a short story `
                           + `about a ${userMessage} like you requested.`}
 });

 // Go through the response chunks received from the stream
 let messageName = undefined;
 let answer = "";
 for await (const chunk of aiResponse) {
   const text = chunk.text;
   if (text) {
     // Update the answer by concatenating the response chunks
     answer += text;
     // The Chat message request body is the same for message creation and update
     const responseBody = {
       text: answer,
       accessoryWidgets: [getStatusAccessoryWidget('Generating story...', 'progress_activity')]
     }
     if (!messageName) {
       // Create a Chat message dedicated to the generated content
       const messageResponse = await chatClient.spaces.messages.create({
         parent: spaceName,
         requestBody: responseBody
       });
       messageName = messageResponse.data.name;
     } else {
       // Update the Chat message dedicated to the generated content
       await chatClient.spaces.messages.patch({
         name: messageName,
         updateMask: 'text,accessory_widgets',
         requestBody: responseBody
       });
     }
   }
 }

 // Update the accessory widget with final progress status
 await chatClient.spaces.messages.patch({
   name: messageName,
   updateMask: 'accessory_widgets',
   requestBody: {
     accessoryWidgets: [getStatusAccessoryWidget('Story is fully generated', 'check')]
   }
 });

 // Send a last Chat message to confirm it's done
 return res.send({ hostAppDataAction: { chatDataAction: { createMessageAction: { message: {
   text: 'All done, I hope you like it!'
 }}}}});
});

// Create an accessory widget with progress status
function getStatusAccessoryWidget(text, icon) {
 return { buttonList: { buttons: [{
   text: text,
   icon: { materialIcon: { name: icon}},
   // This is a workaround to have the icon shown, it's not clickable
   onClick: { openLink: { url: "https://google.com"}},
   disabled: true
 }]}};
}

package.json

...
"dependencies": {
  ...
   "google-auth-library": "^10.3.0"
},
...

Google Cloud Run Node.js फ़ंक्शन को अपडेट करना

  1. अपने लोकल डेवलपमेंट एनवायरमेंट में, मौजूदा डायरेक्ट्री को node/chat/gen-ai-apps/7-stream में बदलें. इसमें पूरा सोर्स कोड और संसाधन शामिल होते हैं.
  2. Google Cloud Run फ़ंक्शन की सेवा के बारे में ज़्यादा जानकारी वाले पेज के सोर्स टैब पर जाएं.

  1. सोर्स में बदलाव करें पर क्लिक करें.
  2. index.js और package.json फ़ाइलों के पूरे कॉन्टेंट को, अपने लोकल डेवलपमेंट एनवायरमेंट में मौजूद कॉन्टेंट से बदलें.
  3. सेव करें और फिर से डिप्लॉय करें पर क्लिक करें.
  4. बदलाव को लागू करने की प्रोसेस पूरी होने तक इंतज़ार करें.

487b64f2d3b1a104.png

इसे आज़माएँ

Google Chat में Chat ऐप्लिकेशन के साथ डायरेक्ट मैसेज स्पेस में, turtle टाइप करें और enter दबाएं. ऐप्लिकेशन को जवाब में, पुष्टि करने वाला मैसेज देना चाहिए. साथ ही, स्टेटस के साथ जनरेट की गई स्टोरी और टास्क पूरा होने की पुष्टि करने वाला मैसेज भी देना चाहिए.

17600cd1490972c7.png

26af4b3d442712a5.png

10. मल्टीमोडल ऐप्लिकेशन

यह ऐप्लिकेशन, उपयोगकर्ताओं के टेक्स्ट वाले निर्देशों के आधार पर इमेज में बदलाव करने के लिए, एक मॉडल का इस्तेमाल करता है. दोनों उपयोगकर्ता और ऐप्लिकेशन, Google Chat में मैसेज अटैचमेंट के तौर पर अपनी इमेज जोड़ते हैं, ताकि उन्हें शेयर किया जा सके. यह ऐप्लिकेशन, प्रोग्राम के ज़रिए इमेज डाउनलोड और अपलोड करने के लिए Google Chat API पर निर्भर करता है.

कॉन्सेप्ट की समीक्षा करें

Google Chat में मैसेज के साथ अटैचमेंट

Google Chat मैसेज में अटैच की गई फ़ाइलें, इमेज या वीडियो जैसी फ़ाइलें होती हैं. इन्हें Google Chat मैसेज में अपलोड किया जाता है. इन अटैचमेंट को प्रोग्राम के हिसाब से मैनेज किया जा सकता है. इससे ऐप्लिकेशन, बातचीत के दौरान सीधे तौर पर रिच मीडिया से इंटरैक्ट कर पाते हैं.

डोमेन-वाइड डेलिगेशन (डीडब्ल्यूडी)

डोमेन-वाइड डेलिगेशन (डीडब्ल्यूडी) की मदद से, सेवा खाता Google Workspace डोमेन में उपयोगकर्ताओं के तौर पर काम कर सकता है. इससे ऐप्लिकेशन, उन उपयोगकर्ताओं की ओर से कार्रवाई कर सकते हैं. इसके लिए, उन्हें सीधे तौर पर अनुमति लेने की ज़रूरत नहीं होती. यह उन ऐप्लिकेशन के लिए फ़ायदेमंद है जिन्हें उपयोगकर्ता के डेटा को ऐक्सेस करने या उपयोगकर्ता के संदर्भ में कार्रवाइयां करने की ज़रूरत होती है. जैसे, Google Chat में अटैचमेंट अपलोड करना. ऐसा तब भी किया जा सकता है, जब उपयोगकर्ता मौजूद न हो. इसके लिए, सेवा खाते को पूरे डोमेन में ऐक्सेस दिया जाता है.

समीक्षा का तरीका

74295b25761f1682.png

सोर्स कोड की समीक्षा करना

env.js

...
// Replace with the Gemini model to use.
model: process.env.MODEL || 'gemini-2.0-flash-preview-image-generation',
...

index.js

...
// Import byte stream management libraries.
import { Buffer } from 'buffer';
import { Readable } from 'stream';
...
// Download a Google Chat attachment as base 64 string.
async function downloadFile(appChatClient, attachmentName) {
 const response = await appChatClient.media.download({
     resourceName: attachmentName,
     alt: 'media'
   }, {
     responseType: 'stream'
 });
 const chunks = [];
 return new Promise((resolve) => {
   response.data.on('data', (chunk) => {
     chunks.push(chunk);
   });
   response.data.on('end', () => {
     const fileBuffer = Buffer.concat(chunks);
     const base64String = fileBuffer.toString('base64');
     resolve(base64String);
   });
 });
}

// Upload a base 64 string as Google Chat attachment of a space.
async function uploadFile(useChatClient, spaceName, data) {
 const filename = 'generated_image.png';
 return await userChatClient.media.upload({
   parent: spaceName,
   requestBody: { filename: filename },
   media: {
     mimeType: 'image/png',
     body: Readable.from(Buffer.from(data, 'base64'))
   }
 });
}
...

...
http('gen-ai-app', async (req, res) => {
 const userEmail = req.body.chat.user.email;
 const spaceName = req.body.chat.messagePayload.space.name;
 const userMessage = req.body.chat.messagePayload.message.text;
 const attachmentName = req.body.chat.messagePayload.message.attachment[0].attachmentDataRef.resourceName;
 const attachmentContentType = req.body.chat.messagePayload.message.attachment[0].contentType;

 // Set up app authentication used to download the attachment input
 // Application Default Credentials (ADC) will use the Cloud Run function's
 // default service account.
 const appAuth = new GoogleAuth({
   // Specify the Chat API app authentication scopes
   scopes: ['https://www.googleapis.com/auth/chat.bot']
 });
 // Create Chat service client with application credentials
 const appChatClient = google.chat({
   version: 'v1',
   auth: await appAuth.getClient()
 });

 // Send a request to generate the answer with both text and image contents
 const aiResponse = await genAI.models.generateContent({
   model: env.model,
   contents: [{
     role: 'USER',
     parts: [
       // The text content of the message
       { text: userMessage },
       // The attachment of the message is downloaded and added inline
       { inlineData: {
         data: await downloadFile(appChatClient, attachmentName),
         mimeType: attachmentContentType
       }}
     ]
   }],
   config: { responseModalities: ['TEXT', 'IMAGE']}
 });

 // Set up user impersonation authentication used to upload the attachment output
 // and send the response.
 const impersonatedUserAuth = new GoogleAuth({
   // Specify the Chat API user authentication scopes
   scopes: ['https://www.googleapis.com/auth/chat.messages'],
   keyFile: './credentials.json',
   clientOptions: {
     // Impersonate the user who sent the original message
     subject: userEmail
   }
 });
 // Create Chat service client with impersonated user credentials
 const userChatClient = google.chat({
   version: 'v1',
   auth: await impersonatedUserAuth.getClient()
 });

 let responseText = undefined;
 let responseAttachment = undefined;
 // Go through the response parts received
 for (const part of aiResponse.candidates[0].content.parts) {
   if (part.inlineData) {
     // The resulting image is retrieved inline and uploaded
     const mediaResponse = await uploadFile(userChatClient, spaceName, part.inlineData.data);
     responseAttachment = mediaResponse.data;
   } else {
     responseText = part.text;
   }
 }

 // Create a Chat message dedicated to the generated content
 await userChatClient.spaces.messages.create({
   parent: spaceName,
   requestBody: {
     text: responseText ? responseText : 'Here it is!',
     // The uploaded image is referenced as attachment
     attachment: responseAttachment ? [responseAttachment] : undefined
   }
 });

 // Send a last Chat message to confirm it's done
 return res.send({ hostAppDataAction: { chatDataAction: { createMessageAction: { message: {
   text: 'Done, feel free to let me know if you need anything else!'
 }}}}});
});
...

सेवा खाता कॉन्फ़िगर करना और निजी कुंजी एक्सपोर्ट करना

  1. Cloud Run के डिफ़ॉल्ट सेवा खाते को, उपयोगकर्ताओं के लिए Google Chat के मैसेज मैनेज करने की अनुमति दें. स्कोप https://www.googleapis.com/auth/chat.messages के साथ निर्देशों का पालन करें. Cloud Run के डिफ़ॉल्ट सेवा खाते का क्लाइंट आईडी वापस पाने के लिए, यह तरीका अपनाएं:
  2. मेन्यू ☰ > आईएएम और एडमिन > सेवा खाते पर क्लिक करें

  1. Compute का डिफ़ॉल्ट सेवा खाता नाम वाले सेवा खाते पर क्लिक करें.
  2. ऐडवांस सेटिंग सेक्शन को बड़ा करें
  3. क्लाइंट आईडी को क्लिपबोर्ड पर कॉपी करें.
  4. Cloud Run के डिफ़ॉल्ट सेवा खाते के लिए, नई निजी पासकोड बनाएं और उसे डाउनलोड करें
  5. मेन्यू ☰ > आईएएम और एडमिन > सेवा खाते पर क्लिक करें

  1. Compute का डिफ़ॉल्ट सेवा खाता नाम वाले सेवा खाते पर क्लिक करें.
  2. कुंजियां टैब चुनें. इसके बाद, कुंजी जोड़ें और फिर नई कुंजी बनाएं पर क्लिक करें.
  3. JSON को चुनें. इसके बाद, बनाएं पर क्लिक करें.
  4. आपकी नई सार्वजनिक/निजी कुंजी की जोड़ी जनरेट करके आपकी मशीन पर नई फ़ाइल के तौर पर डाउनलोड की जाती है. डाउनलोड की गई JSON फ़ाइल को सेव करें और उसके कॉन्टेंट को क्लिपबोर्ड पर कॉपी करें. यह फ़ाइल, इस कुंजी की सिर्फ़ एक कॉपी है. अपनी कुंजी को सुरक्षित तरीके से सेव करने के बारे में जानकारी के लिए, सेवा खाते की कुंजियां मैनेज करना लेख पढ़ें.

Google Cloud Run Node.js फ़ंक्शन को अपडेट करना

  1. अपने लोकल डेवलपमेंट एनवायरमेंट में, मौजूदा डायरेक्ट्री को node/chat/gen-ai-apps/8-multimodal में बदलें. इसमें पूरा सोर्स कोड और संसाधन शामिल होते हैं.
  2. Google Cloud Run फ़ंक्शन की सेवा के बारे में ज़्यादा जानकारी वाले पेज के सोर्स टैब पर जाएं.

  1. सोर्स में बदलाव करें पर क्लिक करें.
  2. ➕ पर क्लिक करें. इसके बाद, credentials.json टाइप करें और ✔️ पर क्लिक करके, संसाधन फ़ाइल बनाएं.
  3. पिछले चरण में डाउनलोड की गई JSON फ़ाइल का कॉन्टेंट, नई बनाई गई credentials.json फ़ाइल में चिपकाएं.
  4. index.js फ़ाइल के पूरे कॉन्टेंट को, अपने लोकल डेवलपमेंट एनवायरमेंट में मौजूद कॉन्टेंट से बदलें.
  5. env.js फ़ाइल खोलें और model की वैल्यू को gemini-2.0-flash-preview-image-generation पर सेट करें.
...
model: 'gemini-2.0-flash-preview-image-generation',
...
  1. सेव करें और फिर से डिप्लॉय करें पर क्लिक करें.
  2. बदलाव को लागू करने की प्रोसेस पूरी होने तक इंतज़ार करें.

487b64f2d3b1a104.png

इसे आज़माएं

Google Chat में, Chat ऐप्लिकेशन के साथ डायरेक्ट मैसेज स्पेस में, अपनी पोर्ट्रेट फ़ोटो PNG फ़ॉर्मैट में अपलोड करें. इसके बाद, Change the background color to blue टाइप करें और enter दबाएं. ऐप्लिकेशन को नीले रंग के बैकग्राउंड वाली तस्वीर के साथ जवाब देना चाहिए. साथ ही, यह पुष्टि करने वाला मैसेज भी देना चाहिए कि तस्वीर पूरी हो गई है.

270547e7a83c1841.png

11. व्यवस्थित करें

Google Cloud प्रोजेक्ट मिटाना

इस कोडलैब में इस्तेमाल किए गए संसाधनों के लिए, अपने Google Cloud खाते से शुल्क लिए जाने से बचने के लिए, हमारा सुझाव है कि आप Google Cloud प्रोजेक्ट को मिटा दें.

Google Cloud Console में जाकर, यह तरीका अपनाएं:

  1. मेन्यू ☰ > आईएएम और एडमिन > सेटिंग पर क्लिक करें.

  1. शट डाउन करें पर क्लिक करें.
  2. प्रोजेक्ट आईडी डालें.
  3. फिर भी बंद करें पर क्लिक करें.

407699a4e03afea6.png

12. बधाई हो

बधाई हो! आपने Google Chat ऐप्लिकेशन को Google Workspace ऐड-ऑन के तौर पर बनाया है. इसमें एआई के बुनियादी सिद्धांतों को इंटिग्रेट किया गया है!

आगे क्या करना है?

हमने इस कोडलैब में, सिर्फ़ कम से कम इस्तेमाल के उदाहरण दिखाए हैं. हालांकि, ऐसे कई क्षेत्र हैं जिनमें विस्तार किया जा सकता है. आपको अपने Google Chat ऐप्लिकेशन में इन क्षेत्रों पर विचार करना चाहिए. जैसे:

  • ऑडियो और वीडियो जैसे अन्य मीडिया टाइप के साथ काम करता हो.
  • कस्टम मॉडल के साथ-साथ, Vertex AI जैसे प्लैटफ़ॉर्म पर होस्ट किए गए अन्य एआई मॉडल के साथ इंटिग्रेट करें.
  • कस्टम जैसे एजेंट के साथ इंटिग्रेट करें. ये एजेंट, Agentspace और Dialogflow CX जैसे प्लैटफ़ॉर्म पर होस्ट किए जाते हैं.
  • परफ़ॉर्मेंस को मॉनिटर करने और उसे बेहतर बनाने के लिए, फ़ीडबैक लूप और क्लासिफ़िकेशन पर भरोसा करें.
  • टीमों, संगठनों या सार्वजनिक उपयोगकर्ताओं को बेहतर तरीके से काम करने में मदद करने के लिए, Marketplace पर पब्लिश करें.

ज़्यादा जानें

डेवलपर के लिए कई संसाधन उपलब्ध हैं. जैसे, YouTube वीडियो, दस्तावेज़ वाली वेबसाइटें, कोड सैंपल, और ट्यूटोरियल: