افزونه های HTTP Google Workspace را آزمایش و اشکال زدایی کنید

به عنوان یک توسعه‌دهنده افزونه Google Workspace، ممکن است برای آزمایش تغییرات یا عیب‌یابی مشکلات پیچیده، نیاز به اشکال‌زدایی کد داشته باشید. اشکال‌زدایی افزونه‌های Google Workspace می‌تواند به روش‌های مختلفی انجام شود که بستگی به معماری برنامه، عملکرد برنامه، نحوه استقرار برنامه و تنظیمات برگزیده شما دارد.

این صفحه نحوه اشکال‌زدایی افزونه HTTP Google Workspace را با استفاده از ngrok توضیح می‌دهد، که یک پلتفرم یکپارچه برای ورود به سیستم است و می‌توانید از آن برای آزمایش محیط‌های توسعه محلی استفاده کنید. در این راهنما، تغییرات کد را در یک محیط محلی آزمایش می‌کنید و مشکلات را در یک محیط از راه دور عیب‌یابی می‌کنید.

اشکال‌زدایی از محیط توسعه محلی

در این بخش، شما با افزونه‌ی Google Workspace خود که در محیط محلی شما اجرا می‌شود، تعامل می‌کنید.

شکل ۱. اشکال‌زدایی در یک محیط توسعه محلی.

پیش‌نیازها

نود جی اس

• آخرین نسخه‌های node و npm که در محیط محلی شما نصب شده باشند .

• آخرین نسخه nodemon در محیط محلی شما نصب شده است . این نسخه برای اهداف بارگذاری مجدد خودکار استفاده می‌شود:

  npm install -g nodemon

• یک پروژه گوگل کلود . می‌توانید بخش‌های «پیش‌نیازها» و «تنظیم محیط» را از راهنمای شروع سریع دنبال کنید.

• کد افزونه‌ی Google Workspace برای اشکال‌زدایی در محیط محلی شما. ما در این راهنما از ویژگی‌های لینک پیش‌نمایش از نمونه کد 3p-resources از مخزن گیت‌هاب googleworkspace/add-ons-samples برای اهداف نمایشی استفاده می‌کنیم.

• یک IDE که در محیط محلی شما تنظیم شده باشد و بتواند اشکال‌زدایی کند. ما در این راهنما از IDE Visual Studio Code و ویژگی‌های اشکال‌زدایی پیش‌فرض آن برای اهداف توضیحی استفاده می‌کنیم.

• یک حساب کاربری ngrok .

• آخرین نسخه gcloud نصب و در محیط محلی شما راه‌اندازی شده است .

پایتون

• آخرین نسخه python3 در محیط محلی شما نصب شده باشد .
• آخرین نسخه pip و virtualenv که در محیط محلی شما نصب شده باشند. این دو به ترتیب برای مدیریت بسته‌های پایتون و محیط‌های مجازی استفاده می‌شوند.
• یک پروژه گوگل کلود . می‌توانید بخش‌های «پیش‌نیازها» و «تنظیم محیط» را از راهنمای شروع سریع دنبال کنید.
• کد افزونه‌ی Google Workspace برای اشکال‌زدایی در محیط محلی شما. ما در این راهنما از ویژگی‌های لینک پیش‌نمایش از نمونه کد 3p-resources از مخزن گیت‌هاب googleworkspace/add-ons-samples برای اهداف نمایشی استفاده می‌کنیم.
• یک IDE که در محیط محلی شما تنظیم شده باشد و بتواند اشکال‌زدایی کند. ما در این راهنما از IDE Visual Studio Code و ویژگی‌های اشکال‌زدایی پیش‌فرض آن برای اهداف توضیحی استفاده می‌کنیم.
• یک حساب کاربری ngrok .
• آخرین نسخه gcloud نصب و در محیط محلی شما راه‌اندازی شده است .

جاوا

• آخرین نسخه پایدار Java SE 11's JDK که در محیط محلی شما نصب شده باشد .
• آخرین نسخه Apache Maven که در محیط محلی شما نصب شده باشد . از آن برای مدیریت پروژه‌های جاوا استفاده می‌شود.
• یک پروژه گوگل کلود . می‌توانید بخش‌های «پیش‌نیازها» و «تنظیم محیط» را از راهنمای شروع سریع دنبال کنید.
• کد افزونه‌ی Google Workspace برای اشکال‌زدایی در محیط محلی شما. ما در این راهنما از ویژگی‌های لینک پیش‌نمایش از نمونه کد 3p-resources از مخزن گیت‌هاب googleworkspace/add-ons-samples برای اهداف نمایشی استفاده می‌کنیم.
• یک IDE که در محیط محلی شما تنظیم شده باشد و بتواند اشکال‌زدایی کند. ما در این راهنما از IDE Visual Studio Code و ویژگی‌های اشکال‌زدایی پیش‌فرض آن برای اهداف توضیحی استفاده می‌کنیم.
• یک حساب کاربری ngrok .
• آخرین نسخه gcloud نصب و در محیط محلی شما راه‌اندازی شده است .

سرویس localhost را به صورت عمومی در دسترس قرار دهید

شما باید محیط محلی خود را به اینترنت متصل کنید تا افزونه Google Workspace بتواند به آن دسترسی داشته باشد. برنامه ngrok برای هدایت درخواست‌های HTTP ارسال شده به یک URL عمومی به محیط محلی شما استفاده می‌شود.

1. در یک مرورگر در محیط محلی خود، به حساب ngrok خود وارد شوید.
2. برنامه را نصب کنید و authtoken خود را در محیط محلی خود تنظیم کنید.
3. یک دامنه استاتیک در حساب ngrok خود ایجاد کنید ، در دستورالعمل‌های این راهنما به آن NGROK_STATIC_DOMAIN گفته می‌شود.

ایجاد و نصب افزونه

1. افزونه‌ی Google Workspace را طوری پیکربندی کنید که تمام درخواست‌های HTTP خود را به دامنه‌ی ثابت شما ارسال کند. فایل استقرار شما باید شبیه به شکل زیر باشد:

   {
     "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"
           }
         ]
       },
       "httpOptions": {
         "granularOauthPermissionSupport": "OPT_IN"
       }
     }
   }
   

   NGROK_STATIC_DOMAIN با دامنه استاتیک در حساب ngrok خود جایگزین کنید.

2. پروژه Google Cloud را برای استفاده تنظیم کنید:

   gcloud config set project PROJECT_ID

3. اعتبارنامه‌های کاربر جدید را برای استفاده در اعتبارنامه‌های پیش‌فرض برنامه دریافت کنید:

   gcloud auth application-default login

   به جای PROJECT_ID ، شناسه پروژه مربوط به پروژه Google Cloud مربوط به برنامه را وارد کنید.

4. استقرار را ایجاد کنید:

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

   DEPLOYMENT_FILE_PATH با مسیر فایل نصب خود جایگزین کنید.

5. نصب استقرار:

   gcloud workspace-add-ons deployments install manageSupportCases

   

   شکل ۲. افزونه‌ی Google Workspace تمام درخواست‌های HTTP خود را به دامنه‌ی استاتیک ارسال می‌کند. سرویس عمومی `ngrok` به عنوان پلی بین افزونه‌ی Google Workspace و کد برنامه‌ای که به صورت محلی اجرا می‌شود، عمل می‌کند.

افزونه‌ی Google Workspace را آزمایش کنید

می‌توانید افزونه‌ی Google Workspace خود را به‌صورت محلی مستقر، آزمایش، اشکال‌زدایی و به‌طور خودکار بارگذاری مجدد کنید.

توجه: افزونه‌ی Google Workspace با چارچوب توابع Cloud Run در مثال‌ها اجرا می‌شود.

نود جی اس

1. از IDE Visual Studio Code نصب شده در محیط محلی خود، موارد زیر را انجام دهید:

   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. یک نقطه توقف (breakpoint) که پردازش درخواست HTTP را متوقف می‌کند در فایل index.js اضافه کنید و با پیکربندی Debug Watch که قبلاً اضافه شده است، اجرا و اشکال‌زدایی را شروع کنید . اکنون برنامه در حال اجرا است و به درخواست‌های HTTP روی پورت 9000 گوش می‌دهد.

      

      شکل ۳. برنامه در حال اجرا و گوش دادن به درخواست‌های HTTP روی پورت 9000 است.

2. برنامه ngrok را در محیط محلی خود اجرا کنید:

   ngrok http --domain=NGROK_STATIC_DOMAIN 9000

   NGROK_STATIC_DOMAIN با دامنه استاتیک در حساب ngrok خود جایگزین کنید. اکنون همه درخواست‌ها به محیط محلی شما و پورت مورد استفاده برنامه هدایت می‌شوند.

   

   شکل ۴. ترمینالی که سرور ngrok در آن در حال اجرا و هدایت است.

3. یک رابط وب نیز توسط برنامه ngrok روی میزبان محلی شما آغاز می‌شود. می‌توانید با باز کردن آن در مرورگر، تمام فعالیت‌ها را زیر نظر داشته باشید.

   

   شکل ۵. رابط وب میزبانی‌شده توسط برنامه ngrok که هیچ درخواست HTTP را نشان نمی‌دهد.

4. افزونه‌ی Google Workspace خود را با پیش‌نمایش URL یک پرونده در یک سند گوگل جدید با یک حساب آزمایشی آزمایش کنید:

   • یک سند گوگل ایجاد کنید.

     یک سند گوگل ایجاد کنید

   • لینک زیر را تایپ کنید و enter بزنید:

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

   • روی لینک کلیک کنید.

5. در Visual Studio Code در محیط محلی خود، می‌توانید ببینید که اجرا در نقطه توقفی که تنظیم شده بود، متوقف شده است.

   

   شکل ۶. اجرا در نقطه توقفی که تنظیم شده بود، متوقف می‌شود.

6. وقتی قبل از اتمام زمان افزونه‌های Google Workspace، اجرا را از دیباگر Visual Studio Code از سر می‌گیرید، افزونه Google Workspace پیش‌نمایش لینک را در Google Doc از حافظه پنهان نمایش می‌دهد.

7. می‌توانید گزارش‌های درخواست و پاسخ HTTP را از رابط وب میزبانی‌شده توسط برنامه ngrok در محیط محلی خود بررسی کنید.

   

   شکل ۷. درخواست HTTP از رابط وب میزبانی شده توسط برنامه ngrok .

8. برای تغییر رفتار برنامه، در خط 51 از فایل index.js ، Case با Case: جایگزین کنید. وقتی فایل را ذخیره می‌کنید، nodemon به طور خودکار برنامه را با کد منبع به‌روزرسانی‌شده مجدداً بارگذاری می‌کند و Visual Studio Code در حالت اشکال‌زدایی باقی می‌ماند.

   

   شکل ۸. برنامه در حال اجرا است و به درخواست‌های HTTP روی پورت 9000 گوش می‌دهد و کد تغییر یافته بارگذاری شده است.

9. این بار، به جای کلیک روی لینک و انتظار چند ثانیه‌ای در یک سند گوگل جدید، می‌توانید آخرین درخواست HTTP ثبت‌شده در رابط وب میزبانی‌شده توسط برنامه ngrok در محیط محلی خود را انتخاب کرده و روی Replay کلیک کنید. همانند دفعه قبل، افزونه Google Workspace شما پاسخی نمی‌دهد زیرا به‌طور فعال در حال اشکال‌زدایی است.

10. وقتی اجرا را از طریق دیباگر Visual Studio Code از سر می‌گیرید، می‌توانید از رابط وب میزبانی شده توسط برنامه ngrok در محیط محلی خود مشاهده کنید که برنامه پاسخی با نسخه به‌روز شده کارت پیش‌نمایش تولید می‌کند.

پایتون

1. از IDE Visual Studio Code نصب شده در محیط محلی خود، موارد زیر را انجام دهید:

   1. در یک پنجره جدید، پوشه add-ons-samples/python/3p-resources/create_link_preview را باز کنید.

   2. یک محیط مجازی برای پایتون 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", "create_link_preview",
                  "--port", "9000",
                  "--debug"
              ]
          }]
      }
      

   5. یک نقطه توقف (breakpoint) که پردازش درخواست HTTP را متوقف می‌کند در فایل main.py اضافه کنید و با پیکربندی Debug Watch که قبلاً اضافه شده است، اجرا و اشکال‌زدایی را شروع کنید . اکنون برنامه در حال اجرا است و به درخواست‌های HTTP روی پورت 9000 گوش می‌دهد.

      

      شکل ۳. برنامه در حال اجرا و گوش دادن به درخواست‌های HTTP روی پورت 9000 است.

2. برنامه ngrok را در محیط محلی خود اجرا کنید:

   ngrok http --domain=NGROK_STATIC_DOMAIN 9000

   NGROK_STATIC_DOMAIN با دامنه استاتیک در حساب ngrok خود جایگزین کنید. اکنون همه درخواست‌ها به محیط محلی شما و پورت مورد استفاده برنامه هدایت می‌شوند.

   

   شکل ۴. ترمینالی که سرور ngrok در آن در حال اجرا و هدایت است.

3. یک رابط وب نیز توسط برنامه ngrok روی میزبان محلی شما آغاز می‌شود. با باز کردن آن در یک مرورگر، تمام فعالیت‌ها را زیر نظر داشته باشید.

   

   شکل ۵. رابط وب میزبانی‌شده توسط برنامه ngrok که هیچ درخواست HTTP را نشان نمی‌دهد.

4. افزونه‌ی Google Workspace خود را با پیش‌نمایش URL یک پرونده در یک سند گوگل جدید با یک حساب آزمایشی آزمایش کنید:

   • یک سند گوگل ایجاد کنید.

     یک سند گوگل ایجاد کنید

   • لینک زیر را تایپ کنید و enter بزنید:

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

   • روی لینک کلیک کنید.

5. در Visual Studio Code در محیط محلی خود، می‌توانید ببینید که اجرا در نقطه توقفی که تنظیم شده بود، متوقف شده است.

   

   شکل ۶. اجرا در نقطه توقفی که تنظیم شده بود، متوقف می‌شود.

6. وقتی قبل از اتمام زمان افزونه‌های Google Workspace، اجرا را از دیباگر Visual Studio Code از سر می‌گیرید، افزونه Google Workspace پیش‌نمایش لینک را در Google Doc از حافظه پنهان نمایش می‌دهد.

7. می‌توانید گزارش‌های درخواست و پاسخ HTTP را از رابط وب میزبانی‌شده توسط برنامه ngrok در محیط محلی خود بررسی کنید.

   

   شکل ۷. درخواست HTTP از رابط وب میزبانی شده توسط برنامه ngrok .

8. برای تغییر رفتار برنامه، در خط 56 فایل main.py ، Case با Case: جایگزین کنید. وقتی فایل را ذخیره می‌کنید، Visual Studio Code به طور خودکار برنامه را با کد منبع به‌روزرسانی‌شده مجدداً بارگذاری می‌کند و در حالت اشکال‌زدایی باقی می‌ماند.

   

   شکل ۸. برنامه در حال اجرا است و به درخواست‌های HTTP روی پورت 9000 گوش می‌دهد و کد تغییر یافته بارگذاری شده است.

9. این بار، به جای کلیک روی لینک و انتظار چند ثانیه‌ای در یک سند گوگل جدید، می‌توانید آخرین درخواست HTTP ثبت‌شده در رابط وب میزبانی‌شده توسط برنامه ngrok در محیط محلی خود را انتخاب کرده و روی Replay کلیک کنید. همانند دفعه قبل، افزونه Google Workspace شما پاسخی نمی‌دهد زیرا به‌طور فعال در حال اشکال‌زدایی است.

10. وقتی اجرا را از طریق دیباگر Visual Studio Code از سر می‌گیرید، می‌توانید از رابط وب میزبانی شده توسط برنامه ngrok در محیط محلی خود مشاهده کنید که برنامه پاسخی با نسخه به‌روز شده کارت پیش‌نمایش تولید می‌کند.

جاوا

1. از IDE Visual Studio Code نصب شده در محیط محلی خود، موارد زیر را انجام دهید:

   1. در یک پنجره جدید، پوشه add-ons-samples/java/3p-resources را باز کنید.

   2. پروژه Maven را طوری پیکربندی کنید که برنامه CreateLinkPreview به صورت محلی روی پورت 9000 اجرا کند، برای این کار کافیست افزونه ساخت Cloud Functions Framework به نام function-maven-plugin به فایل pom.xml اضافه کنید:

      ...
      <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. اکنون می‌توانید آن را به صورت محلی در حالت اشکال‌زدایی (debug mode) اجرا کنید:

      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. یک نقطه توقف (breakpoint) که پردازش درخواست HTTP را متوقف می‌کند، در فایل CreateLinkPreview.java اضافه کنید و با پیکربندی Remote Debug Watch که قبلاً اضافه شده بود، شروع به اتصال و اشکال‌زدایی کنید . اکنون برنامه در حال اجرا است و به درخواست‌های HTTP روی پورت 9000 گوش می‌دهد.

      

      شکل ۳. برنامه در حال اجرا و گوش دادن به درخواست‌های HTTP روی پورت 9000 است.

2. برنامه ngrok را در محیط محلی خود اجرا کنید:

   ngrok http --domain=NGROK_STATIC_DOMAIN 9000

   NGROK_STATIC_DOMAIN با دامنه استاتیک در حساب ngrok خود جایگزین کنید. اکنون همه درخواست‌ها به محیط محلی شما و پورت مورد استفاده برنامه هدایت می‌شوند.

   

   شکل ۴. ترمینالی که سرور ngrok در آن در حال اجرا و هدایت است.

3. یک رابط وب نیز توسط برنامه ngrok روی میزبان محلی شما آغاز می‌شود. با باز کردن آن در یک مرورگر، تمام فعالیت‌ها را زیر نظر داشته باشید.

   

   شکل ۵. رابط وب میزبانی‌شده توسط برنامه ngrok که هیچ درخواست HTTP را نشان نمی‌دهد.

4. افزونه‌ی Google Workspace خود را با پیش‌نمایش URL یک پرونده در یک سند گوگل جدید با یک حساب آزمایشی آزمایش کنید:

   • یک سند گوگل ایجاد کنید.

     یک سند گوگل ایجاد کنید

   • لینک زیر را تایپ کنید و enter بزنید:

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

   • روی لینک کلیک کنید.

5. در Visual Studio Code در محیط محلی خود، می‌توانید ببینید که اجرا در نقطه توقفی که تنظیم شده بود، متوقف شده است.

   

   شکل ۶. اجرا در نقطه توقفی که تنظیم شده بود، متوقف می‌شود.

6. وقتی قبل از اتمام زمان افزونه‌های Google Workspace، اجرا را از دیباگر Visual Studio Code از سر می‌گیرید، افزونه Google Workspace پیش‌نمایش لینک را در Google Doc از حافظه پنهان نمایش می‌دهد.

7. می‌توانید گزارش‌های درخواست و پاسخ HTTP را از رابط وب میزبانی‌شده توسط برنامه ngrok در محیط محلی خود بررسی کنید.

   

   شکل ۷. درخواست HTTP از رابط وب میزبانی شده توسط برنامه ngrok .

8. برای تغییر رفتار برنامه، در خط 78 فایل CreateLinkPreview.java ، Case با Case: جایگزین کنید، فرآیند mvnDebug را مجدداً راه‌اندازی کنید و Remote Debug Watch مجدداً راه‌اندازی کنید تا اشکال‌زدایی دوباره متصل و از سر گرفته شود .

9. این بار، به جای کلیک روی لینک و انتظار چند ثانیه‌ای در یک سند گوگل جدید، می‌توانید آخرین درخواست HTTP ثبت‌شده در رابط وب میزبانی‌شده توسط برنامه ngrok در محیط محلی خود را انتخاب کرده و روی Replay کلیک کنید. همانند دفعه قبل، افزونه Google Workspace شما پاسخی نمی‌دهد زیرا به‌طور فعال در حال اشکال‌زدایی است.

10. وقتی اجرا را از طریق دیباگر Visual Studio Code از سر می‌گیرید، می‌توانید از رابط وب میزبانی شده توسط برنامه ngrok در محیط محلی خود مشاهده کنید که برنامه پاسخی با نسخه به‌روز شده کارت پیش‌نمایش تولید می‌کند.

اشکال‌زدایی از محیط راه دور

در این بخش، شما با افزونه‌ی Google Workspace خود که در یک محیط از راه دور اجرا می‌شود، تعامل می‌کنید.

شکل ۹. اشکال‌زدایی از محیط راه دور.

پیش‌نیازها

• افزونه‌ی Google Workspace شما نصب و راه‌اندازی شد.
• برنامه شما در محیط راه دور شما با دیباگر فعال روی پورت مشخص اجرا می‌شود و در دستورالعمل‌های این راهنما به عنوان REMOTE_DEBUG_PORT ارجاع داده شده است.
• محیط محلی شما می‌تواند از ssh به محیط راه دور شما متصل شود.
• یک IDE در محیط محلی شما تنظیم شده است که می‌تواند اشکال‌زدایی کند. ما در این راهنما از IDE Visual Studio Code و ویژگی‌های اشکال‌زدایی پیش‌فرض آن برای اهداف توضیحی استفاده می‌کنیم.

محیط‌های محلی و راه دور خود را به هم متصل کنید

در محیط محلی خود، از جایی که می‌خواهید اتصال کلاینت اشکال‌زدایی را آغاز کنید، یک تونل SSH راه‌اندازی کنید:

ssh -L LOCAL_DEBUG_PORT:localhost:REMOTE_DEBUG_PORT REMOTE_USERNAME@REMOTE_ADDRESS

موارد زیر را جایگزین کنید:

• LOCAL_DEBUG_PORT : پورت اشکال‌زدایی در محیط محلی شما.
• REMOTE_USERNAME : نام کاربری در محیط راه دور شما.
• REMOTE_ADDRESS : آدرس محیط راه دور شما.
• REMOTE_DEBUG_PORT : پورت اشکال‌زدایی در محیط راه دور شما.

پورت اشکال‌زدایی در محیط محلی شما اکنون به پورت اشکال‌زدایی در محیط راه دور شما مرتبط شده است.

شروع اشکال‌زدایی

از IDE Visual Studio Code نصب شده در محیط محلی خود، موارد زیر را انجام دهید:

1. در یک پنجره جدید، کد منبع برنامه خود را باز کنید.

2. فایل .vscode/launch.json را در دایرکتوری ریشه ایجاد کنید و یک راه‌اندازی به نام Debug Remote پیکربندی کنید که به پورت اشکال‌زدایی در محیط محلی شما متصل شود:

   نود جی اس

   {
       "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 در حال اشکال‌زدایی است.

مباحث مرتبط

• یاد بگیرید چگونه گزارش‌های خطا را جستجو کنید .