chrome.devtools.network

Deskripsi

Gunakan chrome.devtools.network API untuk mengambil informasi tentang permintaan jaringan yang ditampilkan oleh Developer Tools di panel Jaringan.

Manifes

Kunci berikut harus dideklarasikan dalam manifes untuk menggunakan API ini.

"devtools_page"

Lihat ringkasan API DevTools untuk pengantar umum tentang penggunaan API Developer Tools.

Ringkasan

Informasi permintaan jaringan ditampilkan dalam format Arsip HTTP (HAR). Deskripsi dari HAR di luar cakupan dokumen ini, lihat Spesifikasi HAR v1.2.

Terkait HAR, metode chrome.devtools.network.getHAR() menampilkan seluruh log HAR, sementara Peristiwa chrome.devtools.network.onRequestFinished memberikan entri HAR sebagai argumen untuk peristiwa tersebut .

Perlu diperhatikan bahwa konten permintaan tidak disediakan sebagai bagian dari HAR untuk alasan efisiensi. Anda dapat menelepon metode getContent() permintaan untuk mengambil konten.

Jika jendela Alat Developer terbuka setelah halaman dimuat, beberapa permintaan mungkin hilang di array entri yang ditampilkan oleh getHAR(). Muat ulang halaman untuk mendapatkan semua permintaan. Secara umum, daftar permintaan yang ditampilkan oleh getHAR() harus cocok dengan yang ditampilkan di panel Jaringan.

Contoh

Kode berikut mencatat URL semua gambar yang berukuran lebih besar dari 40 KB ke dalam log saat dimuat:

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) + '"))');
    }
  }
);

Untuk mencoba API ini, instal contoh devtools API dari chrome-extension-samples repositori resource.

Jenis

Request

Merepresentasikan permintaan jaringan untuk resource dokumen (skrip, gambar, dan sebagainya). Lihat Spesifikasi HAR untuk referensi.

Properti

  • getContent

    void

    Menampilkan konten isi respons.

    Fungsi getContent akan terlihat seperti ini: 

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

    • callback

      fungsi

      Parameter callback terlihat seperti ini: 

      (content: string, encoding: string) => void

      • konten

        string

        Konten isi respons (berpotensi dienkode).

      • encoding

        string

        Kosong jika konten tidak dienkode, nama encoding jika tidak. Saat ini, hanya base64 yang didukung.

Metode

getHAR()

chrome.devtools.network.getHAR(
  callback: function,
)

Menampilkan log HAR yang berisi semua permintaan jaringan yang diketahui.

Parameter

  • callback

    fungsi

    Parameter callback terlihat seperti ini: 

    (harLog: object) => void

    • harLog

      objek

      Catatan HAR. Lihat spesifikasi HAR untuk mengetahui detailnya.

Acara

onNavigated

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

Diaktifkan saat jendela yang diperiksa membuka halaman baru.

Parameter

  • callback

    fungsi

    Parameter callback terlihat seperti ini: 

    (url: string) => void

    • url

      string

onRequestFinished

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

Diaktifkan saat permintaan jaringan selesai dan semua data permintaan tersedia.

Parameter

  • callback

    fungsi

    Parameter callback terlihat seperti ini: 

    (request: Request) => void