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

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

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

ध्यान दें: अगर आपका Chat ऐप्लिकेशन Google Apps Script की मदद से बनाया गया है, तो इसके बजाय इसका इस्तेमाल करें:

• डिप्लॉयमेंट की जांच करना
• डीबगर और ब्रेकपॉइंट का इस्तेमाल करना

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

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

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

वर्कशॉप

Node.js

Python

Java

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

Node.js

• आपके लोकल एनवायरमेंट में, node और npm के नए वर्शन इंस्टॉल होने चाहिए.

• आपके लोकल एनवायरमेंट में nodemon का नया वर्शन इंस्टॉल किया गया है. इसका इस्तेमाल, अपने-आप रीलोड होने की सुविधा के लिए किया जाता है:

  npm install -g nodemon

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

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

• Git installed in your local environment.

• आपके पास ngrok खाता होना चाहिए.

Python

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

Java

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

लोकल होस्ट सेवा को सार्वजनिक तौर पर उपलब्ध कराना

आपको अपने लोकल एनवायरमेंट को इंटरनेट से कनेक्ट करना होगा, ताकि 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 ऐप्लिकेशन, अपने सभी एचटीटीपी अनुरोधों को स्टैटिक डोमेन पर भेजता है. ngrok सार्वजनिक सेवा, Chat ऐप्लिकेशन और ऐप्लिकेशन कोड के बीच ब्रिज की तरह काम करती है. यह कोड स्थानीय तौर पर काम करता है.

Chat ऐप्लिकेशन की टेस्टिंग करना

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

ध्यान दें: Chat ऐप्लिकेशन, Python और Java के उदाहरणों में Functions Framework के साथ काम करता है. वहीं, Node.js के उदाहरण में Express Framework के साथ काम करता है.

Node.js

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

   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. रूट डायरेक्ट्री में .vscode/launch.json फ़ाइल बनाकर, Debug Watch नाम का लॉन्च बनाएं और उसे कॉन्फ़िगर करें. यह लॉन्च, 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 पर चल रहा है और एचटीटीपी अनुरोधों को सुन रहा है.

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

   ngrok http --domain=NGROK_STATIC_DOMAIN 9000

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

   

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

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

   

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

5. Chat ऐप्लिकेशन को डायरेक्ट मैसेज भेजकर, उसकी जांच करें:

   • Google Chat खोलें.

     Google Chat पर जाएं

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

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

   • खोज के नतीजों में, अपना Chat ऐप्लिकेशन ढूंढें. इसके बाद, जोड़ें > Chat पर क्लिक करें.

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

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

   

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

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

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

   

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

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

   

   आठवीं इमेज. ऐप्लिकेशन चल रहा है और कोड में हुए बदलाव के साथ, पोर्ट 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 की जगह, ऐप्लिकेशन के Cloud प्रोजेक्ट का प्रोजेक्ट आईडी डालें.

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 नाम का एक लॉन्च कॉन्फ़िगर करें. यह लॉन्च, मॉड्यूल functions-framework से ऐप्लिकेशन को ट्रिगर करता है. यह डिबग मोड में पोर्ट 9000 पर वर्चुअल एनवायरमेंट 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 पर चल रहा है और एचटीटीपी अनुरोधों को सुन रहा है.

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

   ngrok http --domain=NGROK_STATIC_DOMAIN 9000

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

   

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

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

   

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

6. Chat ऐप्लिकेशन को डायरेक्ट मैसेज भेजकर, उसकी जांच करें:

   • Google Chat खोलें.

     Google Chat पर जाएं

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

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

   • खोज के नतीजों में, अपना Chat ऐप्लिकेशन ढूंढें. इसके बाद, जोड़ें > Chat पर क्लिक करें.

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

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

   

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

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

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

   

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

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

    

    आठवीं इमेज. ऐप्लिकेशन चल रहा है और कोड में हुए बदलाव के साथ, पोर्ट 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 की जगह, ऐप्लिकेशन के Cloud प्रोजेक्ट का प्रोजेक्ट आईडी डालें.

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. Maven प्रोजेक्ट को कॉन्फ़िगर करें, ताकि ऐप्लिकेशन को स्थानीय तौर पर पोर्ट 9000 पर चलाया जा सके. इसके लिए, pom.xml फ़ाइल में Google Cloud Functions Framework build plugin function-maven-plugin जोड़ें:App

      ...
      <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 पर एचटीटीपी अनुरोधों को सुन रहा है.

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

   ngrok http --domain=NGROK_STATIC_DOMAIN 9000

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

   

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

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

   

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

6. Chat ऐप्लिकेशन को डायरेक्ट मैसेज भेजकर, उसकी जांच करें:

   • Google Chat खोलें.

     Google Chat पर जाएं

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

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

   • खोज के नतीजों में, अपना Chat ऐप्लिकेशन ढूंढें. इसके बाद, जोड़ें > Chat पर क्लिक करें.

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

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

   

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

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

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

   

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

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

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

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

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

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

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

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

• Chat ऐप्लिकेशन के साथ डायरेक्ट मैसेज स्पेस. क्विकस्टार्ट गाइड के Chat ऐप्लिकेशन की जांच करना सेक्शन को फ़ॉलो करें. इसके बाद, Chat ऐप्लिकेशन खोजकर डायरेक्ट मैसेज स्पेस शुरू करें.
• आपका ऐप्लिकेशन, रिमोट एनवायरमेंट में चल रहा है. साथ ही, किसी पोर्ट पर डीबगर चालू है. इस गाइड के निर्देशों में इसे REMOTE_DEBUG_PORT के तौर पर दिखाया गया है.
• आपका लोकल एनवायरमेंट, रिमोट एनवायरमेंट से ssh हो सकता है.
• आपके लोकल एनवायरमेंट में ऐसा आईडीई सेट अप होना चाहिए जो डीबग कर सके. इस गाइड में, हमने उदाहरण के तौर पर 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. अपने ऐप्लिकेशन के सोर्स कोड में एक ब्रेकपॉइंट जोड़ें. इससे HTTP अनुरोध की प्रोसेसिंग रुक जाएगी. इसके बाद, Debug Remote कॉन्फ़िगरेशन का इस्तेमाल करके, ऐप्लिकेशन को चलाना और डीबग करना शुरू करें.

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

मिलते-जुलते विषय

• गड़बड़ी के लॉग चालू करने और क्वेरी करने का तरीका जानें.
• Google Chat ऐप्लिकेशन में आने वाली गड़बड़ियों को ठीक करने का तरीका जानें. जैसे, "ऐप्लिकेशन काम नहीं कर रहा", "Google Chat API सिर्फ़ Google Workspace के उपयोगकर्ताओं के लिए उपलब्ध है" या "उपयोगकर्ताओं को स्पेस से हटाया जा सकता है".
• कार्ड से जुड़ी गड़बड़ियां ठीक करने का तरीका जानें. जैसे, कार्ड मैसेज, डायलॉग या लिंक की झलक रेंडर न होना या उम्मीद के मुताबिक काम न करना.