अपना कोड अपडेट करें

ऐसे अपडेट जो अन्य समस्याओं से संबंधित नहीं हैं

यह तीन सेक्शन में से पहला है. यह उस कोड के लिए ज़रूरी बदलावों के बारे में बताता है जो एक्सटेंशन सर्विस वर्कर का हिस्सा नहीं है. इस सेक्शन में कोड में होने वाले ज़रूरी बदलावों के बारे में बताया गया है. ये बदलाव दूसरी समस्याओं के बारे में नहीं हैं. अगले दो सेक्शन में, ब्लॉक करने वाले वेब अनुरोधों को बदलना और सुरक्षा को बेहतर बनाना शामिल है.

Tab.executScript() को scripting.exeuteScript() से बदलें

मेनिफ़ेस्ट V3 में, executeScript(), tabs एपीआई से scripting एपीआई में चला जाता है. इसके लिए, असल कोड में हुए बदलावों के साथ-साथ मेनिफ़ेस्ट फ़ाइल की अनुमतियों में भी बदलाव करना ज़रूरी है.

executeScript() तरीके के लिए आपको इनकी ज़रूरत होगी:

  • "scripting" की अनुमति.
  • होस्ट की अनुमतियां या "activeTab" की अनुमति.

scripting.executeScript() तरीका वही है जो tabs.executeScript() के साथ काम करता है. कुछ अंतर हैं.

  • पुराने तरीके में सिर्फ़ एक फ़ाइल ली जा सकती थी, लेकिन नए तरीके में कई फ़ाइलों का कलेक्शन हो सकता है.
  • आप InjectDetails के बजाय ScriptInjection ऑब्जेक्ट भी पास करते हैं. दोनों के बीच कई अंतर हैं. उदाहरण के लिए, tabId को अब तरीके के तर्क के बजाय, ScriptInjection.target के सदस्य के तौर पर पास किया गया है.

उदाहरण में इस प्रोसेस को करने का तरीका बताया गया है.

मेनिफ़ेस्ट V2
async function getCurrentTab() {/* ... */}
let tab = await getCurrentTab();

chrome.tabs.executeScript(
  tab.id,
  {
    file: 'content-script.js'
  }
);

बैकग्राउंड के लिए स्क्रिप्ट फ़ाइल में.

मेनिफ़ेस्ट V3
async function getCurrentTab()
let tab = await getCurrentTab();

chrome.scripting.executeScript({
  target: {tabId: tab.id},
  files: ['content-script.js']
});

एक्सटेंशन सर्विस वर्कर में.

Tab.insertCSS() और tab.removeCSS() को scripting.insertCSS() और scripting.removeCSS() से बदलें

मेनिफ़ेस्ट V3 में, insertCSS(), और removeCSS(), tabs एपीआई से scripting एपीआई में चले जाते हैं. इसके लिए कोड में किए गए बदलावों के साथ-साथ, मेनिफ़ेस्ट फ़ाइल में अनुमतियों में भी बदलाव करना ज़रूरी है:

  • "scripting" की अनुमति.
  • होस्ट की अनुमतियां या "activeTab" की अनुमति.

scripting API के फ़ंक्शन, tabs के फ़ंक्शन जैसे ही हैं. कुछ अंतर हैं.

  • इन तरीकों को कॉल करने पर, आपको InjectDetails के बजाय CSSInjection ऑब्जेक्ट पास करना पड़ता है.
  • tabId को अब विधि तर्क के बजाय CSSInjection.target के सदस्य के रूप में पास किया गया है.

इस उदाहरण में, insertCSS() के लिए इस प्रोसेस को करने का तरीका बताया गया है. removeCSS() के लिए प्रक्रिया एक जैसी है.

मेनिफ़ेस्ट V2
chrome.tabs.insertCSS(tabId, injectDetails, () => {
  // callback code
});

बैकग्राउंड के लिए स्क्रिप्ट फ़ाइल में.

मेनिफ़ेस्ट V3
const insertPromise = await chrome.scripting.insertCSS({
  files: ["style.css"],
  target: { tabId: tab.id }
});
// Remaining code.

एक्सटेंशन सर्विस वर्कर में.

ब्राउज़र कार्रवाइयों और पेज कार्रवाइयों को कार्रवाइयों से बदलें

मेनिफ़ेस्ट V2 में, ब्राउज़र ऐक्शन और पेज ऐक्शन अलग-अलग कॉन्सेप्ट थे. हालांकि, शुरुआत में दोनों भूमिकाएं अलग-अलग थीं, लेकिन समय के साथ उनके बीच का अंतर कम था. मेनिफ़ेस्ट V3 में, ये कॉन्सेप्ट Action API में इंटिग्रेट किए जाते हैं. इसके लिए, आपके manifest.json और एक्सटेंशन कोड में बदलाव करना होगा. यह कोड, मेनिफ़ेस्ट V2 बैकग्राउंड स्क्रिप्ट में रखे गए एक्सटेंशन से अलग है.

मेनिफ़ेस्ट V3 में उपलब्ध कार्रवाइयां, ब्राउज़र की कार्रवाइयों से काफ़ी मिलती-जुलती हैं. हालांकि, action एपीआई, pageAction की तरह hide() और show() उपलब्ध नहीं कराता. अगर आपको अब भी पेज पर की जाने वाली कार्रवाइयों की ज़रूरत है, तो जानकारी देने वाले कॉन्टेंट का इस्तेमाल करके उन कार्रवाइयों को एम्युलेट करें. इसके अलावा, टैब आईडी का इस्तेमाल करके enable() या disable() को कॉल किया जा सकता है.

"ब्राउज़र_कार्रवाई" और "page_action" को "कार्रवाई" से बदलें

manifest.json में, "browser_action" और "page_action" फ़ील्ड को "action" फ़ील्ड से बदलें. "action" फ़ील्ड की जानकारी के लिए रेफ़रंस देखें.

मेनिफ़ेस्ट V2
{
  ...
  "page_action": { ... },
  "browser_action": {
    "default_popup": "popup.html"
   }
  ...
}
मेनिफ़ेस्ट V3
{
  ...
  "action": {
    "default_popup": "popup.html"
  }

  ...
}

ब्राउज़रAction और pageAction एपीआई को कार्रवाई एपीआई से बदलें

जहां आपके मेनिफ़ेस्ट V2 ने browserAction और pageAction एपीआई का इस्तेमाल किया है, तो अब आपको action API का इस्तेमाल करना चाहिए.

मेनिफ़ेस्ट V2
chrome.browserAction.onClicked.addListener(tab => { ... });
chrome.pageAction.onClicked.addListener(tab => { ... });
मेनिफ़ेस्ट V3
chrome.action.onClicked.addListener(tab => { ... });

कॉलबैक को प्रॉमिस से बदलें

मेनिफ़ेस्ट V3 में, कई एक्सटेंशन एपीआई तरीके प्रॉमिस रिटर्न करते हैं. प्रॉमिस किसी एसिंक्रोनस तरीके से की गई वैल्यू के लिए प्रॉक्सी या प्लेसहोल्डर होता है. अगर आपने Promises का इस्तेमाल कभी नहीं किया है, तो इसके बारे में एमडीएन पर पढ़ें. इस पेज पर बताया गया है कि Chrome एक्सटेंशन में इन एक्सटेंशन का इस्तेमाल करने के लिए, आपको क्या जानने की ज़रूरत है.

पुराने सिस्टम के साथ काम करने की सुविधा के लिए, प्रॉमिस सपोर्ट जोड़ने के बाद, कई तरीके कॉलबैक के साथ काम करते रहते हैं. ध्यान रखें कि एक ही फ़ंक्शन कॉल में दोनों का इस्तेमाल नहीं किया जा सकता. कॉलबैक पास करने पर, फ़ंक्शन कोई प्रॉमिस नहीं दिखाएगा. साथ ही, अगर आपको कोई प्रॉमिस रिटर्न करना है, तो कॉलबैक पास न करें. एपीआई की कुछ सुविधाओं, जैसे कि इवेंट लिसनर के लिए कॉलबैक की ज़रूरत जारी रहेगी. यह देखने के लिए कि किसी तरीके में प्रॉमिस काम करता है या नहीं, उसके एपीआई रेफ़रंस में "प्रॉमिस" लेबल ढूंढें.

कॉलबैक को प्रॉमिस में बदलने के लिए, कॉलबैक को हटाएं और लौटाए गए प्रॉमिस को मैनेज करें. नीचे दिया गया उदाहरण, खास तौर पर वैकल्पिक अनुमतियों के सैंपल, newtab.js से लिया गया है. कॉलबैक वर्शन से पता चलता है कि request() को, सैंपल के तौर पर किया गया कॉल कॉलबैक के साथ कैसा दिखेगा. ध्यान दें कि प्रॉमिस वर्शन को एसिंक्रोनस के साथ फिर से लिखा जा सकता है और इंतज़ार किया जा सकता है.

फिर से कॉल करें
chrome.permissions.request(newPerms, (granted) => {
  if (granted) {
    console.log('granted');
  } else {
    console.log('not granted');
  }
});
वादा
const newPerms = { permissions: ['topSites'] };
chrome.permissions.request(newPerms)
.then((granted) => {
  if (granted) {
    console.log('granted');
  } else {
    console.log('not granted');
  }
});

उन फ़ंक्शन को बदलें जो मेनिफ़ेस्ट V2 बैकग्राउंड कॉन्टेक्स्ट की उम्मीद करते हैं

अन्य एक्सटेंशन कॉन्टेक्स्ट, सिर्फ़ मैसेज पासिंग का इस्तेमाल करके एक्सटेंशन सर्विस वर्कर से इंटरैक्ट कर सकते हैं. नतीजतन, आपको उन कॉल को बदलना होगा जो बैकग्राउंड में जगह की जानकारी का होना चाहते हैं, खास तौर से:

  • chrome.runtime.getBackgroundPage()
  • chrome.extension.getBackgroundPage()
  • chrome.extension.getExtensionTabs()

आपकी एक्सटेंशन स्क्रिप्ट को सर्विस वर्कर और आपके एक्सटेंशन के अन्य भागों के बीच कम्यूनिकेशन करने के लिए मैसेज पासिंग का इस्तेमाल करना चाहिए. फ़िलहाल, इसमें sendMessage() का इस्तेमाल करने और आपके एक्सटेंशन सर्विस वर्कर में chrome.runtime.onMessage लागू करने पर ज़ोर दिया गया है. लंबे समय के लिए, आपको इन कॉल को postMessage() और सर्विस वर्कर के मैसेज इवेंट हैंडलर से बदलना होगा.

काम न करने वाले एपीआई बदलें

नीचे दिए गए तरीकों और प्रॉपर्टी को मेनिफ़ेस्ट V3 में बदलना ज़रूरी है.

मेनिफ़ेस्ट V2 तरीका या प्रॉपर्टी इसके साथ बदलें
chrome.extension.connect() chrome.runtime.connect()
chrome.extension.connectNative() chrome.runtime.connectNative()
chrome.extension.getExtensionTabs() chrome.extension.getViews()
chrome.extension.getURL() chrome.runtime.getURL()
chrome.extension.lastError जहां तरीके प्रॉमिस रिटर्न करते हैं, वहां promise.catch() का इस्तेमाल करें
chrome.extension.onConnect chrome.runtime.onConnect
chrome.extension.onConnectExternal chrome.runtime.onConnectExternal
chrome.extension.onMessage chrome.runtime.onMessage
chrome.extension.onRequest chrome.runtime.onRequest
chrome.extension.onRequestExternal chrome.runtime.onMessageExternal
chrome.extension.sendMessage() chrome.runtime.sendMessage()
chrome.extension.sendNativeMessage() chrome.runtime.sendNativeMessage()
chrome.extension.sendRequest() chrome.runtime.sendMessage()
chrome.runtime.onSuspend (बैकग्राउंड स्क्रिप्ट) एक्सटेंशन सर्विस वर्कर में काम नहीं करता. इसके बजाय, beforeunload दस्तावेज़ इवेंट का इस्तेमाल करें.
chrome.tabs.getAllInWindow() chrome.tabs.query()
chrome.tabs.getSelected() chrome.tabs.query()
chrome.tabs.onActiveChanged chrome.tabs.onActivated
chrome.tabs.onHighlightChanged chrome.tabs.onHighlighted
chrome.tabs.onSelectionChanged chrome.tabs.onActivated
chrome.tabs.sendRequest() chrome.runtime.sendMessage()
chrome.tabs.Tab.selected chrome.tabs.Tab.highlighted