chrome.devtools.network

תיאור

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

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

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

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

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

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

מניפסט

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

"devtools_page"

דוגמאות

הקוד הבא מתעד ביומן את כתובות ה-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

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

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

    () => {...}

    • החזרות

      Promise<object>

      ‫Chrome 151 ואילך

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

Methods

getHAR()

chrome.devtools.network.getHAR(): Promise<object>

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

החזרות

  • Promise<object>

    ‫Chrome 151 ואילך

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

אירועים

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