בדיקה וניפוי באגים של תוספים ל-Google Workspace מסוג HTTP

אם אתם מפתחים תוספים ל-Google Workspace, יכול להיות שתצטרכו לנפות באגים בקוד כדי לבדוק שינויים או לפתור בעיות מורכבות. אפשר לבצע ניפוי באגים בתוספים ל-Google Workspace בדרכים שונות, בהתאם לארכיטקטורה של האפליקציה, לפעולות שהיא מבצעת, לאופן הפריסה שלה ולהעדפות שלכם.

בדף הזה מוסבר איך לנפות באגים בתוסף HTTP ל-Google Workspace באמצעות ngrok, פלטפורמת כניסה מאוחדת שבה אפשר להשתמש כדי לבדוק סביבות פיתוח מקומיות. במדריך הזה תבדקו שינויים בקוד בסביבה מקומית ותפתרו בעיות בסביבה מרוחקת.

ניפוי באגים מסביבת פיתוח מקומית

בקטע הזה, אתם מבצעים אינטראקציה עם התוסף שלכם ל-Google Workspace שפועל בסביבה המקומית.

ניפוי באגים בסביבת פיתוח מקומית.
איור 1. ניפוי באגים בסביבת פיתוח מקומית.

דרישות מוקדמות

Node.js

  • הגרסאות האחרונות של node ושל npm מותקנות בסביבה המקומית שלכם.
  • הגרסה האחרונה של nodemon מותקנת בסביבה המקומית. הוא משמש למטרות של הוספת כסף אוטומטית:

    npm install -g nodemon
  • פרויקט ב-Google Cloud. אפשר לפעול לפי הקטעים דרישות מוקדמות והגדרת הסביבה במדריך למתחילים.

  • הקוד של התוסף ל-Google Workspace שרוצים לנפות באגים בסביבה המקומית. במדריך הזה אנחנו משתמשים בתכונות של קישור לתצוגה מקדימה מתוך דוגמת הקוד 3p-resources ממאגר GitHub‏ googleworkspace/add-ons-samples לצורך המחשה.

  • סביבת פיתוח משולבת (IDE) שמוגדרת בסביבה המקומית שלכם ויכולה לבצע ניפוי באגים. במדריך הזה אנחנו משתמשים ב-Visual Studio Code IDE ובמאפייני ניפוי הבאגים שמוגדרים בו כברירת מחדל, לצורך המחשה.

  • חשבון ngrok.

  • הגרסה האחרונה של gcloud מותקנת ומאותחלת בסביבה המקומית.

Python

Java

הפיכת שירות 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. מקבלים פרטי כניסה חדשים של משתמש לשימוש ב-Application Default Credentials:

    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 שלו לדומיין הסטטי.
    איור 2. התוסף ל-Google Workspace שולח את כל בקשות ה-HTTP שלו לדומיין הסטטי. שירות ציבורי `ngrok` משמש כגשר בין התוסף ל-Google Workspace לבין קוד האפליקציה שמופעל באופן מקומי.

בדיקת התוסף ל-Google Workspace

אתם יכולים לפרוס, לבדוק, לנפות באגים ולטעון מחדש אוטומטית את התוסף שלכם ל-Google Workspace באופן מקומי.

Node.js

  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 שמפעילה את הסקריפט debug-watch על ידי יצירת הקובץ .vscode/launch.json בספריית השורש:

      {
          "version": "0.2.0",
          "configurations": [{
              "type": "node",
              "request": "launch",
              "name": "Debug Watch",
              "cwd": "${workspaceRoot}",
              "runtimeExecutable": "npm",
              "runtimeArgs": ["run-script", "debug-watch"]
          }]
      }
      
    5. מוסיפים נקודת עצירה שגורמת להשהיית העיבוד של בקשת ה-HTTP בקובץ index.js, ומתחילים להריץ ולבצע ניפוי באגים באמצעות ההגדרה Debug Watch שנוספה קודם. האפליקציה פועלת עכשיו ומאזינה לבקשות HTTP ביציאה 9000.

      האפליקציה פועלת ומאזינה לבקשות HTTP ביציאה 9000.
      איור 3. האפליקציה פועלת ומאזינה לבקשות HTTP ביציאה 9000.
  2. מפעילים את האפליקציה ngrok בסביבה המקומית:

    ngrok http --domain=NGROK_STATIC_DOMAIN 9000

    מחליפים את NGROK_STATIC_DOMAIN בדומיין הסטטי בחשבון ngrok. כל הבקשות מנותבות עכשיו לסביבה המקומית ולפורט שבו האפליקציה משתמשת.

    הטרמינל עם שרת ngrok שפועל ומבצע הפניה אוטומטית.
    איור 4. הטרמינל עם ngrok השרת שפועל ומפנה.
  3. ממשק אינטרנט מופעל גם ב-localhost על ידי האפליקציה ngrok. אפשר לעקוב אחרי כל הפעילויות על ידי פתיחת היומן בדפדפן.

    ממשק האינטרנט שמתארח באפליקציית ngrok ולא מוצגות בו בקשות HTTP.
    איור 5. ממשק האינטרנט שמתארח באפליקציית ngrok ולא מוצגות בו בקשות HTTP.
  4. כדי לבדוק את התוסף שלכם ל-Google Workspace, אתם יכולים להציג תצוגה מקדימה של כתובת URL של בקשה חדשה במסמך Google Docs חדש באמצעות חשבון בודק:

    • יוצרים מסמך ב-Google Docs.

      יצירת מסמך ב-Google Docs

    • מקלידים את הקישור הבא ומקישים על enter:

      https://example.com/support/case/?name=Name1&description=Description1&priority=P1
      
    • לוחצים על הקישור.

  5. ב-Visual Studio Code בסביבה המקומית, אפשר לראות שהביצוע מושהה בנקודת העצירה שהוגדרה.

    הביצוע מושהה בנקודת העצירה שהוגדרה.
    איור 6. הביצוע מושהה בנקודת העצירה שהוגדרה.
  6. כשממשיכים את ההפעלה מVisual Studio Codeמאבחן הבאגים לפני שפג הזמן הקצוב לתפוגה של תוספים ל-Google Workspace, התוסף ל-Google Workspace מציג את התצוגה המקדימה של הקישור במסמך Google Doc מהמטמון.

  7. אפשר לבדוק את היומנים של בקשות ותגובות HTTP מממשק האינטרנט שמארחת אפליקציית ngrok בסביבה המקומית.

    בקשת ה-HTTP מממשק האינטרנט שמתארח באפליקציית ngrok.
    איור 7. בקשת ה-HTTP מממשק האינטרנט שמתארח באפליקציה ngrok.
  8. כדי לשנות את אופן הפעולה של האפליקציה, מחליפים את Case ב-Case: בשורה 51 של index.js. כששומרים את הקובץ, nodemon טוען מחדש באופן אוטומטי את האפליקציה עם קוד המקור המעודכן, ו-Visual Studio Code נשאר במצב ניפוי באגים.

    האפליקציה פועלת ומאזינה לבקשות HTTP ביציאה 9000 עם שינוי הקוד שנטען.
    איור 8. האפליקציה פועלת ומאזינה לבקשות HTTP ביציאה 9000 עם שינוי הקוד שנטען.
  9. הפעם, במקום ללחוץ על הקישור ולהמתין כמה שניות במסמך Google חדש, אפשר לבחור את בקשת ה-HTTP האחרונה שנרשמה בממשק האינטרנט שאותו מארח אפליקציית ngrok בסביבה המקומית וללחוץ על Replay. כמו בפעם הקודמת, התוסף שלך ל-Google Workspace לא משיב כי הוא נמצא בתהליך ניפוי באגים.

  10. כשממשיכים את ההרצה מהמאבחן Visual Studio Code, אפשר לראות מממשק האינטרנט שמארחת אפליקציית ngrok בסביבה המקומית, שהאפליקציה יוצרת תגובה עם הגרסה המעודכנת של כרטיס התצוגה המקדימה.

Python

  1. בסביבת פיתוח משולבת (IDE) Visual Studio Code שהתקנתם בסביבה המקומית, מבצעים את הפעולות הבאות:

    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 שמפעילה את האפליקציה מהמודול 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. מוסיפים נקודת עצירה שגורמת להשהיית העיבוד של בקשת ה-HTTP בקובץ main.py, ומתחילים להריץ ולבצע ניפוי באגים באמצעות ההגדרה Debug Watch שנוספה קודם. האפליקציה פועלת עכשיו ומאזינה לבקשות HTTP ביציאה 9000.

      האפליקציה פועלת ומאזינה לבקשות HTTP ביציאה 9000.
      איור 3. האפליקציה פועלת ומאזינה לבקשות HTTP ביציאה 9000.
  2. מפעילים את האפליקציה ngrok בסביבה המקומית:

    ngrok http --domain=NGROK_STATIC_DOMAIN 9000

    מחליפים את NGROK_STATIC_DOMAIN בדומיין הסטטי בחשבון ngrok. כל הבקשות מנותבות עכשיו לסביבה המקומית ולפורט שבו האפליקציה משתמשת.

    הטרמינל עם שרת ngrok שפועל ומבצע הפניה אוטומטית.
    איור 4. הטרמינל עם ngrok השרת שפועל ומפנה.
  3. ממשק אינטרנט מופעל גם ב-localhost על ידי האפליקציה ngrok. כדי לעקוב אחרי כל הפעילויות, פותחים את הכלי בדפדפן.

    ממשק האינטרנט שמתארח באפליקציית ngrok ולא מוצגות בו בקשות HTTP.
    איור 5. ממשק האינטרנט שמתארח באפליקציית ngrok ולא מוצגות בו בקשות HTTP.
  4. כדי לבדוק את התוסף שלכם ל-Google Workspace, אתם יכולים להציג תצוגה מקדימה של כתובת URL של בקשה חדשה במסמך Google Docs חדש באמצעות חשבון בודק:

    • יוצרים מסמך ב-Google Docs.

      יצירת מסמך ב-Google Docs

    • מקלידים את הקישור הבא ומקישים על enter:

      https://example.com/support/case/?name=Name1&description=Description1&priority=P1
      
    • לוחצים על הקישור.

  5. ב-Visual Studio Code בסביבה המקומית, אפשר לראות שהביצוע מושהה בנקודת העצירה שהוגדרה.

    הביצוע מושהה בנקודת העצירה שהוגדרה.
    איור 6. הביצוע מושהה בנקודת העצירה שהוגדרה.
  6. כשממשיכים את ההפעלה מVisual Studio Codeמאבחן הבאגים לפני שפג הזמן הקצוב לתפוגה של תוספים ל-Google Workspace, התוסף ל-Google Workspace מציג את התצוגה המקדימה של הקישור במסמך Google Doc מהמטמון.

  7. אפשר לבדוק את היומנים של בקשות ותגובות HTTP מממשק האינטרנט שמארחת אפליקציית ngrok בסביבה המקומית.

    בקשת ה-HTTP מממשק האינטרנט שמתארח באפליקציית ngrok.
    איור 7. בקשת ה-HTTP מממשק האינטרנט שמתארח באפליקציה ngrok.
  8. כדי לשנות את התנהגות האפליקציה, מחליפים את Case ב-Case: בשורה 56 בקובץ main.py. כששומרים את הקובץ, Visual Studio Code האפליקציה נטענת מחדש באופן אוטומטי עם קוד המקור המעודכן, והיא נשארת במצב ניפוי באגים.

    האפליקציה פועלת ומאזינה לבקשות HTTP ביציאה 9000 עם שינוי הקוד שנטען.
    איור 8. האפליקציה פועלת ומאזינה לבקשות HTTP ביציאה 9000 עם שינוי הקוד שנטען.
  9. הפעם, במקום ללחוץ על הקישור ולהמתין כמה שניות במסמך Google חדש, אפשר לבחור את בקשת ה-HTTP האחרונה שנרשמה בממשק האינטרנט שאותו מארח אפליקציית ngrok בסביבה המקומית וללחוץ על Replay. כמו בפעם הקודמת, התוסף שלך ל-Google Workspace לא משיב כי הוא נמצא בתהליך ניפוי באגים.

  10. כשממשיכים את ההרצה מהמאבחן Visual Studio Code, אפשר לראות מממשק האינטרנט שמארחת אפליקציית ngrok בסביבה המקומית, שהאפליקציה יוצרת תגובה עם הגרסה המעודכנת של כרטיס התצוגה המקדימה.

Java

  1. בסביבת פיתוח משולבת (IDE) Visual Studio Code שהתקנתם בסביבה המקומית, מבצעים את הפעולות הבאות:

    1. בחלון חדש, פותחים את התיקייה add-ons-samples/java/3p-resources.
    2. מגדירים את פרויקט Maven להפעלת האפליקציה CreateLinkPreview ביציאה 9000 באופן מקומי על ידי הוספת התוסף Cloud Functions Framework build‏ 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. עכשיו אפשר להפעיל אותו באופן מקומי במצב ניפוי באגים:

      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. מוסיפים נקודת עצירה שגורמת להשהיית העיבוד של בקשת ה-HTTP בקובץ CreateLinkPreview.java, ומתחילים לצרף ולבצע ניפוי באגים באמצעות ההגדרה Remote Debug Watch שנוספה קודם. האפליקציה פועלת עכשיו ומאזינה לבקשות HTTP ביציאה 9000.

      האפליקציה פועלת ומאזינה לבקשות HTTP ביציאה 9000.
      איור 3. האפליקציה פועלת ומאזינה לבקשות HTTP ביציאה 9000.

  2. מפעילים את האפליקציה ngrok בסביבה המקומית:

    ngrok http --domain=NGROK_STATIC_DOMAIN 9000

    מחליפים את NGROK_STATIC_DOMAIN בדומיין הסטטי בחשבון ngrok. כל הבקשות מנותבות עכשיו לסביבה המקומית ולפורט שבו האפליקציה משתמשת.

    הטרמינל עם שרת ngrok שפועל ומבצע הפניה אוטומטית.
    איור 4. הטרמינל עם ngrok השרת שפועל ומפנה.
  3. ממשק אינטרנט מופעל גם ב-localhost על ידי האפליקציה ngrok. כדי לעקוב אחרי כל הפעילויות, פותחים את הכלי בדפדפן.

    ממשק האינטרנט שמתארח באפליקציית ngrok ולא מוצגות בו בקשות HTTP.
    איור 5. ממשק האינטרנט שמתארח באפליקציית ngrok ולא מוצגות בו בקשות HTTP.
  4. כדי לבדוק את התוסף שלכם ל-Google Workspace, אתם יכולים להציג תצוגה מקדימה של כתובת URL של בקשה חדשה במסמך Google Docs חדש באמצעות חשבון בודק:

    • יוצרים מסמך ב-Google Docs.

      יצירת מסמך ב-Google Docs

    • מקלידים את הקישור הבא ומקישים על enter:

      https://example.com/support/case/?name=Name1&description=Description1&priority=P1
      
    • לוחצים על הקישור.

  5. ב-Visual Studio Code בסביבה המקומית, אפשר לראות שהביצוע מושהה בנקודת העצירה שהוגדרה.

    הביצוע מושהה בנקודת העצירה שהוגדרה.
    איור 6. הביצוע מושהה בנקודת העצירה שהוגדרה.
  6. כשממשיכים את ההפעלה מVisual Studio Codeמאבחן הבאגים לפני שפג הזמן הקצוב לתפוגה של תוספים ל-Google Workspace, התוסף ל-Google Workspace מציג את התצוגה המקדימה של הקישור במסמך Google Doc מהמטמון.

  7. אפשר לבדוק את היומנים של בקשות ותגובות HTTP מממשק האינטרנט שמארחת אפליקציית ngrok בסביבה המקומית.

    בקשת ה-HTTP מממשק האינטרנט שמתארח באפליקציית ngrok.
    איור 7. בקשת ה-HTTP מממשק האינטרנט שמתארח באפליקציה ngrok.
  8. כדי לשנות את אופן הפעולה של האפליקציה, מחליפים את Case ב-Case: בשורה 78 בקובץ CreateLinkPreview.java, מפעילים מחדש את התהליך mvnDebug ומפעילים מחדש את Remote Debug Watch כדי לצרף מחדש ולהפעיל מחדש את ניפוי הבאגים.

  9. הפעם, במקום ללחוץ על הקישור ולהמתין כמה שניות במסמך Google חדש, אפשר לבחור את בקשת ה-HTTP האחרונה שנרשמה בממשק האינטרנט שאותו מארח אפליקציית ngrok בסביבה המקומית וללחוץ על 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: יציאת הניפוי באגים בסביבה המרוחקת.

יציאת הניפוי בסביבה המקומית מקושרת עכשיו ליציאת הניפוי בסביבה המרוחקת.

התחלת ניפוי באגים

בסביבת הפיתוח המשולבת (IDE) Visual Studio Code שהתקנתם בסביבה המקומית, מבצעים את הפעולות הבאות:

  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 שנוספה קודם.

    איך משתמשים בתוסף ל-Google Workspace שהתקנתם תוסף Google Workspace לא משיב כי הוא נמצא כרגע בניפוי באגים ב-IDE‏ Visual Studio Code.