Google Chat ऐप्लिकेशन डीबग करना

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

इस पेज पर बताया गया है कि किसी एचटीटीपी Chat ऐप्लिकेशन को डीबग कैसे करें ngrok, एक यूनिफ़ाइड इन्ग्रेस डेटा ट्रैफ़िक प्लैटफ़ॉर्म है. इसका इस्तेमाल करके, स्थानीय पकवान की जांच की जा सकती है डेवलपमेंट एनवायरमेंट की ज़रूरत होती है. इस गाइड में, आपको किसी लोकल यूआरएल और रिमोट एनवायरमेंट की समस्याओं को हल करता है.

लोकल डेवलपमेंट एनवायरमेंट से डीबग करें

इस सेक्शन में, आपने अपने उस Chat ऐप्लिकेशन के साथ इंटरैक्ट किया है आपके लोकल एनवायरमेंट में काम करता है.

लोकल डेवलपमेंट से डीबग करें
वातावरण

पहला डायग्राम. किसी लोकल डेवलपमेंट एनवायरमेंट में डीबग करें.

वर्कशॉप

Node.js

Python

Java

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

Node.js

  • node और npm के सबसे नए वर्शन इंस्टॉल किया गया आपके स्थानीय वातावरण में मौजूद है.
  • nodemon का सबसे नया वर्शन आपके लोकल डिवाइस पर इंस्टॉल किया गया नहीं है, तो इसका इस्तेमाल अपने-आप फिर से लोड करने के मकसद से किया जाता है:

    npm install -g nodemon
  • एचटीटीपी Chat ऐप्लिकेशन, जिसे को बढ़ावा देते हैं. सेक्शन को फ़ॉलो किया जा सकता है ज़रूरी शर्तें, सेट अप करें एनवायरमेंट, और इस ऐप्लिकेशन को Google पर पब्लिश करें चैट क्विकस्टार्ट गाइड. सिर्फ़ अंतर है और आपको ऐप्लिकेशन का नाम Debug App पर सेट करना होगा और ऐप्लिकेशन यूआरएल को http://example.com जैसी किसी भी चीज़ से लिंक कर सकता है.

  • आपके लोकल एनवायरमेंट में एक IDE सेट अप किया गया है, जो डीबग कर सकता है. हम Visual Studio Code IDE और इसकी डिफ़ॉल्ट सेटिंग इसमें डीबग करने की सुविधाएं इस गाइड को समझाने के मकसद से बनाया गया है.

  • Git अभी तक किसी भी व्यक्ति ने चेक इन नहीं किया है इंस्टॉल किया गया आपके स्थानीय वातावरण में मौजूद है.

  • एक ngrok खाता.

Python

  • python3 का सबसे नया वर्शन इंस्टॉल किया गया आपके स्थानीय वातावरण में मौजूद है.
  • pip का सबसे नया वर्शन और आपके इसमें virtualenv इंस्टॉल किया गया लोकल एनवायरमेंट के लिए इस्तेमाल किया जाता है. इनका इस्तेमाल Python पैकेज और वर्चुअल पर्यावरण को ध्यान में रखते हुए काम करता है.
  • एचटीटीपी Chat ऐप्लिकेशन, जिसे को बढ़ावा देते हैं. सेक्शन को फ़ॉलो किया जा सकता है ज़रूरी शर्तें, सेट अप करें एनवायरमेंट, और इस ऐप्लिकेशन को Google पर पब्लिश करें चैट क्विकस्टार्ट गाइड. सिर्फ़ अंतर है और आपको ऐप्लिकेशन का नाम Debug App पर सेट करना होगा और ऐप्लिकेशन यूआरएल को http://example.com जैसी किसी भी चीज़ से लिंक कर सकता है.
  • आपके लोकल एनवायरमेंट में एक IDE सेट अप किया गया है, जो डीबग कर सकता है. हम Visual Studio Code IDE और इसकी डिफ़ॉल्ट सेटिंग इसमें डीबग करने की सुविधाएं इस गाइड को समझाने के मकसद से बनाया गया है.
  • Git अभी तक किसी भी व्यक्ति ने चेक इन नहीं किया है इंस्टॉल किया गया आपके स्थानीय वातावरण में मौजूद है.
  • एक ngrok खाता.
  • gcloud का सबसे नया वर्शन इंस्टॉल किया गया और आपके स्थानीय वातावरण में मौजूद हैं.

Java

  • Java SE 11's JDK का नया और स्टेबल वर्शन आपके लोकल डिवाइस से इंस्टॉल किया गया पर्यावरण को ध्यान में रखते हुए काम करना.
  • Apache Maven का सबसे नया वर्शन आपके लोकल एनवायरमेंट में इंस्टॉल हो सकता है, इसका इस्तेमाल Java प्रोजेक्ट को मैनेज करने के लिए किया जाता है.
  • एचटीटीपी Chat ऐप्लिकेशन, जिसे को बढ़ावा देते हैं. सेक्शन को फ़ॉलो किया जा सकता है ज़रूरी शर्तें, सेट अप करें एनवायरमेंट, और इस ऐप्लिकेशन को Google पर पब्लिश करें चैट क्विकस्टार्ट गाइड. सिर्फ़ अंतर है और आपको ऐप्लिकेशन का नाम Debug App पर सेट करना होगा और ऐप्लिकेशन यूआरएल को http://example.com जैसी किसी भी चीज़ से लिंक कर सकता है.
  • आपके लोकल एनवायरमेंट में एक IDE सेट अप किया गया है, जो डीबग कर सकता है. हम Visual Studio Code IDE और इसकी डिफ़ॉल्ट सेटिंग इसमें डीबग करने की सुविधाएं इस गाइड को समझाने के मकसद से बनाया गया है.
  • Git अभी तक किसी भी व्यक्ति ने चेक इन नहीं किया है इंस्टॉल किया गया आपके स्थानीय वातावरण में मौजूद है.
  • एक ngrok खाता.
  • gcloud का सबसे नया वर्शन इंस्टॉल किया गया और आपके स्थानीय वातावरण में मौजूद हैं.

Localhost सेवा को सार्वजनिक रूप से उपलब्ध कराएं

आपको अपने लोकल एनवायरमेंट को इंटरनेट से कनेक्ट करना होगा, ताकि Chat ऐप्लिकेशन इसे ऐक्सेस कर सकता है. ngrok ऐप्लिकेशन का इस्तेमाल किया जा रहा है का इस्तेमाल करें.

  1. अपने लोकल एनवायरमेंट के ब्राउज़र में, अपने ngrok खाते में साइन इन करें.
  2. ऐप्लिकेशन इंस्टॉल करें और authtoken को अपने डिवाइस पर सेट अप करें वातावरण.
  3. अपने डोमेन में एक स्थिर डोमेनबनाएं ngrok खाता, यह NGROK_STATIC_DOMAIN के तौर पर बताया गया है इस गाइड के निर्देशों का पालन करें.

Chat ऐप्लिकेशन को कॉन्फ़िगर करें

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

  1. Google Cloud Console में, Google Chat API पेज खोलें:

    Google Chat API पेज पर जाएं

  2. कॉन्फ़िगरेशन टैब पर क्लिक करें.

  3. इंटरैक्टिव सुविधाएं पर जाएं > कनेक्शन सेटिंग और वैल्यू सेट करें ऐप्लिकेशन यूआरएल की टेक्स्ट फ़ील्ड को इसमें शामिल करें:

    https://NGROK_STATIC_DOMAIN
    

    इसमें NGROK_STATIC_DOMAIN को स्टैटिक डोमेन से बदलें आपका ngrok खाता.

  4. सेव करें पर क्लिक करें.

Chat ऐप्लिकेशन अपने सभी एचटीटीपी अनुरोध
स्टैटिक डोमेन

दूसरा डायग्राम. Chat ऐप्लिकेशन अपने सभी एचटीटीपी अनुरोध भेजता है को स्टैटिक डोमेन में ले जाएं. सार्वजनिक सेवा, ngrok चैट ऐप्लिकेशन और लागू किया जाने वाला ऐप्लिकेशन कोड स्थानीय रूप से.

Chat ऐप्लिकेशन को टेस्ट करें

आपके पास स्थानीय तौर पर डिप्लॉय, कॉन्फ़िगर, टेस्ट करने, डीबग करने, और अपने-आप फिर से लोड करने का विकल्प होता है चैट ऐप्लिकेशन.

Node.js

  1. GitHub से googleworkspace/google-chat-samples रिपॉज़िटरी का क्लोन बनाएं में शामिल किया जाता है, तो इसमें ऐप्लिकेशन का कोड शामिल होता है, जो execute:

    git clone https://github.com/googleworkspace/google-chat-samples.git
  2. आपके लोकल एनवायरमेंट में इंस्टॉल किए गए Visual Studio Code IDE से, ये काम करें:

    1. नई विंडो में, फ़ोल्डर खोलें google-chat-samples/node/basic-app.
    2. दो package.json फ़ाइल में मौजूद स्क्रिप्ट:

      {
          ...
          "scripts": {
              ...
              "debug": "node --inspect index.js",
              "debug-watch": "nodemon --watch ./ --exec npm run debug"
          }
          ...
      }
      
    3. रूट डायरेक्ट्री से, ऐप्लिकेशन इंस्टॉल करें:

      npm install
    4. Debug Watch नाम का एक ऐसा लॉन्च बनाएं और उसे कॉन्फ़िगर करें जो ट्रिगर .vscode/launch.json फ़ाइल बनाकर, debug-watch में स्क्रिप्ट बनाएं रूट डायरेक्ट्री:

      {
          "version": "0.2.0",
          "configurations": [{
              "type": "node",
              "request": "launch",
              "name": "Debug Watch",
              "cwd": "${workspaceRoot}",
              "runtimeExecutable": "npm",
              "runtimeArgs": ["run-script", "debug-watch"]
          }]
      }
      
    5. ऐसा ब्रेकपॉइंट जोड़ें जो index.js फ़ाइल डाउनलोड करें और दौड़ना शुरू करें और डीबग करना Debug Watch कॉन्फ़िगरेशन पहले जोड़ा गया. ऐप्लिकेशन अब 9000 पोर्ट पर एचटीटीपी अनुरोधों को सुन और सुन रहा है.

      ऐप्लिकेशन, इस पर चल रहे एचटीटीपी अनुरोधों को सुन रहा है और
पोर्ट `9000`

      तीसरी इमेज. ऐप्लिकेशन चल रहा है और एचटीटीपी को सुन रहा है 9000 पोर्ट पर अनुरोध.

  3. अपने लोकल एनवायरमेंट में ngrok ऐप्लिकेशन लॉन्च करें:

    ngrok http --domain=NGROK_STATIC_DOMAIN 9000

    इसमें NGROK_STATIC_DOMAIN को स्टैटिक डोमेन से बदलें आपका ngrok खाता. सभी अनुरोध अब आपके स्थानीय एनवायरमेंट और ऐप्लिकेशन के इस्तेमाल किए गए पोर्ट की जानकारी शामिल होती है.

    टर्मिनल, जिसमें `ngrok` सर्वर चल रहा है और
रीडायरेक्ट किया जा रहा है

    चौथी इमेज. टर्मिनल, जिसमें ngrok सर्वर चल रहा है और रीडायरेक्ट किया जा रहा है.

  4. ngrok ने आपके लोकल होस्ट पर वेब इंटरफ़ेस भी शुरू किया है ऐप्लिकेशन है, तो आप उसे किसी ब्राउज़र में खोलकर सभी गतिविधियों की निगरानी कर सकते हैं.

    `ngrok` ऐप्लिकेशन से होस्ट किया गया वेब इंटरफ़ेस जिसमें कोई एचटीटीपी नहीं दिख रहा है
अनुरोध

    पांचवी इमेज. ngrok ऐप्लिकेशन के ज़रिए होस्ट किया गया वेब इंटरफ़ेस कोई एचटीटीपी अनुरोध नहीं दिखा रहा.

  5. अपने Chat ऐप्लिकेशन को टेस्ट करें. इसके लिए, उसे सीधे संदेश:

    • Google Chat खोलें.

      Google Chat पर जाएं

    • नई चैट पर क्लिक करें.

    • डायलॉग बॉक्स में, अपने चैट ऐप्लिकेशन.

    • खोज के नतीजों में, Chat ऐप्लिकेशन खोजें. जोड़ें पर क्लिक करें > चैट.

    • डायरेक्ट मैसेज वाले स्पेस में, Hello टाइप करें और enter दबाएं. आपका Chat ऐप्लिकेशन जवाब नहीं दे रहा, क्योंकि सक्रिय रूप से डीबग किया गया.

  6. आपके लोकल एनवायरमेंट के Visual Studio Code में, यह जानकारी देखी जा सकती है सेट किए गए ब्रेकपॉइंट पर एक्ज़ीक्यूशन को रोका जाता है.

    निष्पादन को उस ब्रेकपॉइंट पर रोका गया, जो था
सेट

    छठी इमेज. सेट किए गए ब्रेकपॉइंट पर एक्ज़ीक्यूशन को रोका जाता है.

  7. Visual Studio Code के डीबगर से एक्ज़ीक्यूशन को फिर से शुरू करने पर इससे पहले कि Google Chat का Chat ऐप्लिकेशन का समय खत्म हो जाए जवाब Your message : Hello.

  8. वेब इंटरफ़ेस से एचटीटीपी अनुरोध और रिस्पॉन्स लॉग की जांच की जा सकती है आपके स्थानीय वातावरण में ngrok ऐप्लिकेशन के ज़रिए होस्ट किया गया.

    `ngrok` के ज़रिए होस्ट किए गए वेब इंटरफ़ेस से एचटीटीपी अनुरोध
ऐप्लिकेशन

    सातवीं इमेज. उस वेब इंटरफ़ेस से एचटीटीपी अनुरोध जिसे होस्ट किया गया है ngrok ऐप्लिकेशन.

  9. ऐप्लिकेशन के व्यवहार को बदलने के लिए, Your message को इससे बदलें index.json की Here was your message इनलाइन 35. जब आप सेव करें तो nodemon अपडेट किया गया सोर्स कोड और Visual Studio Code डीबग मोड में ही रहता है.

    ऐप्लिकेशन चल रहा है और पोर्ट पर एचटीटीपी अनुरोधों को सुन रहा है
कोड बदलने के साथ `9000`
लोड हो गया

    आठवीं इमेज. ऐप्लिकेशन चल रहा है और एचटीटीपी अनुरोधों को सुन रहा है पोर्ट 9000 पर कोड में बदलाव लोड होने के साथ.

  10. इस बार, Hello स्पेस में दूसरा मैसेज भेजने के बजाय, आपको होस्ट किए गए वेब इंटरफ़ेस पर लॉग किए गए आखिरी एचटीटीपी अनुरोध को चुन सकता है अपने स्थानीय वातावरण में ngrok ऐप्लिकेशन इंस्टॉल करें और Replay पर क्लिक करें. आपने पिछली बार की तरह Chat ऐप्लिकेशन का जवाब नहीं दिया क्योंकि इसे सक्रिय रूप से डीबग किया जा रहा है.

  11. Visual Studio Code के डीबगर से एक्ज़ीक्यूशन को फिर से शुरू करने पर आप इसमें ngrok ऐप्लिकेशन के ज़रिए होस्ट किए गए वेब इंटरफ़ेस से देख सकते हैं आपके लोकल एनवायरमेंट की ऐसी जानकारी जिसमें ऐप्लिकेशन रिस्पॉन्स जनरेट करता है Here was your message : Hello मैसेज का अपडेट किया गया वर्शन.

Python

  1. ऐप्लिकेशन डिफ़ॉल्ट ऐप्लिकेशन के लिए इस्तेमाल करने के लिए, नए उपयोगकर्ता क्रेडेंशियल पाएं क्रेडेंशियल:

    gcloud config set project PROJECT_ID
    gcloud auth application-default login

    PROJECT_ID को प्रोजेक्ट आईडी ऐप्लिकेशन के क्लाउड प्रोजेक्ट के लिए.

  2. GitHub से googleworkspace/google-chat-samples रिपॉज़िटरी का क्लोन बनाएं तो उसमें ऐप्लिकेशन कोड शामिल होता है:

    git clone https://github.com/googleworkspace/google-chat-samples.git
  3. आपके लोकल एनवायरमेंट में इंस्टॉल किए गए Visual Studio Code IDE से, ये काम करें:

    1. नई विंडो में, फ़ोल्डर खोलें google-chat-samples/python/avatar-app.
    2. Python env के लिए नया वर्चुअल एनवायरमेंट बनाएं और उसे चालू करें:

      virtualenv env
      source env/bin/activate
    3. pip का इस्तेमाल करके वर्चुअल में सभी प्रोजेक्ट डिपेंडेंसी इंस्टॉल करें वातावरण:

      pip install -r requirements.txt
    4. रूट डायरेक्ट्री में .vscode/launch.json फ़ाइल बनाएं और Debug Watch नाम के ऐसे लॉन्च को कॉन्फ़िगर करें जो ऐप्लिकेशन को ट्रिगर करता हो डीबग मोड में, पोर्ट 9000 पर मॉड्यूल functions-framework से वर्चुअल एनवायरमेंट env के हिसाब से:

      {
          "version": "0.2.0",
          "configurations": [{
              "type": "python",
              "request": "launch",
              "name": "Debug Watch",
              "python": "${workspaceFolder}/env/bin/python3",
              "module": "functions_framework",
              "args": [
                  "--target", "avatar_app",
                  "--port", "9000",
                  "--debug"
              ]
          }]
      }
      
    5. ऐसा ब्रेकपॉइंट जोड़ें जो main.py फ़ाइल डाउनलोड करें और दौड़ना शुरू करें और डीबग करना Debug Watch कॉन्फ़िगरेशन पहले जोड़ा गया. ऐप्लिकेशन अब 9000 पोर्ट पर एचटीटीपी अनुरोधों को सुन और सुन रहा है.

      ऐप्लिकेशन, इस पर चल रहे एचटीटीपी अनुरोधों को सुन रहा है और
पोर्ट `9000`

      तीसरी इमेज. ऐप्लिकेशन चल रहा है और एचटीटीपी को सुन रहा है 9000 पोर्ट पर अनुरोध.

  4. अपने लोकल एनवायरमेंट में ngrok ऐप्लिकेशन लॉन्च करें:

    ngrok http --domain=NGROK_STATIC_DOMAIN 9000

    इसमें NGROK_STATIC_DOMAIN को स्टैटिक डोमेन से बदलें आपका ngrok खाता. सभी अनुरोध अब आपके स्थानीय एनवायरमेंट और ऐप्लिकेशन के इस्तेमाल किए गए पोर्ट की जानकारी शामिल होती है.

    टर्मिनल, जिसमें `ngrok` सर्वर चल रहा है और
रीडायरेक्ट किया जा रहा है

    चौथी इमेज. टर्मिनल, जिसमें ngrok सर्वर चल रहा है और रीडायरेक्ट किया जा रहा है.

  5. ngrok ने आपके लोकल होस्ट पर वेब इंटरफ़ेस भी शुरू किया है ऐप्लिकेशन है, तो आप उसे किसी ब्राउज़र में खोलकर सभी गतिविधियों की निगरानी कर सकते हैं.

    `ngrok` ऐप्लिकेशन से होस्ट किया गया वेब इंटरफ़ेस जिसमें कोई एचटीटीपी नहीं दिख रहा है
अनुरोध

    पांचवी इमेज. ngrok ऐप्लिकेशन के ज़रिए होस्ट किया गया वेब इंटरफ़ेस कोई एचटीटीपी अनुरोध नहीं दिखा रहा.

  6. अपने Chat ऐप्लिकेशन को टेस्ट करें. इसके लिए, उसे सीधे संदेश:

    • Google Chat खोलें.

      Google Chat पर जाएं

    • नई चैट पर क्लिक करें.

    • डायलॉग बॉक्स में, अपने चैट ऐप्लिकेशन.

    • खोज के नतीजों में, Chat ऐप्लिकेशन ढूंढें. जोड़ें पर क्लिक करें > चैट.

    • डायरेक्ट मैसेज वाले स्पेस में, Hey! टाइप करें और enter दबाएं. आपका Chat ऐप्लिकेशन जवाब नहीं दे रहा है, क्योंकि सक्रिय रूप से डीबग किया गया.

  7. आपके लोकल एनवायरमेंट के Visual Studio Code में, यह जानकारी देखी जा सकती है सेट किए गए ब्रेकपॉइंट पर एक्ज़ीक्यूशन को रोका जाता है.

    निष्पादन को उस ब्रेकपॉइंट पर रोका गया, जो था
सेट

    छठी इमेज. सेट किए गए ब्रेकपॉइंट पर एक्ज़ीक्यूशन को रोका जाता है.

  8. Visual Studio Code के डीबगर से एक्ज़ीक्यूशन को फिर से शुरू करने पर इससे पहले कि Google Chat का Chat ऐप्लिकेशन का समय खत्म हो जाए मैसेज में मौजूद आपके नाम और अवतार की फ़ोटो वाले जवाब.

  9. वेब इंटरफ़ेस से एचटीटीपी अनुरोध और रिस्पॉन्स लॉग की जांच की जा सकती है आपके स्थानीय वातावरण में ngrok ऐप्लिकेशन के ज़रिए होस्ट किया गया.

    `ngrok` के ज़रिए होस्ट किए गए वेब इंटरफ़ेस से एचटीटीपी अनुरोध
ऐप्लिकेशन

    सातवीं इमेज. उस वेब इंटरफ़ेस से एचटीटीपी अनुरोध जिसे होस्ट किया गया है ngrok ऐप्लिकेशन.

  10. ऐप्लिकेशन के काम करने के तरीके को बदलने के लिए, Hello को Hey इनलाइन से बदलें main.py फ़ाइल में से 51. फ़ाइल सेव करने पर, Visual Studio Code अपडेट किए गए सोर्स कोड के साथ ऐप्लिकेशन को अपने-आप फिर से लोड करता है और डीबग मोड में ही रहता है.

    ऐप्लिकेशन चल रहा है और पोर्ट पर एचटीटीपी अनुरोधों को सुन रहा है
कोड बदलने के साथ `9000`
लोड हो गया

    आठवीं इमेज. ऐप्लिकेशन चल रहा है और एचटीटीपी अनुरोधों को सुन रहा है पोर्ट 9000 पर कोड में बदलाव लोड होने के साथ.

  11. इस बार, Hey! स्पेस में दूसरा मैसेज भेजने के बजाय, आपको होस्ट किए गए वेब इंटरफ़ेस पर लॉग किए गए आखिरी एचटीटीपी अनुरोध को चुन सकता है अपने स्थानीय वातावरण में ngrok ऐप्लिकेशन इंस्टॉल करें और Replay पर क्लिक करें. आपने पिछली बार की तरह Chat ऐप्लिकेशन का जवाब नहीं दिया है क्योंकि इसे सक्रिय रूप से डीबग किया जा रहा है.

  12. Visual Studio Code के डीबगर से एक्ज़ीक्यूशन को फिर से शुरू करने पर आप इसमें ngrok ऐप्लिकेशन के ज़रिए होस्ट किए गए वेब इंटरफ़ेस से देख सकते हैं आपके लोकल एनवायरमेंट की ऐसी जानकारी जिसमें ऐप्लिकेशन रिस्पॉन्स जनरेट करता है मैसेज का अपडेट किया गया वर्शन.

Java

  1. ऐप्लिकेशन डिफ़ॉल्ट ऐप्लिकेशन के लिए इस्तेमाल करने के लिए, नए उपयोगकर्ता क्रेडेंशियल पाएं क्रेडेंशियल:

    gcloud config set project PROJECT_ID
    gcloud auth application-default login

    PROJECT_ID को प्रोजेक्ट आईडी ऐप्लिकेशन के क्लाउड प्रोजेक्ट के लिए.

  2. GitHub से googleworkspace/google-chat-samples रिपॉज़िटरी का क्लोन बनाएं में मौजूद है, तो उसमें ऐप्लिकेशन कोड शामिल होता है:

    git clone https://github.com/googleworkspace/google-chat-samples.git
  3. आपके लोकल एनवायरमेंट में इंस्टॉल किए गए Visual Studio Code IDE से, ये काम करें:

    1. नई विंडो में, फ़ोल्डर खोलें google-chat-samples/java/avatar-app.
    2. App ऐप्लिकेशन को चलाने के लिए, Maven प्रोजेक्ट को कॉन्फ़िगर करें Cloud Functions फ़्रेमवर्क बिल्ड जोड़कर स्थानीय तौर पर 9000 को पोर्ट करें pom.xml फ़ाइल में function-maven-plugin प्लगिन:

      ...
      <plugin>
          <groupId>com.google.cloud.functions</groupId>
          <artifactId>function-maven-plugin</artifactId>
          <version>0.11.0</version>
          <configuration>
              <functionTarget>App</functionTarget>
              <port>9000</port>
          </configuration>
      </plugin>
      ...
      
    3. अब इसे डीबग मोड में स्थानीय तौर पर लॉन्च किया जा सकता है:

      mvnDebug function:run
      Preparing to execute Maven in debug mode
      Listening for transport dt_socket at address: 8000
    4. रूट डायरेक्ट्री में .vscode/launch.json फ़ाइल बनाएं और Remote Debug Watch नाम के एक लॉन्च को कॉन्फ़िगर करें, जो ऐप्लिकेशन को पहले 8000 पोर्ट के साथ लॉन्च किया गया था:

      {
          "version": "0.2.0",
          "configurations": [{
              "type": "java",
              "request": "attach",
              "name": "Remote Debug Watch",
              "projectName": "http-function",
              "hostName": "localhost",
              "port": 8000
          }]
      }
      
    5. ऐसा ब्रेकपॉइंट जोड़ें जो App.java फ़ाइल खोलें और अटैचमेंट शुरू करें और डीबग करना Remote Debug Watch कॉन्फ़िगरेशन पहले जोड़ा गया. यह ऐप्लिकेशन अब 9000 पोर्ट पर एचटीटीपी अनुरोधों को सुन और सुन रहा है.

      ऐप्लिकेशन, इस पर चल रहे एचटीटीपी अनुरोधों को सुन रहा है और
पोर्ट `9000`

      तीसरी इमेज. उसका ऐप्लिकेशन चालू है और एचटीटीपी को सुन रहा है 9000 पोर्ट पर अनुरोध.

  4. अपने लोकल एनवायरमेंट में ngrok ऐप्लिकेशन लॉन्च करें:

    ngrok http --domain=NGROK_STATIC_DOMAIN 9000

    इसमें NGROK_STATIC_DOMAIN को स्टैटिक डोमेन से बदलें आपका ngrok खाता. सभी अनुरोध अब आपके स्थानीय एनवायरमेंट और ऐप्लिकेशन के इस्तेमाल किए गए पोर्ट की जानकारी शामिल होती है.

    टर्मिनल, जिसमें `ngrok` सर्वर चल रहा है और
रीडायरेक्ट किया जा रहा है

    चौथी इमेज. टर्मिनल, जिसमें ngrok सर्वर चल रहा है और रीडायरेक्ट किया जा रहा है.

  5. ngrok ने आपके लोकल होस्ट पर वेब इंटरफ़ेस भी शुरू किया है ऐप्लिकेशन है, तो आप उसे किसी ब्राउज़र में खोलकर सभी गतिविधियों की निगरानी कर सकते हैं.

    `ngrok` ऐप्लिकेशन से होस्ट किया गया वेब इंटरफ़ेस जिसमें कोई एचटीटीपी नहीं दिख रहा है
अनुरोध

    पांचवी इमेज. ngrok ऐप्लिकेशन के ज़रिए होस्ट किया गया वेब इंटरफ़ेस कोई एचटीटीपी अनुरोध नहीं दिखा रहा.

  6. अपने Chat ऐप्लिकेशन को टेस्ट करें. इसके लिए, उसे सीधे संदेश:

    • Google Chat खोलें.

      Google Chat पर जाएं

    • नई चैट पर क्लिक करें.

    • डायलॉग बॉक्स में, अपने चैट ऐप्लिकेशन.

    • खोज के नतीजों में, Chat ऐप्लिकेशन खोजें. जोड़ें पर क्लिक करें &gt; चैट.

    • डायरेक्ट मैसेज वाले स्पेस में, Hey! टाइप करें और enter दबाएं. आपका Chat ऐप्लिकेशन जवाब नहीं दे रहा है, क्योंकि सक्रिय रूप से डीबग किया गया.

  7. आपके लोकल एनवायरमेंट के Visual Studio Code में, यह जानकारी देखी जा सकती है सेट किए गए ब्रेकपॉइंट पर एक्ज़ीक्यूशन को रोका जाता है.

    निष्पादन को उस ब्रेकपॉइंट पर रोका गया, जो था
सेट

    छठी इमेज. सेट किए गए ब्रेकपॉइंट पर एक्ज़ीक्यूशन को रोका जाता है.

  8. Visual Studio Code के डीबगर से एक्ज़ीक्यूशन को फिर से शुरू करने पर इससे पहले कि Google Chat का Chat ऐप्लिकेशन का समय खत्म हो जाए मैसेज में मौजूद आपके नाम और अवतार की फ़ोटो वाले जवाब.

  9. वेब इंटरफ़ेस से एचटीटीपी अनुरोध और रिस्पॉन्स लॉग की जांच की जा सकती है आपके स्थानीय वातावरण में ngrok ऐप्लिकेशन के ज़रिए होस्ट किया गया.

    `ngrok` के ज़रिए होस्ट किए गए वेब इंटरफ़ेस से एचटीटीपी अनुरोध
ऐप्लिकेशन

    सातवीं इमेज. उस वेब इंटरफ़ेस से एचटीटीपी अनुरोध जिसे होस्ट किया गया है ngrok ऐप्लिकेशन.

  10. ऐप्लिकेशन के काम करने के तरीके को बदलने के लिए, Hello को Hey इनलाइन से बदलें App.java फ़ाइल में से 55 चुनें. इसके बाद, mvnDebug प्रोसेस फिर से शुरू करें और फिर से अटैच करने और रीस्टार्ट करने के लिए, Remote Debug Watch को फिर से लॉन्च करें डीबग करना.

  11. इस बार, Hey! स्पेस में दूसरा मैसेज भेजने के बजाय, आपको होस्ट किए गए वेब इंटरफ़ेस पर लॉग किए गए आखिरी एचटीटीपी अनुरोध को चुन सकता है अपने स्थानीय वातावरण में ngrok ऐप्लिकेशन इंस्टॉल करें और Replay पर क्लिक करें. आपने पिछली बार की तरह Chat ऐप्लिकेशन का जवाब नहीं दिया क्योंकि इसे सक्रिय रूप से डीबग किया जा रहा है.

  12. Visual Studio Code के डीबगर से एक्ज़ीक्यूशन को फिर से शुरू करने पर आप इसमें ngrok ऐप्लिकेशन के ज़रिए होस्ट किए गए वेब इंटरफ़ेस से देख सकते हैं आपके लोकल एनवायरमेंट की ऐसी जानकारी जिसमें ऐप्लिकेशन रिस्पॉन्स जनरेट करता है मैसेज का अपडेट किया गया वर्शन.

रिमोट एनवायरमेंट से डीबग करें

इस सेक्शन में, आपने अपने उस Chat ऐप्लिकेशन के साथ इंटरैक्ट किया है रिमोट एनवायरमेंट पर काम करता है.

रिमोट से डीबग करें
वातावरण

नौवीं इमेज. रिमोट एनवायरमेंट से डीबग करें.

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

  • आपके Chat ऐप्लिकेशन में डायरेक्ट मैसेज स्पेस. आप सेक्शन को फ़ॉलो करो अपने Chat ऐप्लिकेशन को टेस्ट करें क्विकस्टार्ट गाइड और अपनी पसंद की चीज़ों को खोजें शुरू करने के लिए Chat ऐप्लिकेशन.
  • डीबगर के साथ आपका ऐप्लिकेशन, रिमोट एनवायरमेंट में चल रहा है दिए गए पोर्ट पर चालू होता है, तो इसका REMOTE_DEBUG_PORT पर जाएं.
  • आपका लोकल एनवायरमेंट, आपके रिमोट एनवायरमेंट को ssh कर सकता है.
  • आपके लोकल एनवायरमेंट में एक IDE सेट अप किया गया है, जो डीबग कर सकता है. हम Visual Studio Code IDE और इसकी डिफ़ॉल्ट सेटिंग इसमें डीबग करने की सुविधाएं उदाहरण के लिए गाइड.

अपने डिवाइस की लोकल और रिमोट एनवायरमेंट को कनेक्ट करें

आपके स्थानीय एनवायरमेंट में, जहां से आपको डीबग क्लाइंट शुरू करना है कनेक्शन, एसएसएच टनल सेट अप करें:

ssh -L LOCAL_DEBUG_PORT:localhost:REMOTE_DEBUG_PORT REMOTE_USERNAME@REMOTE_ADDRESS

इन्हें बदलें:

  • LOCAL_DEBUG_PORT: आपके डिवाइस में मौजूद डीबग पोर्ट पर्यावरण को ध्यान में रखते हुए काम करना.
  • REMOTE_USERNAME: आपकी रिमोट एनवायरमेंट में उपयोगकर्ता नाम.
  • REMOTE_ADDRESS: आपके रिमोट एनवायरमेंट का पता.
  • REMOTE_DEBUG_PORT: आपके रिमोट में डीबग पोर्ट पर्यावरण को ध्यान में रखते हुए काम करना.

आपके लोकल एनवायरमेंट के डीबग पोर्ट को अब आपके रिमोट एनवायरमेंट.

डीबग करना शुरू करें

अपने लोकल एनवायरमेंट में इंस्टॉल किए गए Visual Studio Code IDE से, यह काम करें फ़ॉलो किया जा रहा है:

  1. नई विंडो में, अपने ऐप्लिकेशन का सोर्स कोड खोलें.
  2. रूट डायरेक्ट्री में .vscode/launch.json फ़ाइल बनाएं और किसी फ़ाइल को कॉन्फ़िगर करें Debug Remote नाम का लॉन्च जो आपके लोकल नेटवर्क में डीबग पोर्ट से कनेक्ट होता है वातावरण:

    Node.js

    {
        "version": "0.2.0",
        "configurations": [{
            "type": "node",
            "request": "attach",
            "name": "Debug Remote",
            "address": "127.0.0.1",
            "port": LOCAL_DEBUG_PORT
        }]
    }
    

    Python

    {
        "version": "0.2.0",
        "configurations": [{
            "type": "python",
            "request": "attach",
            "name": "Debug Remote",
            "connect": {
                "host": "127.0.0.1",
                "port": LOCAL_DEBUG_PORT
            }
        }]
    }
    

    Java

    {
        "version": "0.2.0",
        "configurations": [{
            "type": "java",
            "request": "attach",
            "name": "Debug Remote",
            "hostName": "127.0.0.1",
            "port": LOCAL_DEBUG_PORT
        }]
    }
    

    LOCAL_DEBUG_PORT को अपने स्थानीय वातावरण में मौजूद हैं.

  3. अपने ऐप्लिकेशन के सोर्स कोड में ऐसा ब्रेकपॉइंट जोड़ें जो एचटीटीपी अनुरोध को रोकता हो संसाधित करता है, और दौड़ना शुरू करता है और पहले जोड़े गए Debug Remote कॉन्फ़िगरेशन की मदद से डीबग करना.

अपने Chat ऐप्लिकेशन के डायरेक्ट मैसेज स्पेस में, जिसे आपको टेस्ट करना हो. इसके बाद, enter दबाएं. आपका Gemini Chat का इस्तेमाल जारी होने की वजह से, Chat ऐप्लिकेशन जवाब नहीं दे रहा है डीबग किया गया Visual Studio Code IDE में.