HTTP Google Workspace অ্যাড-অনগুলি পরীক্ষা করে ডিবাগ করুন

একজন Google Workspace অ্যাড-অন ডেভেলপার হিসেবে পরিবর্তনগুলি পরীক্ষা করতে বা জটিল সমস্যার সমাধান করতে আপনাকে কোড ডিবাগ করতে হতে পারে। আপনার অ্যাপের আর্কিটেকচার, অ্যাপটি কী করে, কীভাবে আপনার অ্যাপ স্থাপন করা হয় এবং আপনার পছন্দের উপর নির্ভর করে Google Workspace অ্যাড-অনগুলিকে ডিবাগ করা বিভিন্ন উপায়ে করা যেতে পারে।

এই পৃষ্ঠাটি ব্যাখ্যা করে যে কীভাবে এনগ্রোক ব্যবহার করে একটি HTTP Google Workspace অ্যাড-অন ডিবাগ করতে হয়, এটি একটি ইউনিফাইড ইনগ্রেস প্ল্যাটফর্ম যা আপনি স্থানীয় উন্নয়ন পরিবেশ পরীক্ষা করতে ব্যবহার করতে পারেন। এই নির্দেশিকায়, আপনি স্থানীয় পরিবেশে কোড পরিবর্তন পরীক্ষা করুন এবং দূরবর্তী পরিবেশে সমস্যা সমাধান করুন।

স্থানীয় উন্নয়ন পরিবেশ থেকে ডিবাগ করুন

এই বিভাগে, আপনি আপনার Google Workspace অ্যাড-অনের সাথে ইন্টারঅ্যাক্ট করুন যা আপনার স্থানীয় পরিবেশে কার্যকর হয়।

চিত্র 1. স্থানীয় উন্নয়ন পরিবেশে ডিবাগ করুন।

পূর্বশর্ত

Node.js

• আপনার স্থানীয় পরিবেশে ইনস্টল করা node এবং npm সর্বশেষ সংস্করণ।

• আপনার স্থানীয় পরিবেশে ইনস্টল করা nodemon সর্বশেষ সংস্করণ, এটি স্বয়ংক্রিয়ভাবে পুনরায় লোড করার উদ্দেশ্যে ব্যবহৃত হয়:

  npm install -g nodemon
  

• একটি Google ক্লাউড প্রকল্প । আপনি পূর্বশর্ত বিভাগগুলি অনুসরণ করতে পারেন এবং Quickstart গাইডের পরিবেশ সেট আপ করতে পারেন ।

• আপনার স্থানীয় পরিবেশে ডিবাগ করার জন্য Google Workspace অ্যাড-অনের কোড। আমরা উদাহরণের উদ্দেশ্যে এই নির্দেশিকায় GitHub সংগ্রহস্থল googleworkspace/add-ons-samples থেকে কোড উদাহরণ 3p-resources থেকে প্রিভিউ লিঙ্ক বৈশিষ্ট্যগুলি ব্যবহার করি।

• আপনার স্থানীয় পরিবেশে একটি IDE সেট আপ যা ডিবাগ করতে পারে। আমরা চিত্রের উদ্দেশ্যে এই নির্দেশিকায় Visual Studio Code IDE এবং এর ডিফল্ট ডিবাগিং বৈশিষ্ট্যগুলি ব্যবহার করি।

• একটি ngrok অ্যাকাউন্ট।

• gcloud এর সর্বশেষ সংস্করণ আপনার স্থানীয় পরিবেশে ইনস্টল এবং আরম্ভ করা হয়েছে ।

পাইথন

• আপনার স্থানীয় পরিবেশে python3 এর সর্বশেষ সংস্করণ ইনস্টল করা হয়েছে ।
• আপনার স্থানীয় পরিবেশে ইনস্টল করা pip এবং virtualenv এর সর্বশেষ সংস্করণ, এগুলি যথাক্রমে Python প্যাকেজ এবং ভার্চুয়াল পরিবেশ পরিচালনা করতে ব্যবহৃত হয়।
• একটি Google ক্লাউড প্রকল্প । আপনি পূর্বশর্ত বিভাগগুলি অনুসরণ করতে পারেন এবং Quickstart গাইডের পরিবেশ সেট আপ করতে পারেন ।
• আপনার স্থানীয় পরিবেশে ডিবাগ করার জন্য Google Workspace অ্যাড-অনের কোড। আমরা উদাহরণের উদ্দেশ্যে এই নির্দেশিকায় GitHub সংগ্রহস্থল googleworkspace/add-ons-samples থেকে কোড উদাহরণ 3p-resources থেকে প্রিভিউ লিঙ্ক বৈশিষ্ট্যগুলি ব্যবহার করি।
• আপনার স্থানীয় পরিবেশে একটি IDE সেট আপ যা ডিবাগ করতে পারে। আমরা চিত্রের উদ্দেশ্যে এই নির্দেশিকায় Visual Studio Code IDE এবং এর ডিফল্ট ডিবাগিং বৈশিষ্ট্যগুলি ব্যবহার করি।
• একটি ngrok অ্যাকাউন্ট।
• gcloud এর সর্বশেষ সংস্করণ আপনার স্থানীয় পরিবেশে ইনস্টল এবং আরম্ভ করা হয়েছে ।

জাভা

• আপনার স্থানীয় পরিবেশে ইনস্টল করা Java SE 11's JDK এর সর্বশেষ স্থিতিশীল সংস্করণ।
• আপনার স্থানীয় পরিবেশে ইনস্টল করা Apache Maven সর্বশেষ সংস্করণ, এটি জাভা প্রকল্পগুলি পরিচালনা করতে ব্যবহৃত হয়।
• একটি Google ক্লাউড প্রকল্প । আপনি পূর্বশর্ত বিভাগগুলি অনুসরণ করতে পারেন এবং Quickstart গাইডের পরিবেশ সেট আপ করতে পারেন ।
• আপনার স্থানীয় পরিবেশে ডিবাগ করার জন্য Google Workspace অ্যাড-অনের কোড। আমরা উদাহরণের উদ্দেশ্যে এই নির্দেশিকায় GitHub সংগ্রহস্থল googleworkspace/add-ons-samples থেকে কোড উদাহরণ 3p-resources থেকে প্রিভিউ লিঙ্ক বৈশিষ্ট্যগুলি ব্যবহার করি।
• আপনার স্থানীয় পরিবেশে একটি IDE সেট আপ যা ডিবাগ করতে পারে। আমরা চিত্রের উদ্দেশ্যে এই নির্দেশিকায় Visual Studio Code IDE এবং এর ডিফল্ট ডিবাগিং বৈশিষ্ট্যগুলি ব্যবহার করি।
• একটি ngrok অ্যাকাউন্ট।
• gcloud এর সর্বশেষ সংস্করণ আপনার স্থানীয় পরিবেশে ইনস্টল এবং আরম্ভ করা হয়েছে ।

লোকালহোস্ট পরিষেবা সর্বজনীনভাবে উপলব্ধ করুন

আপনাকে আপনার স্থানীয় পরিবেশকে ইন্টারনেটের সাথে সংযুক্ত করতে হবে যাতে Google Workspace অ্যাড-অন এটি অ্যাক্সেস করতে পারে। ngrok অ্যাপ্লিকেশনটি আপনার স্থানীয় পরিবেশে একটি সর্বজনীন URL-এ করা HTTP অনুরোধগুলিকে পুনঃনির্দেশ করতে ব্যবহৃত হয়।

1. আপনার স্থানীয় পরিবেশে একটি ব্রাউজারে, আপনার ngrok অ্যাকাউন্টে সাইন ইন করুন।
2. অ্যাপ্লিকেশনটি ইনস্টল করুন এবং আপনার স্থানীয় পরিবেশে আপনার authtoken সেট আপ করুন।
3. আপনার ngrok অ্যাকাউন্টে একটি স্ট্যাটিক ডোমেন তৈরি করুন , এই গাইডের নির্দেশাবলীতে এটিকে NGROK_STATIC_DOMAIN হিসাবে উল্লেখ করা হয়েছে।

অ্যাড-অন স্থাপনা তৈরি করুন এবং ইনস্টল করুন

1. আপনার স্ট্যাটিক ডোমেনে এর সমস্ত HTTP অনুরোধ পাঠাতে Google Workspace অ্যাড-অন কনফিগার করুন। আপনার স্থাপনার ফাইল নিম্নলিখিত মত হওয়া উচিত:

   {
     "oauthScopes": [
       "https://www.googleapis.com/auth/workspace.linkpreview",
       "https://www.googleapis.com/auth/workspace.linkcreate"
     ],
     "addOns": {
       "common": {
         "name": "Manage support cases",
         "logoUrl": "https://developers.google.com/workspace/add-ons/images/support-icon.png",
         "layoutProperties": {
           "primaryColor": "#dd4b39"
         }
       },
       "docs": {
         "linkPreviewTriggers": [
           {
             "runFunction": "NGROK_STATIC_DOMAIN",
             "patterns": [
               {
                 "hostPattern": "example.com",
                 "pathPrefix": "support/cases"
               },
               {
                 "hostPattern": "*.example.com",
                 "pathPrefix": "cases"
               },
               {
                 "hostPattern": "cases.example.com"
               }
             ],
             "labelText": "Support case",
             "localizedLabelText": {
               "es": "Caso de soporte"
             },
             "logoUrl": "https://developers.google.com/workspace/add-ons/images/support-icon.png"
           }
         ],
         "createActionTriggers": [
           {
             "id": "createCase",
             "labelText": "Create support case",
             "localizedLabelText": {
               "es": "Crear caso de soporte"
             },
             "runFunction": "$URL2",
             "logoUrl": "https://developers.google.com/workspace/add-ons/images/support-icon.png"
           }
         ]
       }
     }
   }
   

   আপনার ngrok অ্যাকাউন্টের স্ট্যাটিক ডোমেন দিয়ে NGROK_STATIC_DOMAIN প্রতিস্থাপন করুন।

2. ব্যবহার করার জন্য Google ক্লাউড প্রকল্প সেট করুন:

   gcloud config set project PROJECT_ID
   

3. অ্যাপ্লিকেশন ডিফল্ট শংসাপত্রগুলির জন্য ব্যবহার করার জন্য নতুন ব্যবহারকারীর শংসাপত্রগুলি অর্জন করুন:

   gcloud auth application-default login
   

   অ্যাপের Google ক্লাউড প্রজেক্টের জন্য প্রোজেক্ট আইডি দিয়ে PROJECT_ID প্রতিস্থাপন করুন।

4. স্থাপনা তৈরি করুন:

   gcloud workspace-add-ons deployments create manageSupportCases \
       --deployment-file=DEPLOYMENT_FILE_PATH
   

   আপনার স্থাপনার ফাইলের পাথ দিয়ে DEPLOYMENT_FILE_PATH প্রতিস্থাপন করুন।

5. স্থাপনা ইনস্টল করুন:

   gcloud workspace-add-ons deployments install manageSupportCases
   

চিত্র 2. Google Workspace অ্যাড-অন তার সমস্ত HTTP অনুরোধ স্ট্যাটিক ডোমেনে পাঠায়। ngrok পাবলিক সার্ভিস Google Workspace অ্যাড-অন এবং স্থানীয়ভাবে কার্যকর করা অ্যাপ্লিকেশন কোডের মধ্যে সেতু হিসেবে কাজ করে।

Google Workspace অ্যাড-অন পরীক্ষা করুন

আপনি স্থানীয়ভাবে আপনার Google Workspace অ্যাড-অন স্থাপন, পরীক্ষা, ডিবাগ এবং অটো-রিলোড করতে পারেন।

দ্রষ্টব্য: উদাহরণগুলিতে Google Workspace অ্যাড-অন ক্লাউড ফাংশন ফ্রেমওয়ার্কের সাথে কার্যকর হয়।

Node.js

1. আপনার স্থানীয় পরিবেশে ইনস্টল করা Visual Studio Code IDE থেকে, নিম্নলিখিতগুলি করুন:

   1. একটি নতুন উইন্ডোতে, add-ons-samples/node/3p-resources ফোল্ডারটি খুলুন।

   2. package.json ফাইলে একটি নির্ভরতা এবং দুটি স্ক্রিপ্ট যোগ করে স্থানীয় রান এবং স্বয়ংক্রিয়-রিলোড ডিবাগের জন্য অ্যাপ্লিকেশনটি কনফিগার করুন:

      {
          ...
          "dependencies": {
            ...
            "@google-cloud/functions_framework": "^3.3.0"
          },
          "scripts": {
              ...
              "start": "npx functions-framework --target=createLinkPreview --port=9000",
              "debug-watch": "nodemon --watch ./ --exec npm start"
          }
          ...
      }
      

   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 ফাইলে HTTP অনুরোধ প্রক্রিয়াকরণকে বিরতি দেয় এবং আগে যোগ করা Debug Watch কনফিগারেশনের সাথে চালানো এবং ডিবাগ করা শুরু করুন । অ্যাপ্লিকেশনটি এখন চলছে এবং 9000 পোর্টে HTTP অনুরোধের জন্য শুনছে।

      

      চিত্র 3. অ্যাপ্লিকেশনটি চলছে এবং 9000 পোর্টে HTTP অনুরোধের জন্য শুনছে।

2. আপনার স্থানীয় পরিবেশে ngrok অ্যাপ্লিকেশন চালু করুন:

   ngrok http --domain=NGROK_STATIC_DOMAIN 9000
   

   আপনার ngrok অ্যাকাউন্টের স্ট্যাটিক ডোমেন দিয়ে NGROK_STATIC_DOMAIN প্রতিস্থাপন করুন। সমস্ত অনুরোধ এখন আপনার স্থানীয় পরিবেশ এবং অ্যাপ্লিকেশন দ্বারা ব্যবহৃত পোর্টে পুনঃনির্দেশিত হয়।

   

   চিত্র 4. ngrok সার্ভার চলমান এবং পুনঃনির্দেশ সহ টার্মিনাল।

3. ngrok অ্যাপ্লিকেশন দ্বারা আপনার লোকালহোস্টে একটি ওয়েব ইন্টারফেসও শুরু হয়েছে, আপনি এটি একটি ব্রাউজারে খোলার মাধ্যমে সমস্ত ক্রিয়াকলাপ নিরীক্ষণ করতে পারেন।

   

   চিত্র 5. ngrok অ্যাপ্লিকেশন দ্বারা হোস্ট করা ওয়েব ইন্টারফেসটিতে কোনো HTTP অনুরোধ নেই।

4. একটি পরীক্ষক অ্যাকাউন্টের সাথে একটি নতুন Google ডক-এ একটি কেস ইউআরএল প্রিভিউ করে আপনার Google Workspace অ্যাড-অন পরীক্ষা করুন:

   • একটি নতুন Google ডক তৈরি করুন৷

     একটি নতুন Google ডক তৈরি করুন৷

   • নিম্নলিখিত লিঙ্কটি টাইপ করুন এবং enter টিপুন:

     https://example.com/support/case/?name=Name1&description=Description1&priority=P1
     

   • লিঙ্কটিতে ক্লিক করুন.

5. আপনার স্থানীয় পরিবেশে Visual Studio Code , আপনি দেখতে পাচ্ছেন যে ব্রেকপয়েন্ট সেট করা হয়েছিল সেখানে এক্সিকিউশনটি থামানো হয়েছে।

   

   চিত্র 6. যে ব্রেকপয়েন্ট সেট করা হয়েছিল সেখানে এক্সিকিউশন থামানো হয়েছে।

6. আপনি যখন Google Workspace অ্যাড-অনগুলির সময় শেষ হওয়ার আগে Visual Studio Code ডিবাগার থেকে এক্সিকিউশন পুনরায় শুরু করেন তখন Google Workspace অ্যাড-অন ক্যাশে থেকে Google ডক-এ লিঙ্কের প্রিভিউ দেখায়।

7. আপনি আপনার স্থানীয় পরিবেশে ngrok অ্যাপ্লিকেশন দ্বারা হোস্ট করা ওয়েব ইন্টারফেস থেকে HTTP অনুরোধ এবং প্রতিক্রিয়া লগগুলি পরীক্ষা করতে পারেন।

   

   চিত্র 7. ngrok অ্যাপ্লিকেশন দ্বারা হোস্ট করা ওয়েব ইন্টারফেস থেকে HTTP অনুরোধ।

8. অ্যাপ্লিকেশন আচরণ পরিবর্তন করতে, Case এর পরিবর্তে Case Case: index.js এর ইনলাইন 51 । আপনি যখন ফাইলটি সংরক্ষণ করেন, nodemon স্বয়ংক্রিয়ভাবে আপডেট হওয়া সোর্স কোডের সাথে অ্যাপ্লিকেশনটিকে পুনরায় লোড করে এবং Visual Studio Code ডিবাগ মোডে থাকে।

   

   চিত্র 8. কোড পরিবর্তন লোড সহ পোর্ট 9000 -এ অ্যাপ্লিকেশনটি চলছে এবং HTTP অনুরোধের জন্য শুনছে।

9. এইবার, লিঙ্কে ক্লিক করার পরিবর্তে এবং একটি নতুন Google ডক-এ কয়েক সেকেন্ড অপেক্ষা করার পরিবর্তে, আপনি আপনার স্থানীয় পরিবেশে ngrok অ্যাপ্লিকেশন দ্বারা হোস্ট করা ওয়েব ইন্টারফেসে লগ করা শেষ HTTP অনুরোধটি নির্বাচন করতে পারেন এবং Replay ক্লিক করতে পারেন। গতবারের মতোই, আপনার Google Workspace অ্যাড-অন উত্তর দেয় না কারণ এটি সক্রিয়ভাবে ডিবাগ করা হচ্ছে।

10. আপনি যখন Visual Studio Code ডিবাগার থেকে এক্সিকিউশন পুনরায় শুরু করেন তখন আপনি আপনার স্থানীয় পরিবেশে ngrok অ্যাপ্লিকেশন দ্বারা হোস্ট করা ওয়েব ইন্টারফেস থেকে দেখতে পারেন যে অ্যাপ্লিকেশনটি প্রিভিউ কার্ডের আপডেট হওয়া সংস্করণের সাথে একটি প্রতিক্রিয়া তৈরি করে।

পাইথন

1. আপনার স্থানীয় পরিবেশে ইনস্টল করা Visual Studio Code IDE থেকে, নিম্নলিখিতগুলি করুন:

   1. একটি নতুন উইন্ডোতে, add-ons-samples/python/3p-resources/create_link_preview ফোল্ডারটি খুলুন।

   2. Python env এর জন্য একটি নতুন ভার্চুয়াল পরিবেশ তৈরি করুন এবং এটি সক্রিয় করুন:

      virtualenv env
      source env/bin/activate
      

   3. ভার্চুয়াল পরিবেশে pip ব্যবহার করে সমস্ত প্রকল্প নির্ভরতা ইনস্টল করুন:

      pip install -r requirements.txt
      

   4. রুট ডিরেক্টরিতে .vscode/launch.json ফাইলটি তৈরি করুন এবং Debug Watch নামে একটি লঞ্চ কনফিগার করুন যা ভার্চুয়াল পরিবেশ env এ ডিবাগ মোডে পোর্ট 9000 -এর মডিউল functions-framework থেকে অ্যাপ্লিকেশনটিকে ট্রিগার করে:

      {
          "version": "0.2.0",
          "configurations": [{
              "type": "python",
              "request": "launch",
              "name": "Debug Watch",
              "python": "${workspaceFolder}/env/bin/python3",
              "module": "functions_framework",
              "args": [
                  "--target", "create_link_preview",
                  "--port", "9000",
                  "--debug"
              ]
          }]
      }
      

   5. একটি ব্রেকপয়েন্ট যোগ করুন যা main.py ফাইলে HTTP অনুরোধ প্রক্রিয়াকরণে বিরতি দেয় এবং আগে যোগ করা Debug Watch কনফিগারেশনের সাথে চালানো এবং ডিবাগ করা শুরু করুন । অ্যাপ্লিকেশনটি এখন চলছে এবং 9000 পোর্টে HTTP অনুরোধের জন্য শুনছে।

      

      চিত্র 3. অ্যাপ্লিকেশনটি চলছে এবং 9000 পোর্টে HTTP অনুরোধের জন্য শুনছে।

2. আপনার স্থানীয় পরিবেশে ngrok অ্যাপ্লিকেশন চালু করুন:

   ngrok http --domain=NGROK_STATIC_DOMAIN 9000
   

   আপনার ngrok অ্যাকাউন্টের স্ট্যাটিক ডোমেন দিয়ে NGROK_STATIC_DOMAIN প্রতিস্থাপন করুন। সমস্ত অনুরোধ এখন আপনার স্থানীয় পরিবেশ এবং অ্যাপ্লিকেশন দ্বারা ব্যবহৃত পোর্টে পুনঃনির্দেশিত হয়।

   

   চিত্র 4. ngrok সার্ভার চলমান এবং পুনঃনির্দেশ সহ টার্মিনাল।

3. ngrok অ্যাপ্লিকেশন দ্বারা আপনার লোকালহোস্টে একটি ওয়েব ইন্টারফেসও শুরু হয়েছে, আপনি এটি একটি ব্রাউজারে খোলার মাধ্যমে সমস্ত ক্রিয়াকলাপ নিরীক্ষণ করতে পারেন।

   

   চিত্র 5. ngrok অ্যাপ্লিকেশন দ্বারা হোস্ট করা ওয়েব ইন্টারফেসটিতে কোনো HTTP অনুরোধ নেই।

4. একটি পরীক্ষক অ্যাকাউন্টের সাথে একটি নতুন Google ডক-এ একটি কেস ইউআরএল প্রিভিউ করে আপনার Google Workspace অ্যাড-অন পরীক্ষা করুন:

   • একটি নতুন Google ডক তৈরি করুন৷

     একটি নতুন Google ডক তৈরি করুন৷

   • নিম্নলিখিত লিঙ্কটি টাইপ করুন এবং enter টিপুন:

     https://example.com/support/case/?name=Name1&description=Description1&priority=P1
     

   • লিঙ্কটিতে ক্লিক করুন.

5. আপনার স্থানীয় পরিবেশে Visual Studio Code , আপনি দেখতে পাচ্ছেন যে ব্রেকপয়েন্ট সেট করা হয়েছিল সেখানে এক্সিকিউশনটি থামানো হয়েছে।

   

   চিত্র 6. যে ব্রেকপয়েন্ট সেট করা হয়েছিল সেখানে এক্সিকিউশন থামানো হয়েছে।

6. আপনি যখন Google Workspace অ্যাড-অনগুলির সময় শেষ হওয়ার আগে Visual Studio Code ডিবাগার থেকে এক্সিকিউশন পুনরায় শুরু করেন তখন Google Workspace অ্যাড-অন ক্যাশে থেকে Google ডক-এ লিঙ্কের প্রিভিউ দেখায়।

7. আপনি আপনার স্থানীয় পরিবেশে ngrok অ্যাপ্লিকেশন দ্বারা হোস্ট করা ওয়েব ইন্টারফেস থেকে HTTP অনুরোধ এবং প্রতিক্রিয়া লগগুলি পরীক্ষা করতে পারেন।

   

   চিত্র 7. ngrok অ্যাপ্লিকেশন দ্বারা হোস্ট করা ওয়েব ইন্টারফেস থেকে HTTP অনুরোধ।

8. অ্যাপ্লিকেশন আচরণ পরিবর্তন করতে, Case এর সাথে Case প্রতিস্থাপন করুন Case: main.py ফাইলের ইনলাইন 56 । আপনি যখন ফাইলটি সংরক্ষণ করেন, Visual Studio Code স্বয়ংক্রিয়ভাবে আপডেট হওয়া সোর্স কোডের সাথে অ্যাপ্লিকেশনটিকে পুনরায় লোড করে এবং ডিবাগ মোডে থাকে।

   

   চিত্র 8. কোড পরিবর্তন লোড সহ পোর্ট 9000 -এ অ্যাপ্লিকেশনটি চলছে এবং HTTP অনুরোধের জন্য শুনছে।

9. এইবার, লিঙ্কে ক্লিক করার পরিবর্তে এবং একটি নতুন Google ডক-এ কয়েক সেকেন্ড অপেক্ষা করার পরিবর্তে, আপনি আপনার স্থানীয় পরিবেশে ngrok অ্যাপ্লিকেশন দ্বারা হোস্ট করা ওয়েব ইন্টারফেসে লগ করা শেষ HTTP অনুরোধটি নির্বাচন করতে পারেন এবং Replay ক্লিক করতে পারেন। গতবারের মতোই, আপনার Google Workspace অ্যাড-অন উত্তর দেয় না কারণ এটি সক্রিয়ভাবে ডিবাগ করা হচ্ছে।

10. আপনি যখন Visual Studio Code ডিবাগার থেকে এক্সিকিউশন পুনরায় শুরু করেন তখন আপনি আপনার স্থানীয় পরিবেশে ngrok অ্যাপ্লিকেশন দ্বারা হোস্ট করা ওয়েব ইন্টারফেস থেকে দেখতে পারেন যে অ্যাপ্লিকেশনটি প্রিভিউ কার্ডের আপডেট হওয়া সংস্করণের সাথে একটি প্রতিক্রিয়া তৈরি করে।

জাভা

1. আপনার স্থানীয় পরিবেশে ইনস্টল করা Visual Studio Code IDE থেকে, নিম্নলিখিতগুলি করুন:

   1. একটি নতুন উইন্ডোতে, add-ons-samples/java/3p-resources ফোল্ডারটি খুলুন।

   2. pom.xml ফাইলে ক্লাউড ফাংশন ফ্রেমওয়ার্ক বিল্ড প্লাগইন function-maven-plugin যোগ করে স্থানীয়ভাবে পোর্ট 9000 -এ CreateLinkPreview অ্যাপ্লিকেশন চালানোর জন্য Maven প্রকল্পটি কনফিগার করুন:

      ...
      <plugin>
          <groupId>com.google.cloud.functions</groupId>
          <artifactId>function-maven-plugin</artifactId>
          <version>0.11.0</version>
          <configuration>
              <functionTarget>CreateLinkPreview</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. একটি ব্রেকপয়েন্ট যোগ করুন যা CreateLinkPreview.java ফাইলে HTTP অনুরোধ প্রক্রিয়াকরণে বিরতি দেয়, এবং আগে যোগ করা Remote Debug Watch কনফিগারেশনের সাথে সংযুক্ত করা এবং ডিবাগ করা শুরু করুন । অ্যাপ্লিকেশনটি এখন চলছে এবং 9000 পোর্টে HTTP অনুরোধের জন্য শুনছে।

      

      চিত্র 3. সে অ্যাপ্লিকেশন চলছে এবং 9000 পোর্টে HTTP অনুরোধের জন্য শুনছে।

2. আপনার স্থানীয় পরিবেশে ngrok অ্যাপ্লিকেশন চালু করুন:

   ngrok http --domain=NGROK_STATIC_DOMAIN 9000
   

   আপনার ngrok অ্যাকাউন্টের স্ট্যাটিক ডোমেন দিয়ে NGROK_STATIC_DOMAIN প্রতিস্থাপন করুন। সমস্ত অনুরোধ এখন আপনার স্থানীয় পরিবেশ এবং অ্যাপ্লিকেশন দ্বারা ব্যবহৃত পোর্টে পুনঃনির্দেশিত হয়।

   

   চিত্র 4. ngrok সার্ভার চলমান এবং পুনঃনির্দেশ সহ টার্মিনাল।

3. ngrok অ্যাপ্লিকেশন দ্বারা আপনার লোকালহোস্টে একটি ওয়েব ইন্টারফেসও শুরু হয়েছে, আপনি এটি একটি ব্রাউজারে খোলার মাধ্যমে সমস্ত ক্রিয়াকলাপ নিরীক্ষণ করতে পারেন।

   

   চিত্র 5. ngrok অ্যাপ্লিকেশন দ্বারা হোস্ট করা ওয়েব ইন্টারফেসটিতে কোনো HTTP অনুরোধ নেই।

4. একটি পরীক্ষক অ্যাকাউন্টের সাথে একটি নতুন Google ডক-এ একটি কেস ইউআরএল প্রিভিউ করে আপনার Google Workspace অ্যাড-অন পরীক্ষা করুন:

   • একটি নতুন Google ডক তৈরি করুন৷

     একটি নতুন Google ডক তৈরি করুন৷

   • নিম্নলিখিত লিঙ্কটি টাইপ করুন এবং enter টিপুন:

     https://example.com/support/case/?name=Name1&description=Description1&priority=P1
     

   • লিঙ্কটিতে ক্লিক করুন.

5. আপনার স্থানীয় পরিবেশে Visual Studio Code , আপনি দেখতে পাচ্ছেন যে ব্রেকপয়েন্ট সেট করা হয়েছিল সেখানে এক্সিকিউশনটি থামানো হয়েছে।

   

   চিত্র 6. যে ব্রেকপয়েন্ট সেট করা হয়েছিল সেখানে এক্সিকিউশন থামানো হয়েছে।

6. আপনি যখন Google Workspace অ্যাড-অনগুলির সময় শেষ হওয়ার আগে Visual Studio Code ডিবাগার থেকে এক্সিকিউশন পুনরায় শুরু করেন তখন Google Workspace অ্যাড-অন ক্যাশে থেকে Google ডক-এ লিঙ্কের প্রিভিউ দেখায়।

7. আপনি আপনার স্থানীয় পরিবেশে ngrok অ্যাপ্লিকেশন দ্বারা হোস্ট করা ওয়েব ইন্টারফেস থেকে HTTP অনুরোধ এবং প্রতিক্রিয়া লগগুলি পরীক্ষা করতে পারেন।

   

   চিত্র 7. ngrok অ্যাপ্লিকেশন দ্বারা হোস্ট করা ওয়েব ইন্টারফেস থেকে HTTP অনুরোধ।

8. অ্যাপ্লিকেশন আচরণ পরিবর্তন করতে, Case এর সাথে Case প্রতিস্থাপন করুন Case: CreateLinkPreview.java ফাইলের ইনলাইন 78 , mvnDebug প্রক্রিয়া পুনরায় চালু করুন এবং পুনরায় সংযুক্ত করতে এবং ডিবাগিং পুনরায় চালু করতে Remote Debug Watch পুনরায় চালু করুন।

9. এইবার, লিঙ্কে ক্লিক করার পরিবর্তে এবং একটি নতুন Google ডক-এ কয়েক সেকেন্ড অপেক্ষা করার পরিবর্তে, আপনি আপনার স্থানীয় পরিবেশে ngrok অ্যাপ্লিকেশন দ্বারা হোস্ট করা ওয়েব ইন্টারফেসে লগ করা শেষ HTTP অনুরোধটি নির্বাচন করতে পারেন এবং Replay ক্লিক করতে পারেন। গতবারের মতোই, আপনার Google Workspace অ্যাড-অন উত্তর দেয় না কারণ এটি সক্রিয়ভাবে ডিবাগ করা হচ্ছে।

10. আপনি যখন Visual Studio Code ডিবাগার থেকে এক্সিকিউশন পুনরায় শুরু করেন তখন আপনি আপনার স্থানীয় পরিবেশে ngrok অ্যাপ্লিকেশন দ্বারা হোস্ট করা ওয়েব ইন্টারফেস থেকে দেখতে পারেন যে অ্যাপ্লিকেশনটি প্রিভিউ কার্ডের আপডেট হওয়া সংস্করণের সাথে একটি প্রতিক্রিয়া তৈরি করে।

দূরবর্তী পরিবেশ থেকে ডিবাগ করুন

এই বিভাগে, আপনি আপনার Google Workspace অ্যাড-অনের সাথে ইন্টারঅ্যাক্ট করেন যা দূরবর্তী পরিবেশে কার্যকর হয়।

চিত্র 9. দূরবর্তী পরিবেশ থেকে ডিবাগ করুন।

পূর্বশর্ত

• আপনার Google Workspace অ্যাড-অন স্থাপন এবং ইনস্টল করা হয়েছে।
• আপনার অ্যাপ্লিকেশনটি একটি প্রদত্ত পোর্টে ডিবাগার সক্ষম করে আপনার দূরবর্তী পরিবেশে চলছে, এই গাইডের নির্দেশাবলীতে এটিকে REMOTE_DEBUG_PORT হিসাবে উল্লেখ করা হয়েছে৷
• আপনার স্থানীয় পরিবেশ আপনার দূরবর্তী পরিবেশে ssh করতে পারে।
• আপনার স্থানীয় পরিবেশে একটি IDE সেট আপ যা ডিবাগ করতে পারে। আমরা চিত্রের উদ্দেশ্যে এই নির্দেশিকায় Visual Studio Code IDE এবং এর ডিফল্ট ডিবাগিং বৈশিষ্ট্যগুলি ব্যবহার করি।

আপনার স্থানীয় এবং দূরবর্তী পরিবেশের সাথে সংযোগ করুন

আপনার স্থানীয় পরিবেশে যেখানে আপনি একটি ডিবাগ ক্লায়েন্ট সংযোগ শুরু করতে চান, একটি SSH টানেল সেট আপ করুন:

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
       }]
   }
   

   পাইথন

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

   জাভা

   {
       "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 কনফিগারেশনের সাথে চলমান এবং ডিবাগ করা শুরু করুন ।

আপনার ইনস্টল করা Google Workspace অ্যাড-অনের সাথে ইন্টারঅ্যাক্ট করুন। আপনার Google Workspace অ্যাড-অন উত্তর দিচ্ছে না কারণ এটি Visual Studio Code IDE-তে সক্রিয়ভাবে ডিবাগ করা হচ্ছে।

সম্পর্কিত বিষয়

কিভাবে ত্রুটি লগ জিজ্ঞাসা করতে শিখুন.