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>

      בהמתנה

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

Methods

getHAR()

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

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

החזרות

  • Promise<object>

    בהמתנה

    פונקציה שמקבלת את יומן ה-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