जनरेटिव एआई के ऐंग्युलर वेब ऐप्लिकेशन को वर्शन कंट्रोल से क्लाउड रन तक, अपने-आप डिप्लॉय करें

1. खास जानकारी

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

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

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

  • Cloud Shell Editor की मदद से वेब ऐप्लिकेशन लिखना
  • अपने ऐप्लिकेशन का कोड GitHub में सेव करना
  • अपने ऐप्लिकेशन को Cloud Run पर अपने-आप डिप्लॉय करना
  • Vertex AI का इस्तेमाल करके, अपने ऐप्लिकेशन में जनरेटिव एआई जोड़ना

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

  1. अगर आपके पास पहले से कोई Google खाता नहीं है, तो आपको Google खाता बनाना होगा.
    • ऑफ़िस या स्कूल वाले खाते के बजाय, निजी खाते का इस्तेमाल करें. ऑफ़िस और स्कूल वाले खातों पर ऐसी पाबंदियां हो सकती हैं जिनकी वजह से, इस लैब के लिए ज़रूरी एपीआई चालू नहीं किए जा सकते.
  2. अगर आपके पास पहले से कोई GitHub खाता नहीं है, तो आपको GitHub खाता बनाना होगा

3. प्रोजेक्ट सेटअप करना

  1. Google Cloud Console में साइन इन करें.
  2. Cloud Console में बिलिंग चालू करें.
    • इस लैब को पूरा करने के लिए, Cloud के संसाधनों पर 1 डॉलर से कम खर्च करना पड़ेगा.
    • आगे कोई शुल्क न देना पड़े, इसके लिए संसाधनों को मिटाएं. इसके लिए, इस लैब के आखिर में दिया गया तरीका अपनाएं.
    • नए उपयोगकर्ताओं को 300 डॉलर का मुफ़्त में आज़माने की सुविधा मिलती है.
    • क्या आपको डेवलपर के लिए Gen AI इवेंट में शामिल होना है? आपको 1 डॉलर का क्रेडिट मिल सकता है.
  3. नया प्रोजेक्ट बनाएं या किसी मौजूदा प्रोजेक्ट का फिर से इस्तेमाल करें.
  4. Cloud Billing में मेरे प्रोजेक्ट में जाकर, पुष्टि करें कि बिलिंग की सुविधा चालू है
    • अगर आपके नए प्रोजेक्ट के Billing account कॉलम में Billing is disabled दिखता है, तो:
      1. Actions कॉलम में मौजूद तीन बिंदुओं पर क्लिक करें
      2. बिलिंग बदलें पर क्लिक करें
      3. वह बिलिंग खाता चुनें जिसका इस्तेमाल करना है
    • अगर आपने डेवलपर के लिए जनरल एआई इवेंट में हिस्सा लिया है, तो खाते का नाम Google Cloud Platform का ट्रायल बिलिंग खाता होगा

4. Cloud Shell एडिटर खोलना

  1. Cloud Shell एडिटर पर जाएं
  2. अगर टर्मिनल स्क्रीन पर सबसे नीचे नहीं दिखता है, तो उसे खोलें:
    • हैमबर्गर मेन्यू हैमबर्गर मेन्यू का आइकॉन पर क्लिक करें
    • Terminal पर क्लिक करें
    • नया टर्मिनल पर क्लिक करेंCloud Shell एडिटर में नया टर्मिनल खोलना
  3. टर्मिनल में, इस कमांड की मदद से अपना प्रोजेक्ट सेट करें:
    • फ़ॉर्मैट:
      gcloud config set project [PROJECT_ID]
      
    • उदाहरण:
      gcloud config set project lab-project-id-example
      
    • अगर आपको अपना प्रोजेक्ट आईडी याद नहीं है, तो:
      • अपने सभी प्रोजेक्ट आईडी की सूची देखने के लिए:
        gcloud projects list | awk '/PROJECT_ID/{print $2}'
        
      Cloud Shell Editor टर्मिनल में प्रोजेक्ट आईडी सेट करना
  4. अगर आपसे अनुमति देने के लिए कहा जाए, तो जारी रखने के लिए अनुमति दें पर क्लिक करें. Cloud Shell को अनुमति देने के लिए क्लिक करें
  5. आपको यह मैसेज दिखेगा:
    Updated property [core/project].
    
    अगर आपको WARNING दिखता है और आपसे Do you want to continue (Y/N)? पूछा जाता है, तो हो सकता है कि आपने प्रोजेक्ट आईडी गलत डाला हो. N दबाएं, Enter दबाएं, और gcloud config set project कमांड को फिर से चलाने की कोशिश करें.

5. एपीआई चालू करें

टर्मिनल में, एपीआई चालू करें:

gcloud services enable \
  run.googleapis.com \
  cloudbuild.googleapis.com \
  aiplatform.googleapis.com

इस निर्देश को पूरा होने में कुछ मिनट लग सकते हैं. हालांकि, आखिर में आपको इस तरह का मैसेज दिखेगा:

Operation "operations/acf.p2-73d90d00-47ee-447a-b600" finished successfully.

6. Git कॉन्फ़िगर करना

  1. अपने ग्लोबल git उपयोगकर्ता का ईमेल सेट करें:
    git config --global user.email "you@example.com"
    
  2. अपना ग्लोबल git उपयोगकर्ता नाम सेट करें:
    git config --global user.name "Your Name"
    
  3. अपनी ग्लोबल git डिफ़ॉल्ट शाखा को main पर सेट करें:
    git config --global init.defaultBranch main
    

7. अपना कोड लिखना

Node.js में ऐप्लिकेशन लिखने के लिए:

  1. होम डायरेक्ट्री पर जाएं:
    cd ~
    
  2. नया codelab-genai Angular ऐप्लिकेशन बनाएं:
    npx @angular/cli new codelab-genai \
        --minimal \
        --inline-template \
        --inline-style \
        --ssr \
        --defaults
    
  3. अगर आपसे @angular/cli इंस्टॉल करने के लिए कहा जाए, तो आगे बढ़ने के लिए Enter दबाएं:
    Need to install the following packages:
    @angular/cli@18.2.4
    Ok to proceed? (y)
    
  4. codelab-genai डायरेक्ट्री पर जाएं:
    cd codelab-genai
    
  5. Cloud Shell Editor में app.component.ts फ़ाइल खोलें:
    cloudshell edit src/app/app.component.ts
    
    अब स्क्रीन के सबसे ऊपर एक खाली फ़ाइल दिखेगी. यहां इस app.component.ts फ़ाइल में बदलाव किया जा सकता है. स्क्रीन के सबसे ऊपर वाले सेक्शन में कोड दिखाएं
  6. नीचे दिया गया कोड कॉपी करके, खोली गई app.component.ts फ़ाइल में चिपकाएं:
    import { Component } from '@angular/core';
    import { RouterOutlet } from '@angular/router';
    
    @Component({
        selector: 'app-root',
        standalone: true,
        imports: [RouterOutlet],
        template: `
            <h1>Hello world!</h1>
    
            <router-outlet />
        `,
        styles: [],
    })
    export class AppComponent { }
    
    कुछ सेकंड बाद, Cloud Shell Editor आपका कोड अपने-आप सेव कर देगा. यह कोड, "नमस्ते दुनिया के लोगों!" वाले वेलकम मैसेज के साथ, http अनुरोधों का जवाब देता है.

आपके ऐप्लिकेशन का शुरुआती कोड तैयार हो गया है और इसे वर्शन कंट्रोल में सेव करने के लिए तैयार है.

8. कोई रिपॉज़िटरी बनाना

  1. स्क्रीन पर सबसे नीचे मौजूद Cloud Shell टर्मिनल पर वापस जाएं.
  2. पक्का करें कि आप अब भी सही डायरेक्ट्री में हों:
    cd ~/codelab-genai
    
  3. Git डेटा स्टोर करने की जगह को शुरू करना
    git init -b main
    
  4. GitHub CLI में लॉग इन करना
    gh auth login
    
    डिफ़ॉल्ट विकल्पों को स्वीकार करने के लिए, Enter दबाएं. इसके बाद, GitHub CLI टूल में दिए गए निर्देशों का पालन करें. इनमें ये निर्देश भी शामिल हैं:
    1. आपको किस खाते में लॉग इन करना है? GitHub.com
    2. इस होस्ट पर Git ऑपरेशन के लिए, आपका पसंदीदा प्रोटोकॉल क्या है? HTTPS
    3. क्या आपको अपने GitHub क्रेडेंशियल की मदद से Git की पुष्टि करनी है? Y (अगर यह विकल्प नहीं दिखता है, तो इसे छोड़ें.)
    4. GitHub CLI की पुष्टि कैसे की जा सकती है? Login with a web browser
    5. एक बार इस्तेमाल होने वाला कोड कॉपी करना
    6. https://github.com/login/device खोलें
    7. एक बार इस्तेमाल होने वाला कोड चिपकाएं
    8. GitHub को अनुमति दें पर क्लिक करें
    9. लॉगिन की प्रक्रिया पूरी करना
  5. पुष्टि करें कि आपने लॉग इन किया है:
    gh api user -q ".login"
    
    अगर आपने लॉग इन कर लिया है, तो आपको GitHub का अपना उपयोगकर्ता नाम दिखेगा.
  6. GITHUB_USERNAME वैरिएबल बनाना
    GITHUB_USERNAME=$(gh api user -q ".login")
    
  7. पुष्टि करें कि आपने एनवायरमेंट वैरिएबल बनाया है:
    echo ${GITHUB_USERNAME}
    
    अगर आपने वैरिएबल बना लिया है, तो आपको GitHub का अपना उपयोगकर्ता नाम दिखेगा.
  8. codelab-genai नाम का खाली GitHub रिपॉज़िटरी बनाएं:
    gh repo create codelab-genai --private
    
    अगर आपको गड़बड़ी का यह मैसेज मिलता है, तो:
    GraphQL: Name already exists on this account (createRepository)
    
    इसका मतलब है कि आपके पास पहले से ही codelab-genai नाम का कोई रिपॉज़िटरी मौजूद है. इस ट्यूटोरियल को जारी रखने के लिए, आपके पास दो विकल्प हैं:
  9. codelab-genai रिपॉज़िटरी को रिमोट origin के तौर पर जोड़ें:
    git remote add origin https://github.com/${GITHUB_USERNAME}/codelab-genai
    

9. अपना कोड शेयर करना

  1. पक्का करें कि आप सही डायरेक्ट्री में हों:
    cd ~/codelab-genai
    
  2. मौजूदा डायरेक्ट्री की सभी फ़ाइलों को इस कमिट में जोड़ें:
    git add .
    
  3. पहला कमिट बनाएं:
    git commit -m "add http server"
    
  4. origin डेटा स्टोर करने की जगह की main शाखा में अपने कमिट को पुश करें:
    git push -u origin main
    

इस निर्देश को चलाकर, GitHub पर अपने ऐप्लिकेशन का कोड देखने के लिए, उससे मिलने वाले यूआरएल पर जाएं:

echo -e "\n\nTo see your code, visit this URL:\n \
    https://github.com/${GITHUB_USERNAME}/codelab-genai/blob/main/src/app/app.component.ts \n\n"

10. अपने-आप डिप्लॉय होने की सुविधा सेट अप करना

  1. Cloud Shell Editor टैब को खुला रखें. हम इस टैब पर बाद में वापस आएंगे.
  2. नए टैब में, Cloud Run पेज पर जाएं
  3. Console में जाकर, सही Google Cloud प्रोजेक्ट चुनें Google Cloud Console प्रोजेक्ट का ड्रॉपडाउन
  4. रिपो कनेक्ट करें पर क्लिक करें
  5. Cloud Build की मदद से सेट अप करें पर क्लिक करें
    1. डेटा स्टोर करने की जगह देने वाली कंपनी के तौर पर GitHub को चुनें
      • अगर आपने ब्राउज़र में अपने GitHub खाते में लॉग इन नहीं किया है, तो अपने क्रेडेंशियल की मदद से लॉग इन करें.
    2. पुष्टि करें पर क्लिक करें. इसके बाद, जारी रखें पर क्लिक करें.
    3. लॉग इन करने के बाद, आपको Cloud Run पेज पर एक मैसेज दिखेगा. इसमें लिखा होगा कि GitHub ऐप्लिकेशन आपकी किसी भी डेटा स्टोर करने की जगह पर इंस्टॉल नहीं है.
    4. Google Cloud Build इंस्टॉल करें बटन पर क्लिक करें.
      • इंस्टॉलेशन सेटअप पेज पर, सिर्फ़ चुनिंदा रिपॉज़िटरी चुनें. इसके बाद, वह codelab-genai रिपॉज़िटरी चुनें जिसे आपने सीएलआई की मदद से बनाया था.
      • इंस्टॉल करें पर क्लिक करें
      • ध्यान दें: अगर आपके पास GitHub पर कई डेटा स्टोर करने की जगहें हैं, तो उन्हें लोड होने में कुछ मिनट लग सकते हैं.
    5. डेटा स्टोर करने की जगह के तौर पर your-user-name/codelab-genai चुनें
      • अगर कोई रिपॉज़िटरी मौजूद नहीं है, तो कनेक्ट किए गए रिपॉज़िटरी मैनेज करें लिंक पर क्लिक करें.
    6. Branch को ^main$ के तौर पर छोड़ें
    7. Google Cloud के बिल्डपैक की मदद से Go, Node.js, Python, Java, .NET Core, Ruby या PHP पर क्लिक करें
      • अन्य फ़ील्ड (Build context directory, Entrypoint, और Function target) में कोई बदलाव न करें.
    8. सेव करें पर क्लिक करें
  6. नीचे की ओर स्क्रोल करके, पुष्टि करना पर जाएं
  7. बिना पुष्टि वाले अनुरोधों की अनुमति दें पर क्लिक करें
  8. बनाएं पर क्लिक करें

बिल्ड पूरा होने के बाद (इसमें कुछ मिनट लगेंगे), यह कमांड चलाएं और चल रहे ऐप्लिकेशन को देखने के लिए, नतीजे में दिखने वाले यूआरएल पर जाएं:

echo -e "\n\nOnce the build finishes, visit your live application:\n \
    "$( \
        gcloud run services list | \
        grep codelab-genai | \
        awk '/URL/{print $2}' | \
        head -1 \
    )" \n\n"

11. अपना कोड बदलना

Cloud Shell एडिटर पर वापस जाना

अगर आपके पास अब भी Cloud Shell Editor खुला है, तो इन चरणों को छोड़ा जा सकता है.

  1. Cloud Shell एडिटर पर जाएं
  2. अगर टर्मिनल स्क्रीन पर सबसे नीचे नहीं दिखता है, तो उसे खोलें:
    • हैमबर्गर मेन्यू हैमबर्गर मेन्यू का आइकॉन पर क्लिक करें
    • Terminal पर क्लिक करें
    • नया टर्मिनल पर क्लिक करेंCloud Shell एडिटर में नया टर्मिनल खोलना
  3. टर्मिनल में, इस कमांड की मदद से अपना प्रोजेक्ट सेट करें:
    • फ़ॉर्मैट:
      gcloud config set project [PROJECT_ID]
      
    • उदाहरण:
      gcloud config set project lab-project-id-example
      
    • अगर आपको अपना प्रोजेक्ट आईडी याद नहीं है, तो:
      • अपने सभी प्रोजेक्ट आईडी की सूची देखने के लिए:
        gcloud projects list | awk '/PROJECT_ID/{print $2}'
        
      Cloud Shell Editor टर्मिनल में प्रोजेक्ट आईडी सेट करना
  4. अगर आपसे अनुमति देने के लिए कहा जाए, तो जारी रखने के लिए अनुमति दें पर क्लिक करें. Cloud Shell को अनुमति देने के लिए क्लिक करें
  5. आपको यह मैसेज दिखेगा:
    Updated property [core/project].
    
    अगर आपको WARNING दिखता है और आपसे Do you want to continue (Y/N)? पूछा जाता है, तो हो सकता है कि आपने प्रोजेक्ट आईडी गलत डाला हो. N दबाएं, Enter दबाएं, और gcloud config set project कमांड को फिर से चलाने की कोशिश करें.

अपने ऐप्लिकेशन में Vertex AI जोड़ना

  1. स्क्रीन पर सबसे नीचे मौजूद Cloud Shell टर्मिनल पर वापस जाएं.
  2. पक्का करें कि आप अब भी सही डायरेक्ट्री में हों:
    cd ~/codelab-genai
    
  3. Node.js Vertex AI SDK इंस्टॉल करें:
    npm install @google-cloud/vertexai
    
  4. Node.js Google Auth SDK इंस्टॉल करें:
    npm install google-auth-library
    
  5. Cloud Shell एडिटर में server.ts को फिर से खोलना
    cloudshell edit server.ts
    
  6. अपनी server.ts फ़ाइल में मौजूद कोड को इस कोड से बदलें:
    // server.ts
    import { APP_BASE_HREF } from '@angular/common';
    import { CommonEngine } from '@angular/ssr';
    import express from 'express';
    import { fileURLToPath } from 'node:url';
    import { dirname, join, resolve } from 'node:path';
    import bootstrap from './src/main.server';
    
    import { VertexAI } from '@google-cloud/vertexai';
    import { GoogleAuth } from 'google-auth-library';
    
    
    // The Express app is exported so that it can be used by serverless Functions.
    export function app(): express.Express {
        const server = express();
        const serverDistFolder = dirname(fileURLToPath(import.meta.url));
        const browserDistFolder = resolve(serverDistFolder, '../browser');
        const indexHtml = join(serverDistFolder, 'index.server.html');
        const commonEngine = new CommonEngine();
    
        const auth = new GoogleAuth();
    
        server.set('view engine', 'html');
        server.set('views', browserDistFolder);
    
        // Example Express Rest API endpoints
        server.get('/api/facts', async (req, res) => {
            const project = await auth.getProjectId();
    
            const vertex = new VertexAI({ project: project });
            const generativeModel = vertex.getGenerativeModel({
                model: 'gemini-1.5-flash',
                generationConfig: { responseMimeType: 'application/json' }
            });
    
            const animal = req.query['animal'] || 'dog';
            const prompt = `Give me 10 fun facts about ${animal}. 
                            Return as json as an array in the format ['fact 1', 'fact 2']
                            Remove backticks and other markdown formatting.`;
    
            const resp = await generativeModel.generateContent(prompt);
            let factArray = '';
    
            if (resp.response.candidates) {
                factArray = JSON.parse(resp.response.candidates[0].content.parts[0].text || '');
            }
            res.send(factArray);
        });
    
        // Serve static files from /browser
        server.get('**', express.static(browserDistFolder, {
            maxAge: '1y',
            index: 'index.html',
        }));
    
        // All regular routes use the Angular engine
        server.get('**', (req, res, next) => {
            const { protocol, originalUrl, baseUrl, headers } = req;
    
            commonEngine
                .render({
                    bootstrap,
                    documentFilePath: indexHtml,
                    url: `${protocol}://${headers.host}${originalUrl}`,
                    publicPath: browserDistFolder,
                    providers: [{ provide: APP_BASE_HREF, useValue: baseUrl }],
                })
                .then((html) => res.send(html))
                .catch((err) => next(err));
        });
    
        return server;
    }
    
    function run(): void {
        const port = process.env['PORT'] || 4000;
    
        // Start up the Node server
        const server = app();
        server.listen(port, () => {
            console.log(`Node Express server listening on http://localhost:${port}`);
        });
    }
    
    run();
    
  7. Cloud Shell एडिटर में app.component.ts खोलना
    cloudshell edit src/app/app.component.ts
    
  8. अपनी app.components.ts फ़ाइल में मौजूद कोड को इस कोड से बदलें:
    // app.component.ts
    import { Component, signal } from '@angular/core';
    import { FormsModule } from '@angular/forms';
    import { RouterOutlet } from '@angular/router';
    
    @Component({
        selector: 'app-root',
        standalone: true,
        imports: [RouterOutlet, FormsModule],
        template: `
            <section>
                <input
                    type="text"
                    placeholder="dog"
                    [(ngModel)]="animal"
                    class="text-black border-2 p-2 m-2 rounded"
                />
                <button
                    (click)="getNewFunFacts()"
                >
                    Get New Fun Facts
                </button>
                <ol>
                    @for(fact of facts(); track fact) {
                        <li>{{fact}}</li>  
                    } @empty {
                        <li>No facts are available</li>
                    }
                </ol>
            </section>
        `,
        styles: '',
    })
    export class AppComponent {
        animal = '';
        facts = signal<string[]>([]);
    
        getNewFunFacts() {
            fetch(`/api/facts?animal=${this.animal}`).then(response => response.json()).then(facts => {
                this.facts.set(facts);
            });
        }
    }
    

12. फिर से डिप्लॉय करना

  1. पक्का करें कि आप अब भी Cloud Shell में सही डायरेक्ट्री में हों:
    cd ~/codelab-genai
    
  2. अपने ऐप्लिकेशन के नए वर्शन को अपनी लोकल git रिपॉज़िटरी में कमिट करने के लिए, ये निर्देश चलाएं:
    git add .
    git commit -m "add latest changes"
    
  3. बदलावों को GitHub पर पुश करें:
    git push
    
  4. बिल्ड पूरा होने के बाद, यह कमांड चलाएं और डिप्लॉय किए गए ऐप्लिकेशन पर जाएं:
    echo -e "\n\nOnce the build finishes, visit your live application:\n \
        "$( \
            gcloud run services list | \
            grep codelab-genai | \
            awk '/URL/{print $2}' | \
            head -1 \
        )" \n\n"
    

बदलावों को देखने से पहले, बिल्ड पूरा होने में कुछ मिनट लग सकते हैं.

सभी बदलावों का इतिहास यहां देखा जा सकता है: https://console.cloud.google.com/run/detail/us-central1/codelab-genai/revisions

13. (ज़रूरी नहीं) Vertex AI के इस्तेमाल का ऑडिट करना

Google Cloud की अन्य सेवाओं की तरह ही, Vertex AI के ऑपरेशन का ऑडिट किया जा सकता है. ऑडिट लॉग की मदद से, "किसने, कहां, और कब क्या किया?" जैसे सवालों के जवाब मिलते हैं. Vertex AI के लिए, एडमिन के ऑडिट लॉग डिफ़ॉल्ट रूप से चालू होते हैं. कॉन्टेंट जनरेट करने के अनुरोधों का ऑडिट करने के लिए, आपको डेटा ऐक्सेस ऑडिट लॉग चालू करने होंगे:

  1. Google Cloud Console में, ऑडिट लॉग पेज पर जाएं:

    अगर इस पेज को खोज बार का इस्तेमाल करके ढूंढना है, तो वह नतीजा चुनें जिसकी सबहेडिंग IAM और एडमिन हो.
  2. पक्का करें कि आपने Cloud Run ऐप्लिकेशन को उसी मौजूदा Google Cloud प्रोजेक्ट में बनाया हो.
  3. डेटा ऐक्सेस ऑडिट लॉग कॉन्फ़िगरेशन टेबल में, सेवा कॉलम से Vertex AI API चुनें.
  4. लॉग टाइप टैब में, डेटा ऐक्सेस ऑडिट लॉग टाइप Admin read और Data read चुनें.
  5. सेव करें पर क्लिक करें.

इसे चालू करने के बाद, आपको ऐप्लिकेशन के हर बार इस्तेमाल होने के लिए ऑडिट लॉग दिखेंगे. ऑडिट लॉग में, अनुरोध करने की जानकारी देखने के लिए यह तरीका अपनाएं:

  1. डिप्लॉय किए गए ऐप्लिकेशन पर वापस जाएं और लॉग को ट्रिगर करने के लिए पेज को रीफ़्रेश करें.
  2. Google Cloud Console में, लॉग एक्सप्लोरर पेज पर जाएं:

  3. क्वेरी विंडो में टाइप करें:
    LOG_ID("cloudaudit.googleapis.com%2Fdata_access")
    protoPayload.serviceName="aiplatform.googleapis.com"
    
  4. क्वेरी चलाएं पर क्लिक करें.

ऑडिट लॉग, Vertex AI API के इस्तेमाल को कैप्चर करते हैं. हालांकि, इनसे आपको वर्कलोड से जुड़ा डेटा देखने की सुविधा नहीं मिलती. जैसे, प्रॉम्प्ट या जवाब की जानकारी.

14. (ज़रूरी नहीं) अपने एआई वर्कलोड को बेहतर तरीके से मॉनिटर करना

ऑडिट लॉग में, वर्कलोड से जुड़ी जानकारी कैप्चर नहीं की जाती. अपने वर्कलोड को बेहतर तरीके से मॉनिटर करने के लिए, आपको इस जानकारी को साफ़ तौर पर लॉग करना होगा. इसके लिए, अपने पसंदीदा लॉगिंग फ़्रेमवर्क का इस्तेमाल किया जा सकता है. नीचे दिए गए चरणों में, नेटिव Node.js लॉगिंग सिस्टम का इस्तेमाल करके, ऐसा करने का तरीका बताया गया है.

  1. Cloud Shell एडिटर में server.ts को फिर से खोलना
    cloudshell edit ~/codelab-genai/server.ts
    
  2. await generativeModel.generateContent(prompt) (लाइन 19) को कॉल करने के बाद, यह लाइन जोड़ें:
    console.log(JSON.stringify({
        severity: 'DEBUG',
        message: 'Content is generated',
        prompt: prompt,
        response: resp.response,
    }));
    
    यह कोड, जनरेट किए गए कॉन्टेंट की जानकारी को stdout में लिखता है. इसके लिए, स्ट्रक्चर्ड लॉगिंग फ़ॉर्मैट का इस्तेमाल किया जाता है. Cloud Run में मौजूद लॉगिंग एजेंट, stdout में प्रिंट किए गए आउटपुट को कैप्चर करता है और इस फ़ॉर्मैट को Cloud Logging में लिखता है.
  3. Cloud Shell को फिर से खोलें और यह पक्का करने के लिए कि आप सही डायरेक्ट्री में हैं, यह कमांड टाइप करें:
    cd ~/codelab-genai
    
  4. बदलावों को कमिट करें:
    git commit -am "observe generated content"
    
  5. बदलाव किए गए वर्शन को फिर से डिप्लॉय करने के लिए, GitHub में बदलावों को पुश करें:
    git push
    

नया वर्शन डिप्लॉय होने के बाद, Vertex AI को किए गए कॉल के बारे में डीबग की जानकारी देखी जा सकती है.

अपने ऐप्लिकेशन के लॉग देखने के लिए, यह तरीका अपनाएं:

  1. Google Cloud Console में, लॉग एक्सप्लोरर पेज पर जाएं:

  2. क्वेरी विंडो में टाइप करें:
    LOG_ID("run.googleapis.com%2Fstdout")
    severity=DEBUG
    
  3. क्वेरी चलाएं पर क्लिक करें.

क्वेरी के नतीजे में, प्रॉम्प्ट और Vertex AI के जवाब के साथ लॉग दिखते हैं. इनमें "सुरक्षा रेटिंग" भी शामिल होती हैं. इनका इस्तेमाल, सुरक्षा के तरीकों की निगरानी के लिए किया जा सकता है

15. (ज़रूरी नहीं) क्लीन अप करना

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

अगर आपको प्रोजेक्ट मिटाना है, तो:

gcloud projects delete $GOOGLE_CLOUD_PROJECT

आपके पास अपनी CloudShell डिस्क से ग़ैर-ज़रूरी संसाधनों को मिटाने का विकल्प भी है. आप:

  1. Codelab प्रोजेक्ट डायरेक्ट्री मिटाएं:
    rm -rf ~/codelab-genai
    
  2. चेतावनी! इस कार्रवाई को पहले जैसा नहीं किया जा सकता! अगर आपको जगह खाली करने के लिए, अपने Cloud Shell पर मौजूद सभी चीज़ें मिटानी हैं, तो अपनी पूरी होम डायरेक्ट्री मिटाएं. ध्यान रखें कि आपको जो भी चीज़ें सेव करनी हैं उन्हें किसी दूसरी जगह सेव कर लें.
    sudo rm -rf $HOME
    

16. बधाई हो

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

अगर आपको यह लैब पसंद आया है, तो इसे किसी दूसरी कोडिंग भाषा या फ़्रेमवर्क में फिर से आज़माएं:

अगर आपको आज इस्तेमाल किए गए प्रॉडक्ट को बेहतर बनाने के लिए, उपयोगकर्ता अनुभव (UX) की रिसर्च स्टडी में शामिल होना है, तो यहां रजिस्टर करें.

यहां कुछ विकल्प दिए गए हैं, जिनसे आपको सीखना जारी रखने में मदद मिलेगी: