chrome.devtools.network

תיאור

אפשר להשתמש ב-chrome.devtools.network API כדי לאחזר את המידע על בקשות הרשת שמוצגות בכלים למפתחים בחלונית הרשת.

מניפסט

כדי להשתמש ב-API הזה, צריך להצהיר על המפתחות הבאים במניפסט.

"devtools_page"

במאמר סיכום של ממשקי DevTools API יש מבוא כללי לשימוש בממשקי Developer Tools API.

סקירה כללית

המידע על בקשות הרשת מיוצג בפורמט HTTP Archive ‏ (HAR). תיאור של HAR לא נכלל במסמך הזה. אפשר לעיין במפרט HAR v1.2.

במונחים של HAR, השיטה chrome.devtools.network.getHAR() מחזירה יומן HAR מלא, בעוד שהאירוע chrome.devtools.network.onRequestFinished מספק רשומה ב-HAR כארגומנט לקריאה החוזרת של האירוע.

הערה: תוכן הבקשה לא מסופק כחלק מקובץ ה-HAR מסיבות של יעילות. אפשר להתקשר לשיטה getContent() של הבקשה כדי לאחזר תוכן.

אם חלון כלי הפיתוח נפתח אחרי שהדף נטען, יכול להיות שחלק מהבקשות לא יופיעו במערך הרשומות שמוחזר על ידי getHAR(). כדי לקבל את כל הבקשות, צריך לטעון מחדש את הדף. באופן כללי, רשימת הבקשות שמוחזרת על ידי getHAR() צריכה להיות זהה לזו שמוצגת בחלונית Network (רשת).

דוגמאות

הקוד הבא מתעד ביומן את כתובות ה-URL של כל התמונות שגדולות מ-40KB בזמן שהן נטענות:

chrome.devtools.network.onRequestFinished.addListener(
  function(request) {
    if (request.response.bodySize > 40*1024) {
      chrome.devtools.inspectedWindow.eval(
          'console.log("Large image: " + unescape("' +
          escape(request.request.url) + '"))');
    }
  }
);

כדי לנסות את ה-API הזה, צריך להתקין את הדוגמאות ל-API של כלי הפיתוח ממאגר chrome-extension-samples.

סוגים

Request

מייצג בקשה לאחזור מהרשת למשאב מסמך (סקריפט, תמונה וכו'). לפרטים נוספים, אפשר לעיין במפרט HAR.

מאפיינים

  • getContent

    void

    Promise

    מחזירה את התוכן של גוף התגובה.

    הפונקציה getContent נראית כך: 

    (callback?: function) => {...}

    • callback

      פונקציה אופציונלית

      הפרמטר callback נראה כך: 

      (response: object) => void

      • תשובה

        אובייקט

        ‫Chrome 151 ואילך

        אובייקט שמכיל את גוף התשובה והקידוד שלו.

        • תוכן

          מחרוזת

          התוכן של גוף התגובה (יכול להיות שהוא מקודד).

        • קידוד

          מחרוזת

          השדה ריק אם התוכן לא מקודד, אחרת מופיע בו שם הקידוד. בשלב הזה יש תמיכה רק ב-base64.

    • החזרות

      Promise<object>

      ‫Chrome 151 ואילך

      פונקציה שמקבלת את גוף התגובה כשהבקשה מסתיימת.

      התמיכה ב-Promises קיימת רק ב-Manifest V3 ואילך. בפלטפורמות אחרות צריך להשתמש ב-callbacks.

Methods

getHAR()

Promise 
chrome.devtools.network.getHAR(
  callback?: function,
): Promise<object>

מחזירה יומן HAR שמכיל את כל בקשות הרשת הידועות.

פרמטרים

  • callback

    פונקציה אופציונלית

    הפרמטר callback נראה כך: 

    (harLog: object) => void

    • harLog

      אובייקט

      יומן HAR. פרטים נוספים מופיעים במפרט HAR.

החזרות

  • Promise<object>

    ‫Chrome 151 ואילך

    פונקציה שמקבלת את יומן ה-HAR כשהבקשה מסתיימת.

    התמיכה ב-Promises קיימת רק ב-Manifest V3 ואילך. בפלטפורמות אחרות צריך להשתמש ב-callbacks.

אירועים

onNavigated

chrome.devtools.network.onNavigated.addListener(
  callback: function,
)

האירוע מופעל כשחלון הבדיקה עובר לדף חדש.

פרמטרים

  • callback

    פונקציה

    הפרמטר callback נראה כך: 

    (url: string) => void

    • כתובת אתר

      מחרוזת

onRequestFinished

chrome.devtools.network.onRequestFinished.addListener(
  callback: function,
)

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

פרמטרים

  • callback

    פונקציה

    הפרמטר callback נראה כך: 

    (request: Request) => void