1. לפני שמתחילים
מהן אפליקציות מבוססות-AI ל-Google Chat?
אפליקציות של Google Chat עם AI עושות את הפעולות הבאות:
- אתם יכולים לשלב את השירותים והמשאבים שלכם ב-Google Chat, כדי שהמשתמשים יוכלו לקבל מידע ולבצע פעולות בלי לצאת מהשיחה.
- להשתלב עם מודלים של AI גנרטיבי כדי ליצור, לחפש ולערוך נתונים כמו טקסט או תמונות.
- תמיכה בחוויה מבוססת-סוכן על ידי יישום של מושגי AI שיכולים לנהל שיחות, כדי ליצור אינטראקציות מעשיות, טבעיות, מתוחכמות ומועילות יותר.
למה כדאי לשלב אפליקציות ל-Google Chat עם AI?
תרחישי השימוש הנפוצים נכללים בקטגוריות הבאות:
- יצירה ועריכה של תוכן. ליצור טקסט שיווקי, לכתוב פוסטים לרשתות החברתיות, ליצור תמונות שנראות מציאותיות, להלחין מוזיקה או לעזור ביצירת תוכן וידאו.
- חיפוש וניתוח נתונים. אפשר לחלץ תובנות חשובות מבסיס ידע לא מובנה, לסכם טקסטים ארוכים, לסווג תוכן או לתרגם שפות בדיוק ובמהירות משופרים.
- שיחה. לנהל שיחות טבעיות, אינפורמטיביות ויעילות, כמו עם עוזר.
- אוטומציה של משימות. לבצע פעולות בשם המשתמש, כמו יצירת אירוע חדש ביומן, שליחת מסמך או ניהול כרטיס במערכת חיצונית.
היכולת לשלב את האפשרויות האלה ישירות בממשק המוכר של Google Chat היא הזדמנות מצוינת לכל מי שרוצה לשפר את החוויה והפרודוקטיביות של המשתמשים שלו.
דרישות מוקדמות
- ידע בסיסי ב-Google Cloud וב-Node.js.
- ידע בסיסי באפליקציות ל-Google Chat, כולל הודעות, כרטיסים, אימות, ממשקי API ונקודות קצה של HTTP.
מה תפַתחו
ב-codelab הזה תבנו שמונה אפליקציות מינימליסטיות ל-Google Chat שמשלבות מושגי AI בסיסיים כדי להראות איך אפשר ליישם אותם באפליקציות מהעולם האמיתי. כולם בנויים כתוספים ל-Google Workspace ומבוססים על ארכיטקטורת HTTP:
כך זה עובד:
- משתמש שולח הודעה באפליקציית Chat ב-Google Chat, בצ'אט ישיר או במרחב ב-Chat.
- בקשת HTTP נשלחת לשרת האינטרנט שפועל כפונקציית Node.js Google Cloud Run שמכילה את הלוגיקה של אפליקציית Chat.
- אפשר לשלב את הלוגיקה של אפליקציית Chat עם שירותי Google Workspace (כמו יומן Google ו-Google Sheets), עם שירותים אחרים של Google (כמו מפות Google, YouTube ו-Vertex AI) או עם שירותי אינטרנט אחרים (כמו מערכת לניהול פרויקטים או כלי לניהול כרטיסים).
- שרת האינטרנט שולח תגובת HTTP בחזרה לשירות של אפליקציית Chat ב-Chat.
- התשובה מועברת למשתמש.
- אפשר גם שאפליקציית Chat תתקשר עם Chat API כדי לפרסם הודעות באופן אסינכרוני או לבצע פעולות אחרות.
כל אפליקציית Google Chat מכילה פונקציית Node.js Google Cloud Run משלה, עם גרסה משלה של קובצי המקור הבאים, כדי לבצע את הפעולות הנדרשות בשלבים 3 ו-6 שלמעלה:
-
package.json
: קובץ מניפסט מרכזי שמשמש כתוכנית לפרויקט Node.js. הוא משמש להגדרת המטא-נתונים, יחסי התלות והסקריפטים. -
env.js
: סקריפט שמגדיר קבועים שנדרשים להפעלה. צריך לערוך אותו בהתאם לסביבה ולהגדרות. index.js:
הסקריפט הראשי שמטפל בלוגיקה של אירועי האינטראקציה ב-Google Chat. ב-codelab הזה מיושם רק סוג האירוע message, אבל בדרך כלל הוא כולל סוגים אחרים כמו card click, slash command ו-dialog באפליקציות מהחיים האמיתיים.
אפליקציית הנחיות
האפליקציה הזו מסתמכת על מודל Gemini כדי לנהל שיחות עם משתמשים בשפות הטבעיות שלהם באמצעות תשובות תמציתיות ופשוטות.
עיצוב האפליקציה
האפליקציה הזו מבוססת על Prompt app
ומוסיפה תמיכה בתשובות בפורמט טקסט עשיר שתואם לפורמט הטקסט הספציפי של הודעות ב-Google Chat.
אפליקציית Ground
האפליקציה הזו מבוססת על Format app
ומוסיפה תמיכה בכלי חיפוש Google, ומחזירה מקורות בהודעות תשובה עם כרטיסים.
אפליקציית MCP
האפליקציה הזו מבוססת על Format app
ומוסיפה תמיכה בפרוטוקול ההקשר של מודל הסיוע למפתחים (MCP) של Google Workspace.
אפליקציה עם כמה שלבים
האפליקציה הזו מבוססת על Format app
ומוסיפה תמיכה בזיכרון שיחה באמצעות מסד נתונים של Google Cloud Firestore.
אפליקציית כלי בהתאמה אישית
האפליקציה הזו מבוססת על Multi-turn app
, ומוסיפה תמיכה בכלי מותאם אישית להפעלת פונקציות שמפעיל את Google Workspace Calendar API על סמך מידע שהמשתמש מספק.
אפליקציית Stream
האפליקציה הזו מסתמכת על מודל Gemini כדי ליצור סיפורים קצרים על סמך נושאים שסופקו על ידי משתמשים. ה-API של Google Chat משמש לשליחת תוצאות וסטטוסים בהודעות ככל שההתקדמות נמשכת.
אפליקציה מולטימודלית
האפליקציה הזו מסתמכת על מודל Gemini כדי לערוך תמונות על סמך הוראות טקסטואליות מהמשתמשים. ממשקי ה-API של Google Chat משמשים להורדה ולהעלאה של התמונות כקבצים מצורפים להודעות.
מה תלמדו
- המושגים הבסיסיים של AI רלוונטיים לאפליקציות של Google Chat ולאופן השימוש בהם.
- כדי לגשת ל-Vertex AI באמצעות Google Gen AI SDK.
- כדי להשתמש בממשקי API של Google Workspace כדי לפתח תכונות שימושיות ומתקדמות.
- כדי להשתמש ב-Cloud Run כדי ליצור אפליקציות ל-Google Chat שאפשר להרחיב.
מה צריך
- השלמת המדריך המהיר Build an HTTP Google Chat app (בניית אפליקציית HTTP ל-Google Chat) באמצעות Node.js. ה-codelab הזה מבוסס על פרויקט Google Cloud, אפליקציית Google Chat ופונקציית Google Cloud Run שנוצרו.
2. להגדרה
איך מאתחלים משאבים וניגשים אליהם
בקטע הזה נסביר איך לגשת למשאבים הבאים ולהגדיר אותם מדפדפן האינטרנט המועדף.
הגדרת Google Chat API
פותחים את מסוף Google Cloud בכרטיסייה חדשה ומבצעים את השלבים הבאים:
- בוחרים את הפרויקט הרצוי.
- בשדה החיפוש של Google Cloud, מחפשים את Google Chat API, לוחצים על Google Chat API, לוחצים על ניהול ואז על הגדרה.
- מגדירים את שם האפליקציה ואת התיאור לערך
Gen AI App
. - לוחצים על שמירה.
מרחב ב-Google Chat
פותחים את Google Chat בכרטיסייה חדשה ופועלים לפי השלבים הבאים:
- אם עדיין לא עשיתם את זה, פותחים צ'אט ישיר עם אפליקציית Chat.
- כותבים
Hello
ולוחצים עלenter
. אפליקציית Chat אמורה להשיב עם השם ותמונת הדמות שלכם.
שירות פונקציות של Google Cloud Run
פותחים את מסוף Google Cloud בכרטיסייה חדשה ומבצעים את השלבים הבאים:
- בוחרים את הפרויקט הרצוי.
- לוחצים על תפריט ☰ > Cloud Run > Services.
- ברשימת השירותים, לוחצים על addonchatapp ואז פותחים את הכרטיסייה מקור.
הורדת קוד המקור והמשאבים באופן מקומי
- מורידים את מאגר ה-GitHub הזה.
- בסביבת הפיתוח המקומית המועדפת, פותחים את הספרייה
node/chat/gen-ai-apps
.
3. הצגת בקשה למשתמש באפליקציה
האפליקציה הזו מנחה את Gemini ב-Vertex AI לנהל שיחה עם משתמשים בשפה הטבעית שלהם באמצעות תשובות תמציתיות ופשוטות. ההטמעה מתבססת על Google Gen AI SDK ל-Node.js.
מושגים שכדאי להכיר
שפה טבעית
כל שפה שמדוברת או נכתבת על ידי בני אדם לתקשורת יומיומית, בניגוד לשפות מלאכותיות או לשפות שמבוססות על מחשב.
פונקציות Cloud Run
פונקציות Cloud Run מצוינות ליצירת קצה עורפי ללא שרת, לעיבוד נתונים בזמן אמת וליצירת אפליקציות חכמות. אין שרתים שצריך להקצות, לנהל, לתקן או לעדכן. הם מתרחבים אוטומטית, ויש להם זמינות גבוהה ועמידות בפני תקלות.
הנחיות
הנחיה היא טכניקה ליצירת קלט (הנחיות) שמנחה מודל של AI גנרטיבי ליצירת פלט רצוי. בדרך כלל זה כולל ניסוח מדויק של שאלות, מתן הקשר, מתן הוראות או מתן דוגמאות כדי לקבל מהמודל תשובות ספציפיות ורלוונטיות.
Vertex AI
Vertex AI מציע את כל מה שצריך כדי ליצור ולהשתמש ב-AI גנרטיבי, כולל פתרונות AI, חיפוש ושיחה, יותר מ-130 מודלים בסיסיים ופלטפורמת AI מאוחדת.
Gemini
Gemini הוא מודל שפה גדול (LLM) מבית Google עם יכולות מולטימודאליות, שאפשר לגשת אליו דרך Vertex AI. הוא עוזר לאנשים לממש את הפוטנציאל האנושי שלהם, כדי שיוכלו להרחיב את הדמיון, להגביר את הסקרנות ולשפר את הפרודוקטיביות.
Google Gen AI SDK
Google Gen AI SDK מיועד למפתחים שרוצים לבנות אפליקציות שמבוססות על Gemini. הוא מספק ממשק מאוחד שתואם ל- Gemini Developer API ול- Vertex AI. היא כוללת ספריות לקוח ב-Python, ב-Go, ב-Node.js וב-Java.
תהליך הבדיקה
בדיקת קוד המקור
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
- ב-Google Cloud Console, מפעילים את Vertex AI API:
- לוחצים על Menu ☰ > APIs & Services (תפריט > ממשקי API ושירותים) > Enabled APIs & Services (ממשקי API ושירותים מופעלים) ומוודאים ש-Vertex AI API מופיע ברשימה.
עדכון פונקציה של Node.js ב-Google Cloud Run
- בסביבת הפיתוח המקומית, משנים את הספרייה הנוכחית ל-
node/chat/gen-ai-apps/1-prompt
. הוא מכיל את כל קוד המקור והמשאבים. - פותחים את
env.js
בעורך ומגדירים את הערכים הבאים: - projectID: מזהה הפרויקט ב-Google Cloud. אפשר לאחזר אותו מדף הפתיחה של מסוף Google Cloud.
- location: האזור של שירות הפונקציה של Google Cloud Run. אפשר לאחזר אותו מדף הפרטים של שירות פונקציית Google Cloud Run.
- model: המודל שבו רוצים להשתמש. אפשר למצוא את כל המודלים הזמינים במסמכי Vertex AI. מודל ברירת המחדל הוא Flash, לביצוע מהיר וזול.
- עוברים לכרטיסייה מקור בדף הפרטים של שירות פונקציית Google Cloud Run.
- לוחצים על עריכת המקור.
- מגדירים את Function entry point ל-
gen-ai-app
. - לוחצים על ➕, מקלידים
env.js
ולוחצים על ✔️ כדי ליצור את קובץ המקור החסר. - מחליפים את כל התוכן של הקבצים
index.js
,env.js
ו-package.json
בתוכן של הקבצים בסביבת הפיתוח המקומית. - לוחצים על שמירה ופריסה מחדש.
- ממתינים לסיום מוצלח של פריסת הגרסה.
רוצים לנסות?
- במרחב של הצ'אט הישיר עם אפליקציית Chat ב-Google Chat, מקלידים
Hello, how are you?
ולוחצים עלenter
. האפליקציה צריכה לענות בצורה תמציתית בטקסט פשוט, בהתאם להוראות בהנחיה.
- במרחב של הצ'אט הישיר עם אפליקציית Chat ב-Google Chat, מקלידים
Bonjour comment allez-vous?
ולוחצים עלenter
. האפליקציה צריכה לענות בצרפתית בהתאם להנחיות שלנו בהנחיה.
4. אפליקציית הפורמט
האפליקציה הזו מבוססת על Prompt app
ומוסיפה תמיכה בתשובות בטקסט עשיר שתואמות לפורמט של הודעות טקסט ב-Google Chat. ההוראות בהנחיה מתעדכנות עם תיאור מפורט של האפשרויות השונות שבהן המודל יכול להשתמש.
מושגים שכדאי להכיר
הודעות טקסט ב-Google Chat
הודעות טקסט ב-Google Chat תומכות באפשרויות עיצוב שונות, כדי לאפשר שליחת הודעות ברורות יותר ועם יותר הבעה ישירות בממשק של Google Chat. הם מבוססים על כללי עיצוב ספציפיים כדי להדגיש, להטות, למחוק, ליצור היפר-קישורים וכו'.
תהליך הבדיקה
בדיקת קוד המקור
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}`;
...
};
...
עדכון פונקציית Node.js ב-Google Cloud Run
- בסביבת הפיתוח המקומית, משנים את הספרייה הנוכחית ל-
node/chat/gen-ai-apps/2-format
. הוא מכיל את כל קוד המקור והמשאבים. - עוברים לכרטיסייה מקור בדף הפרטים של שירות פונקציית Google Cloud Run.
- לוחצים על עריכת המקור.
- מחליפים את כל התוכן של הקובץ
index.js
בתוכן של הקובץ בסביבת הפיתוח המקומית. - לוחצים על שמירה ופריסה מחדש.
- ממתינים לסיום מוצלח של פריסת הגרסה.
רוצים לנסות?
- במרחב של הצ'אט הישיר עם אפליקציית Chat ב-Google Chat, מקלידים
Showcase all formatting options you have with one paragraph each
ולוחצים עלenter
. האפליקציה צריכה להשיב עם דוגמאות לעיצוב על סמך ההוראות שבהנחיה.
- במרחב של הצ'אט הישיר עם אפליקציית Chat ב-Google Chat, מקלידים
What are Google Chat apps? What's great about them?
ולוחצים עלenter
. האפליקציה צריכה להשיב עם עיצוב כשזה מועיל.
5. אפליקציית Ground
האפליקציה הזו מבוססת על Format app
ומוסיפה תמיכה בביסוס על מקורות והחזרת מקורות. הוא מפעיל את הכלי של חיפוש Google ומצרף כרטיסים עם קישורים לתשובות.
עיון במושגים
הארקה
הארקה היא טכניקה של קישור מודלים למקורות מידע. הוא משמש לעיתים קרובות ביישומים מעשיים כדי לשפר את הדיוק והרלוונטיות של התוכן שנוצר על ידי הפניה לנתונים מהעולם האמיתי, וכך למנוע מהמודל להמציא דברים או ליצור מידע שגוי עובדתית.
כלי חיפוש Google
הכלי של חיפוש Google משפר את ההארקה בכך שהוא מאפשר למודלים לחפש באינטרנט מידע בזמן אמת, וכך לוודא שהתשובות מדויקות ועדכניות.
מסגרת הכרטיסים של Google Workspace
מסגרת הכרטיסים ב-Google Workspace מאפשרת למפתחים ליצור ממשקי משתמש עשירים ואינטראקטיביים. הוא מאפשר ליצור כרטיסים מאורגנים ומושכים מבחינה ויזואלית, שיכולים לכלול טקסט, תמונות, לחצנים ווידג'טים אחרים. הכרטיסים האלה משפרים את חוויית המשתמש כי הם מספקים מידע מובנה ומאפשרים לבצע פעולות מהירות ישירות בתוך השיחה.
בדיקת הזרימה
בדיקת קוד המקור
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
}}}}});
...
עדכון פונקציית Node.js ב-Google Cloud Run
- בסביבת הפיתוח המקומית, משנים את הספרייה הנוכחית ל-
node/chat/gen-ai-apps/3-ground
. הוא מכיל את כל קוד המקור והמשאבים. - עוברים לכרטיסייה מקור בדף הפרטים של שירות פונקציית Google Cloud Run.
- לוחצים על עריכת המקור.
- מחליפים את כל התוכן של הקובץ
index.js
בתוכן של הקובץ בסביבת הפיתוח המקומית. - לוחצים על שמירה ופריסה מחדש.
- ממתינים לסיום מוצלח של פריסת הגרסה.
רוצים לנסות?
במרחב של הצ'אט הישיר עם אפליקציית Chat ב-Google Chat, מקלידים What's the world population?
ולוחצים על enter
. האפליקציה צריכה לענות על השאלה באמצעות כרטיס עם קישורים למקורות.
6. אפליקציית MCP
האפליקציה הזו מבוססת על Format app
ומוסיפה תמיכה בכלים שסופקו על ידי שרת Model Context Protocol (MCP) שמארח מרחוק. הוא מתחבר ל-Google Workspace Developer Assist MCP שמספק כלים לגישה ולחיפוש בתיעוד למפתחים של Google Workspace.
מושגים שכדאי להכיר
Model Context Protocol (MCP)
Model Context Protocol הוא framework קוד פתוח שמשלב מודלים עם שירותים חיצוניים בצורה סטנדרטית. המודלים יכולים לגלות כלים שונים, להבין אותם ולקיים איתם אינטראקציה באופן פרוגרמטי, וכך להרחיב את היכולות שלהם, לבצע פעולות בעולם האמיתי ולגשת למידע עדכני.
MCP TypeScript SDK
TypeScript SDK מיישם את המפרט המלא של MCP, וכך מפשט את יצירת לקוחות MCP שמתחברים לכל שרת MCP. היא גם מאפשרת פיתוח של שרתי MCP שמספקים גישה למשאבים, להנחיות ולכלים.
תהליך הבדיקה
בדיקת קוד המקור
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"
},
...
עדכון פונקציית Node.js ב-Google Cloud Run
- בסביבת הפיתוח המקומית, משנים את הספרייה הנוכחית ל-
node/chat/gen-ai-apps/4-mcp
. הוא מכיל את כל קוד המקור והמשאבים. - עוברים לכרטיסייה מקור בדף הפרטים של שירות פונקציית Google Cloud Run.
- לוחצים על עריכת המקור.
- מחליפים את כל התוכן של הקבצים
index.js
ו-package.json
בתוכן של הקבצים בסביבת הפיתוח המקומית. - לוחצים על שמירה ופריסה מחדש.
- ממתינים לסיום מוצלח של פריסת הגרסה.
רוצים לנסות?
- במרחב של הצ'אט הישיר עם אפליקציית Chat ב-Google Chat, מקלידים
What can you do for me?
ולוחצים עלenter
. באפליקציה צריך להיות תיאור של הפעולות שאפשר לבצע בה (כלי MCP).
- במרחב של הצ'אט הישיר עם אפליקציית Chat ב-Google Chat, מקלידים
I would like to get the latest official documentation for the Google Sheets API append values
ולוחצים עלenter
. האפליקציה צריכה להשיב עם המסמכים הנדרשים (באמצעות כלי MCP).
7. אפליקציה עם שיחה רציפה
האפליקציה הזו מבוססת על Format app
ומוסיפה תמיכה בזיכרון שיחה על ידי מעקב אחר היסטוריית האינטראקציות בצ'אט. הוא מאפשר חוויה טבעית, חכמה ומותאמת אישית יותר. האפליקציה משתמשת במסד הנתונים של Google Cloud Firestore שמשויך לפרויקט Google Cloud של המשתמש לאחסון.
עיון במושגים
שיחה מרובת תפניות
המושג שיחה מרובת-תורות מתייחס ליכולת של מודל לשמור על הקשר ועל רצף השיחה בכמה אינטראקציות ושיחות. זו תכונה חיונית לתמיכה בשיחות מורכבות, בפונקציות מתוחכמות שמבוססות על AI ובחוויית משתמש טבעית.
Google Cloud Firestore
Google Cloud Firestore הוא מסד נתונים גמיש וניתן להרחבה של NoSQL בענן, לפיתוח אפליקציות לנייד, לאינטרנט ולשרתים. הוא מאחסן נתונים במסמכים, מארגן אותם באוספים ומאפשר סנכרון בזמן אמת ותמיכה במצב אופליין.
תהליך הבדיקה
בדיקת קוד המקור
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
- ב-Google Cloud Console, מפעילים את Google Cloud Firestore API:
- לוחצים על Menu ☰ > APIs & Services (תפריט ☰ > ממשקי API ושירותים) > Enabled APIs & Services (ממשקי API ושירותים מופעלים) ומוודאים ש-Cloud Firestore API מופיע ברשימה.
יצירת מסד נתונים ב-Cloud Firestore
- ב-Google Cloud Console, לוחצים על Menu ☰ > Firestore.
- לוחצים על יצירת מסד נתונים של Firestore.
- משאירים את הגדרת ברירת המחדל ולוחצים על יצירת מסד נתונים.
עדכון פונקציית Node.js ב-Google Cloud Run
- בסביבת הפיתוח המקומית, משנים את הספרייה הנוכחית ל-
node/chat/gen-ai-apps/5-multi-turn
. הוא מכיל את כל קוד המקור והמשאבים. - עוברים לכרטיסייה מקור בדף הפרטים של שירות פונקציית Google Cloud Run.
- לוחצים על עריכת המקור.
- מחליפים את כל התוכן של הקבצים
index.js
ו-package.json
בתוכן של הקבצים בסביבת הפיתוח המקומית. - לוחצים על שמירה ופריסה מחדש.
- ממתינים לסיום מוצלח של פריסת הגרסה.
רוצים לנסות?
- במרחב של הצ'אט הישיר עם אפליקציית Chat ב-Google Chat, מקלידים
Can you speak with the English from the 80's for now on?
ולוחצים עלenter
. האפליקציה אמורה להגיב בצורה חיובית.
- במרחב של הצ'אט הישיר עם אפליקציית Chat ב-Google Chat, מקלידים
Define what Google Chat apps are in one sentence
ולוחצים עלenter
. האפליקציה צריכה להמשיך להגיב באנגלית משנות ה-80.
8. אפליקציית כלי מותאמת אישית
האפליקציה הזו מבוססת על Multi-turn app
ומוסיפה תמיכה בכלי מותאם אישית לקריאה לפונקציות, שמסתמך על Google Workspace Calendar API כדי לאחזר את האירוע הבא מיומן ציבורי. המודל מנהל את כל האינטראקציות עם המשתמשים, כולל קבלת קלט ומתן פלט מהכלי. עם זאת, האפליקציה עדיין אחראית להפעלת הקריאות הנדרשות ל-API ולספק את התוצאות למודל לפי בקשה. האפליקציה משתמשת במפתח Google API כי אין צורך בפרטי כניסה של משתמש כדי לאחזר נתונים ציבוריים של לוח שנה.
מושגים שכדאי להכיר
בקשה להפעלת פונקציה
קריאה לפונקציה מאפשרת למודל לזהות מתי אפשר למלא את בקשת המשתמש באמצעות כלי חיצוני או API. לאחר מכן המודל מספק את הפרמטרים שנדרשים כדי להפעיל את הכלי הזה, ומשלב פונקציות חיצוניות בתשובות שלו.
ממשקי API של Google Workspace
Google Workspace APIs מאפשרים למפתחים לשלב את האפליקציות שלהם עם שירותים שונים של Google Workspace. ממשקי ה-API האלה מספקים גישה לתכונות של מוצרים כמו Gmail, Chat, יומן, Drive, Docs, Sheets ועוד, ומאפשרים אוטומציה, סנכרון נתונים ויצירה של תהליכי עבודה בהתאמה אישית.
תהליך הבדיקה
בדיקת קוד המקור
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
- ב-Google Cloud console, מפעילים את Google Calendar API:
- לוחצים על תפריט ☰ > ממשקי API ושירותים > ממשקי API ושירותים מופעלים ומוודאים ש-Google Calendar API מופיע ברשימה.
יצירת מפתח Google API
במסוף Google Cloud, פועלים לפי השלבים הבאים:
- לוחצים על תפריט ☰ > ממשקי API ושירותים > פרטי כניסה.
- לוחצים על + Create credentials (יצירת אמצעי אימות) ואז בוחרים באפשרות API key (מפתח API).
- ממתינים לסיום הפעולה.
- בתיבת הדו-שיח לאישור, מאתרים את שדה הטקסט Your API Key (מפתח ה-API שלך) ולוחצים על Copy to clipboard (העתקה ללוח).
עדכון פונקציית Node.js ב-Google Cloud Run
- בסביבת הפיתוח המקומית, משנים את הספרייה הנוכחית ל-
node/chat/gen-ai-apps/6-custom-tool
. הוא מכיל את כל קוד המקור והמשאבים. - עוברים לכרטיסייה מקור בדף הפרטים של שירות פונקציית Google Cloud Run.
- לוחצים על עריכת המקור.
- מחליפים את כל התוכן של הקבצים
index.js
ו-package.json
בתוכן של הקבצים בסביבת הפיתוח המקומית. - פותחים את הקובץ
env.js
ומבצעים את הפעולות הבאות: - הוספה של googleApiKey לשדות המיוצאים
export const env = {
...
googleApiKey: 'your-google-api-key',
};
- מחליפים את
your-google-api-key
במפתח Google API שהועתק בשלב הקודם. אפשר לאחזר אותו מדף פרטי הכניסה של Google Cloud בלחיצה על הצגת המפתח.
- לוחצים על שמירה ופריסה מחדש.
- ממתינים לסיום מוצלח של פריסת הגרסה.
רוצים לנסות?
- ב-יומן Google, פועלים לפי השלבים הבאים:
- בקטע יומנים אחרים, לוחצים על + ואז על יצירת יומן חדש.
- מגדירים את Name לערך
My Public Calendar
. - לוחצים על יצירת יומן.
- ממתינים לסיום הפעולה.
- בקטע ההגדרות של היומנים שלי, בוחרים את היומן החדש שנוצר היומן הציבורי שלי.
- בקטע הרשאות גישה לאירועים, בוחרים באפשרות שיתוף באופן גלוי לכולם ואז לוחצים על אישור בתיבת הדו-שיח אזהרה.
- בקטע הרשאות גישה לאירועים, בוחרים באפשרות לראות את כל פרטי האירועים מהתפריט הנפתח שליד האפשרות שיתוף באופן גלוי לכולם.
- בקטע שילוב היומן, מעתיקים את הערך של השדה מזהה היומן ללוח.
- לוחצים על החץ שמאלה בפינה הימנית העליונה כדי לצאת מהגדרות.
- לוחצים על היומן כדי ליצור אירוע חדש למחר, מקלידים
Important meeting
, בוחרים באפשרות היומן הציבורי שלי בתפריט הנפתח ולוחצים על שמירה. - במרחב של הצ'אט הישיר עם אפליקציית Chat ב-Google Chat, מקלידים
When is the next meeting?
ולוחצים עלenter
. האפליקציה צריכה לבקש דיוק כי לא ברור לאיזה יומן מתייחסים.
- במרחב הצ'אט הישיר עם אפליקציית Chat ב-Google Chat, מדביקים את מזהה היומן שהעתקתם קודם ללוח הגזירה ומקישים על
enter
. האפליקציה צריכה לענות עם פרטים על האירוע שנוצר קודם.
9. אפליקציית סטרימינג
האפליקציה הזו מסתמכת על מודל Gemini כדי ליצור סיפורים באורך 2 דקות על סמך נושאים שסיפקו משתמשים. תהליך יצירת התשובות המלאות לוקח זמן, ולכן האפליקציה מפעילה את המודל במצב סטרימינג ומסתמכת על Google Chat API כדי לשלוח את התוכן והסטטוס בהודעות ככל שהתהליך מתקדם.
מושגים שכדאי להכיר
Google Chat API
Google Chat API מאפשר למפתחים ליצור אינטראקציה עם Google Chat באופן פרוגרמטי, כדי לשלוח הודעות, ליצור מרחבים, לנהל משתתפים ועוד, וכך לבנות שילובים ובוטים בהתאמה אישית.
סטרימינג
סטרימינג הוא תהליך של קבלת נתונים בזרימה רציפה, במקום להמתין ליצירת התשובה המלאה. בנוגע לקריאות למודלים של AI, סטרימינג מאפשר לאפליקציות להציג למשתמשים תוצאות חלקיות ברגע שהן זמינות, וכך לשפר את הביצועים ואת חוויית המשתמש, במיוחד במשימות ארוכות של יצירת תוכן. זה רלוונטי במיוחד למודלים של AI גנרטיבי, שעשויים לקחת הרבה זמן כדי ליצור פלט מלא.
תהליך הבדיקה
בדיקת קוד המקור
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"
},
...
עדכון פונקציית Node.js ב-Google Cloud Run
- בסביבת הפיתוח המקומית, משנים את הספרייה הנוכחית ל-
node/chat/gen-ai-apps/7-stream
. הוא מכיל את כל קוד המקור והמשאבים. - עוברים לכרטיסייה מקור בדף הפרטים של שירות פונקציית Google Cloud Run.
- לוחצים על עריכת המקור.
- מחליפים את כל התוכן של הקבצים
index.js
ו-package.json
בתוכן של הקבצים בסביבת הפיתוח המקומית. - לוחצים על שמירה ופריסה מחדש.
- ממתינים לסיום מוצלח של פריסת הגרסה.
רוצים לנסות?
במרחב של הצ'אט הישיר עם אפליקציית Chat ב-Google Chat, מקלידים turtle
ולוחצים על enter
. האפליקציה צריכה להשיב בהודעת אישור, בסיפור שנוצר עם סטטוס התקדמות, ובהודעת אישור השלמה.
10. אפליקציה מולטי-מודאלית
האפליקציה הזו מסתמכת על מודל לעריכת תמונות על סמך הוראות טקסטואליות מהמשתמשים. המשתמשים והאפליקציה מוסיפים את התמונות שלהם כקבצים מצורפים להודעות ב-Google Chat כדי להחליף אותן. האפליקציה מסתמכת על ממשקי Google Chat API כדי להוריד ולהעלות תמונות באופן פרוגרמטי.
מושגים שכדאי להכיר
קובץ מצורף בהודעה ב-Google Chat
קבצים מצורפים בהודעות ב-Google Chat הם קבצים, כמו תמונות או סרטונים, שמועלים להודעה ב-Google Chat. אפשר לנהל את הקבצים המצורפים האלה באופן פרוגרמטי, כך שאפליקציות יכולות ליצור אינטראקציה עם מדיה עשירה ישירות בשיחות.
הענקת הרשאות ברמת הדומיין (DWD)
הענקת הרשאות גישה ברמת הדומיין (DWD) מאפשרת לחשבון שירות להתחזות למשתמשים בדומיין Google Workspace, וכך לאפשר לאפליקציות לבצע פעולות בשם המשתמשים האלה ללא הרשאה ישירה. האפשרות הזו שימושית לאפליקציות שצריכות לגשת לנתוני משתמשים או לבצע פעולות (כמו העלאת קבצים מצורפים ל-Google Chat) בהקשר של המשתמש, גם כשהמשתמש לא נמצא באופן פעיל, על ידי הענקת גישה רחבה לחשבון השירות בכל הדומיין.
תהליך הבדיקה
בדיקת קוד המקור
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!'
}}}}});
});
...
הגדרת חשבון שירות וייצוא מפתח פרטי
- הענקת הרשאה לחשבון השירות שמוגדר כברירת מחדל ב-Cloud Run לניהול הודעות ב-Google Chat בשם המשתמשים. פועלים לפי ההוראות עם ההיקף https://www.googleapis.com/auth/chat.messages. כדי לאחזר את מזהה הלקוח של חשבון השירות שמוגדר כברירת מחדל ב-Cloud Run:
- לוחצים על תפריט ☰ > IAM & Admin > Service Accounts
- לוחצים על חשבון השירות עם השם Default compute service account (חשבון שירות ברירת מחדל של Compute).
- מרחיבים את הקטע הגדרות מתקדמות.
- מעתיקים את מזהה הלקוח ללוח.
- יצירה והורדה של מפתח פרטי חדש לחשבון השירות שמוגדר כברירת מחדל ב-Cloud Run
- לוחצים על תפריט ☰ > IAM & Admin > Service Accounts
- לוחצים על חשבון השירות עם השם Default compute service account (חשבון שירות ברירת מחדל של Compute).
- בוחרים בכרטיסייה Keys, לוחצים על Add key ואז על Create new key.
- בוחרים באפשרות JSON ולוחצים על Create.
- זוג המפתחות הציבורי/הפרטי החדש נוצר ומורד למחשב שלכם כקובץ חדש. שומרים את קובץ ה-JSON שהורדתם ומעתיקים את התוכן שלו ללוח. הקובץ הזה הוא העותק היחיד של המפתח. מידע על אחסון מאובטח של המפתח זמין במאמר ניהול מפתחות לחשבונות שירות.
עדכון פונקציית Node.js ב-Google Cloud Run
- בסביבת הפיתוח המקומית, משנים את הספרייה הנוכחית ל-
node/chat/gen-ai-apps/8-multimodal
. הוא מכיל את כל קוד המקור והמשאבים. - עוברים לכרטיסייה מקור בדף הפרטים של שירות פונקציית Google Cloud Run.
- לוחצים על עריכת המקור.
- לוחצים על ➕, מקלידים
credentials.json
ולוחצים על ✔️ כדי ליצור את קובץ המשאבים החסר. - מדביקים את התוכן של קובץ ה-JSON שהורד בשלב הקודם בקובץ
credentials.json
החדש שנוצר. - מחליפים את כל התוכן של הקובץ
index.js
בתוכן של הקובץ בסביבת הפיתוח המקומית. - פותחים את הקובץ
env.js
ומגדירים את הערך של model ל-gemini-2.0-flash-preview-image-generation
.
...
model: 'gemini-2.0-flash-preview-image-generation',
...
- לוחצים על שמירה ופריסה מחדש.
- ממתינים לסיום מוצלח של פריסת הגרסה.
רוצה לנסות?
במרחב של הצ'אט הישיר עם האפליקציה ל-Chat ב-Google Chat, מעלים תמונה שלכם בפורמט PNG, מקלידים Change the background color to blue
ולוחצים על enter
. האפליקציה צריכה להשיב עם גרסה של התמונה עם רקע כחול והודעת אישור על השלמת הפעולה.
11. הסרת המשאבים
מחיקת פרויקט ב-Google Cloud
כדי להימנע מחיובים בחשבון Google Cloud על המשאבים שבהם השתמשתם ב-codelab הזה, מומלץ למחוק את הפרויקט ב-Google Cloud.
במסוף Google Cloud, פועלים לפי השלבים הבאים:
- לוחצים על תפריט ☰ > IAM ואדמין > הגדרות.
- לוחצים על כיבוי.
- מזינים את מזהה הפרויקט.
- לוחצים על Shut down anyway (כיבוי בכל זאת).
12. מזל טוב
מעולה! יצרתם אפליקציות ל-Google Chat כתוספים ל-Google Workspace שמשלבים מושגי AI בסיסיים.
מה השלב הבא?
ב-codelab הזה אנחנו מציגים רק מקרי שימוש מינימליסטיים, אבל יש הרבה תחומים להרחבה שכדאי לשקול באפליקציות שלכם ל-Google Chat, כמו:
- תמיכה בסוגים אחרים של מדיה, כמו אודיו ווידאו.
- אינטגרציה עם מודלים אחרים של AI, כולל מודלים בהתאמה אישית, שמתארחים בפלטפורמות ייעודיות כמו Vertex AI.
- שילוב עם סוכנים, כולל סוכנים בהתאמה אישית, שמתארחים בפלטפורמות ייעודיות כמו Agentspace ו-Dialogflow CX.
- להסתמך על לולאות משוב וסיווגים כדי לעקוב אחרי הביצועים ולשפר אותם.
- פרסום ב-Marketplace כדי לאפשר לצוותים, לארגונים או למשתמשים ציבוריים להשתמש באפליקציה.
מידע נוסף
יש הרבה מקורות מידע למפתחים, כמו סרטונים ב-YouTube, אתרי תיעוד, דוגמאות קוד ומדריכים: