Bagaimana untuk Menyelesaikan Ralat 'Tidak Dapat Membaca Sifat Tidak Ditakrifkan' Apabila Menggunakan API Chrome dalam Skrip Kandungan?

Ralat "Tidak Dapat Membaca Sifat Tidak Ditakrifkan" dengan API Chrome dalam Skrip Kandungan

Pelanjutan Chrome sering menggunakan skrip kandungan untuk menyuntik JavaScript ke dalam halaman web . Satu isu biasa timbul apabila cuba mengakses API krom, seperti chrome.tabs, dalam skrip kandungan ini.

Ralat "Tidak dapat membaca 'nama' sifat undefined" menunjukkan bahawa API tidak tersedia dalam kandungan konteks skrip. Ini kerana skrip kandungan mempunyai akses terhad kepada API krom berbanding jenis skrip lain seperti skrip latar belakang dan skrip pop timbul.

Punca:

Skrip kandungan dikotak pasir dan hanya mempunyai akses kepada set API tertentu, termasuk chrome.i18n, chrome.dom, chrome.storage dan subset chrome.runtime/chrome.extension.

Penyelesaian:

Untuk mengakses API chrome terhad seperti chrome.tabs dalam skrip kandungan, anda boleh menggunakan penghantaran mesej untuk berkomunikasi dengan jenis skrip yang sesuai (cth., latar belakang skrip).

Pelaksanaan:

1. Hantar mesej daripada skrip kandungan kepada skrip latar belakang, skrip pop timbul atau pekerja perkhidmatan (untuk MV3).

// In contentScript.js
chrome.runtime.sendMessage({ action: "getTabs" });

2. Kendalikan mesej dalam penerima skrip.

// In backgroundScript.js
chrome.runtime.onMessage.addListener((request, sender, sendResponse) => {
  if (request.action === "getTabs") {
    chrome.tabs.query({}, (tabs) => {
      sendResponse(tabs);
    });
  }
});

3. Gunakan API dalam skrip yang sesuai dan kembalikan hasilnya kepada skrip kandungan.

Dengan mengikuti langkah ini, anda boleh menggunakan API krom yang tidak tersedia dalam skrip kandungan dengan menyerahkan permintaan kepada jenis skrip yang lebih istimewa melalui penghantaran mesej.

Atas ialah kandungan terperinci Bagaimana untuk Menyelesaikan Ralat 'Tidak Dapat Membaca Sifat Tidak Ditakrifkan' Apabila Menggunakan API Chrome dalam Skrip Kandungan?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!