Suntikan semula skrip kandungan: langkah yang perlu selepas peningkatan atau pemasangan sambungan Chrome

Question

Selepas memasang atau menaik taraf sambungan Chrome yang saya sedang bangunkan, skrip kandungan (dinyatakan dalam manifes) tidak disuntik semula, jadi muat semula halaman diperlukan untuk sambungan itu berfungsi dengan betul. Adakah terdapat cara untuk memaksa skrip disuntik semula?

Saya percaya saya boleh menyuntiknya semula dengan mengalih keluarnya secara pemrograman daripada manifes dan kemudian memproses halaman untuk disuntik dalam halaman latar belakang, tetapi itu bukan penyelesaian yang baik.

Saya tidak mahu memuat semula tab pengguna secara automatik kerana ini mungkin mengakibatkan kehilangan data. Safari menyegarkan semua halaman secara automatik apabila sambungan dipasang atau dinaik taraf.

Answer 1

Satu-satunya cara untuk memaksa suntikan skrip kandungan tanpa menyegarkan halaman adalah melalui suntikan program.

Anda boleh menggunakan API Teg Chrome untuk mendapatkan semua teg anda dan menyuntik kod ke dalamnya. Sebagai contoh, anda boleh menyimpan nombor versi dalam storan setempat dan setiap kali anda menyemak sama ada nombor versi dalam halaman latar belakang sudah lapuk (jika ada), anda boleh mendapatkan semua teg aktif dan menyuntik kod anda secara pengaturcaraan, atau apa sahaja penyelesaian untuk memastikan sambungan anda dikemas kini.

Gunakan kod berikut untuk mendapatkan semua tag:
chrome.tabs.query

dan masukkan kod anda ke dalam semua halaman
chrome.tabs.executeScript(tabId, {file: "content_script.js"});

Answer 2

Terdapat cara untuk menjadikan sambungan kandungan-skrip-berat terus berfungsi dengan betul selepas menaik taraf dan menjadikannya langsung selepas pemasangan.

Pemasangan/Naik Taraf

Cara untuk memasangnya ialah dengan hanya melingkari semua tab dalam semua tetingkap dan menyuntik beberapa skrip dalam tab dengan URL yang sepadan secara pemrograman.

ManifestV3

manifest.json:

"background": {"service_worker": "background.js"},
"permissions": ["scripting"],
"host_permissions": ["<all_urls>"],

Kebenaran_hos ini hendaklah sama dengan skrip kandungan matches.

background.js:

chrome.runtime.onInstalled.addListener(async () => {
  for (const cs of chrome.runtime.getManifest().content_scripts) {
    for (const tab of await chrome.tabs.query({url: cs.matches})) {
      chrome.scripting.executeScript({
        target: {tabId: tab.id},
        files: cs.js,
      });
    }
  }
});

Ini adalah contoh ringkas dan tidak berkaitan dengan bingkai. Anda boleh menggunakan API getAllFrames dan memadankan URL sendiri, lihat dokumentasi untuk corak padanan.

ManifestV2

Jelas sekali anda perlu melakukan ini dalam halaman latar belakang atau halaman acaraskrip yang diisytiharkan dalam manifes.json:

"background": {
    "scripts": ["background.js"]
},

background.js:

// Add a `manifest` property to the `chrome` object.
chrome.manifest = chrome.runtime.getManifest();

var injectIntoTab = function (tab) {
    // You could iterate through the content scripts here
    var scripts = chrome.manifest.content_scripts[0].js;
    var i = 0, s = scripts.length;
    for( ; i < s; i++ ) {
        chrome.tabs.executeScript(tab.id, {
            file: scripts[i]
        });
    }
}

// Get all windows
chrome.windows.getAll({
    populate: true
}, function (windows) {
    var i = 0, w = windows.length, currentWindow;
    for( ; i < w; i++ ) {
        currentWindow = windows[i];
        var j = 0, t = currentWindow.tabs.length, currentTab;
        for( ; j < t; j++ ) {
            currentTab = currentWindow.tabs[j];
            // Skip chrome:// and https:// pages
            if( ! currentTab.url.match(/(chrome|https):\/\//gi) ) {
                injectIntoTab(currentTab);
            }
        }
    }
});

Fakta Menarik Sejarah

Dalam Chrome 26 purba dan lebih awal, skrip kandungan boleh memulihkan sambungan ke skrip latar belakang. Ini telah ditetapkan pada 2013http://crbug.com/168263. Anda boleh melihat contoh teknik ini dalam versi awal jawapan ini.