Comment supprimer le script orphelin après la mise à jour de l'extension Chrome ?

Comment supprimer le script orphelin après la mise à jour de l'extension Chrome

Problème :

Lorsqu'une extension Chrome est rechargée, le contenu est orphelin les scripts peuvent rester, entraînant des erreurs et des problèmes de communication avec d'autres parties de l'extension. Ce problème se produit si le script de contenu d'origine comporte des écouteurs d'événements DOM, empêchant sa suppression automatique.

Solution :

Pour supprimer le script orphelin :

1. Envoyez un message du nouveau script de contenu fonctionnel au script orphelin à l'aide de Window.
2. Dès réception du message, le script orphelin doit désenregistrer tous les écouteurs et variables globales. Cela le rendra éligible à la collecte des ordures.

Exemple de code :

background.js :

<code class="javascript">// Re-inject content scripts on reloading/installing the extension
// (See example in link provided in QA)</code>

content.js :

<code class="javascript">// Generate a unique message ID for the orphan check
const orphanMessageId = chrome.runtime.id + 'orphanCheck';

// Register a listener for the orphan check message
window.addEventListener(orphanMessageId, unregisterOrphan);

// ... (Continue with original content script code) ...

// Function to unregister the orphaned script
function unregisterOrphan() {
  // Check if the extension is uninstalled
  if (!chrome.runtime.id) {
    // The script is not orphaned
    return;
  }
  
  // Remove the orphan message listener
  window.removeEventListener(orphanMessageId, unregisterOrphan);

  // Remove DOM event listeners
  document.removeEventListener('mousemove', onMouseMove);

  // Remove runtime message listener (try-catch required in some cases)
  try {
    chrome.runtime.onMessage.removeListener(onMessage);
  } catch (e) {}
}</code>

popup.js :

<code class="javascript">// Function to send a message and ensure a content script is injected before doing so
async function sendMessage(data) {
  const [tab] = await chrome.tabs.query({ active: true, currentWindow: true });
  if (await ensureContentScript(tab.id)) {
    return await chrome.tabs.sendMessage(tab.id, data);
  }
}

// Function to check if a content script is running and re-inject it if not
async function ensureContentScript(tabId) {
  try {
    // Check if the content script is running
    const [{ result }] = await chrome.scripting.executeScript({
      target: { tabId },
      func: () => window.running === true,
    });
    
    // If not, inject the content script
    if (!result) {
      await chrome.scripting.executeScript({
        target: { tabId },
        files: ['content.js'],
      });
    }
    
    return true;
  } catch (e) {}
}</code>

Avec cette approche, le script orphelin sera nettoyé et la communication avec le reste de l'extension peut être rétablie.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!