क्रोम एक्सटेंशन अपडेट के बाद अनाथ स्क्रिप्ट को कैसे हटाएं

समस्या

अनजाने में क्रोम एक्सटेंशन को पुनः लोड करना, विशेष रूप से डेवलपर मोड में, अनाथ सामग्री बना सकता है स्क्रिप्ट. ये स्क्रिप्ट पृष्ठभूमि में चलती रहती हैं लेकिन बाकी एक्सटेंशन के साथ संचार खो देती हैं, जिसके परिणामस्वरूप "एक्सटेंशन संदर्भ अमान्य" और "अनचेक रनटाइम.लास्ट एरर" जैसी त्रुटियां होती हैं।

Solution

The अनाथ सामग्री स्क्रिप्ट अभी भी DOM संदेश प्राप्त कर सकती है। इसे हटाने के लिए:

1. नई सामग्री स्क्रिप्ट से संदेश भेजें:

• नई, कार्यशील सामग्री स्क्रिप्ट में, window.dispatchEvent का उपयोग करके अनाथ स्क्रिप्ट को एक संदेश भेजें।
• एक अद्वितीय संदेश पहचानकर्ता का उपयोग करें , जैसे कि अनाथमैसेजआईडी।

2। अनाथ स्क्रिप्ट में श्रोताओं को अपंजीकृत करें:

• अनाथ स्क्रिप्ट में, अनाथमेसेजआईडी के लिए एक श्रोता को परिभाषित करें।
• इस श्रोता के भीतर, सभी पिछले श्रोताओं को अपंजीकृत करें और वैश्विक चर को रद्द करें।
• यह पुरानी स्क्रिप्ट को कचरा संग्रहण के लिए योग्य बनाता है।

3. पृष्ठभूमि स्क्रिप्ट:

• एक्सटेंशन रीलोड/इंस्टॉल पर सामग्री स्क्रिप्ट को फिर से इंजेक्ट करें।

4. सामग्री स्क्रिप्ट:

• इवेंट श्रोताओं के लिए उनके संदर्भों को संरक्षित करने के लिए नामित फ़ंक्शन का उपयोग करें।
• एक सक्रिय उदाहरण को इंगित करने के लिए एक window.running प्रॉपर्टी सेट करें।
• OrtonMessageId प्राप्त करते समय, श्रोताओं को अपंजीकृत करें और स्क्रिप्ट को अनाथ के रूप में चिह्नित करें।

5। पॉपअप स्क्रिप्ट:

• संदेश भेजने से पहले जांचें कि कोई कार्यशील सामग्री स्क्रिप्ट मौजूद है या नहीं।
• स्क्रिप्ट इंजेक्शन सुनिश्चित करने के लिए SureContentScript का उपयोग करें।

उदाहरण कोड:

background.js:

// Re-inject content script
chrome.runtime.onInstalled.addListener(() => {
  chrome.tabs.query({ active: true, currentWindow: true }, tabs => {
    chrome.tabs.executeScript(tabs[0].id, { file: 'content.js' });
  });
});

content.js:

// Orphaned script detection and cleanup
var orphanMessageId = chrome.runtime.id   'orphanCheck';
window.dispatchEvent(new Event(orphanMessageId));
window.addEventListener(orphanMessageId, unregisterOrphan);

// Register named listeners
chrome.runtime.onMessage.addListener(onMessage);
document.addEventListener('mousemove', onMouseMove);

// Orphan flag and cleanup function
window.running = true;

function unregisterOrphan() {
  if (chrome.runtime.id) {
    // Not orphaned
    return;
  }
  window.removeEventListener(orphanMessageId, unregisterOrphan);
  document.removeEventListener('mousemove', onMouseMove);
  try {
    chrome.runtime.onMessage.removeListener(onMessage);
  } catch (e) {}
  return true;
}

popup.js:

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);
  }
}

async function ensureContentScript(tabId) {
  try {
    const [{ result }] = await chrome.scripting.executeScript({
      target: { tabId },
      func: () => window.running === true,
    });
    if (!result) {
      await chrome.scripting.executeScript({
        target: { tabId },
        files: ['content.js'],
      });
    }
    return true;
  } catch (e) {}
}