एक्सटेंशन की सुरक्षा बेहतर बनाएं

Manifest V3 में सुरक्षा को बेहतर बनाना

ध्यान दें: मेनिफ़ेस्ट V3, आम तौर पर Chrome 88 या इसके बाद के वर्शन पर काम करता है. Chrome के बाद के वर्शन में जोड़ी गई एक्सटेंशन की सुविधाओं के बारे में जानने के लिए, सहायता से जुड़ी जानकारी के लिए एपीआई के रेफ़रंस दस्तावेज़ देखें. अगर आपके एक्सटेंशन को किसी खास एपीआई की ज़रूरत है, तो मेनिफ़ेस्ट फ़ाइल में Chrome का कम से कम वर्शन तय किया जा सकता है.

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

आर्बिट्रेरी स्ट्रिंग को चलाने की सुविधा हटाना

अब executeScript(), eval(), और new Function() का इस्तेमाल करके, बाहरी लॉजिक को लागू नहीं किया जा सकता.

• सभी बाहरी कोड (JS, Wasm, CSS) को अपने एक्सटेंशन बंडल में ले जाएं.
• स्क्रिप्ट और स्टाइल के रेफ़रंस अपडेट करें, ताकि एक्सटेंशन बंडल से संसाधन लोड किए जा सकें.
• रनटाइम के दौरान संसाधन यूआरएल बनाने के लिए, chrome.runtime.getURL() का इस्तेमाल करें.
• सैंडबॉक्स किए गए iframe का इस्तेमाल करें: eval और new Function(...) अब भी सैंडबॉक्स किए गए iframe में काम करते हैं. ज़्यादा जानकारी के लिए, सैंडबॉक्स किए गए iframe के बारे में गाइड पढ़ें.

executeScript() तरीका अब tabs नेमस्पेस के बजाय scripting नेमस्पेस में है. कॉल अपडेट करने के बारे में जानकारी के लिए, executeScript() को दूसरी जगह ले जाना लेख पढ़ें.

कुछ खास मामलों में, अब भी मनमुताबिक स्ट्रिंग को एक्ज़ीक्यूट किया जा सकता है:

• insertCSS का इस्तेमाल करके, रिमोट होस्ट की गई स्टाइलशीट को वेब पेज में इंजेक्ट करना
• chrome.devtools का इस्तेमाल करने वाले एक्सटेंशन के लिए: inspectWindow.eval से, जांच किए गए पेज के कॉन्टेक्स्ट में JavaScript को लागू किया जा सकता है.
• डीबगर एक्सटेंशन, chrome.debugger.sendCommand का इस्तेमाल करके, डीबग टारगेट में JavaScript को एक्ज़ीक्यूट कर सकते हैं.

दूर से होस्ट किए गए कोड को हटाना

मेनिफ़ेस्ट V3 में, आपके एक्सटेंशन का पूरा लॉजिक, एक्सटेंशन पैकेज का हिस्सा होना चाहिए. Chrome Web Store की नीति के मुताबिक, अब रिमोटली होस्ट की गई फ़ाइलों को लोड और एक्ज़ीक्यूट नहीं किया जा सकता. उदाहरण के लिए:

• ये JavaScript फ़ाइलें, डेवलपर के सर्वर से पुल की जाती हैं.
• CDN पर होस्ट की गई कोई भी लाइब्रेरी.
• तीसरे पक्ष की बंडल की गई लाइब्रेरी, जो रिमोट होस्ट किए गए कोड को डाइनैमिक तरीके से फ़ेच करती हैं.

इस्तेमाल के उदाहरण और रिमोट होस्टिंग की वजह के आधार पर, अन्य तरीके उपलब्ध हैं. इस सेक्शन में, कुछ तरीकों के बारे में बताया गया है. अगर आपको रिमोट होस्ट किए गए कोड को मैनेज करने में समस्याएं आ रही हैं, तो हमारे पास इसके लिए दिशा-निर्देश उपलब्ध हैं.

कॉन्फ़िगरेशन पर आधारित सुविधाएं और लॉजिक

आपका एक्सटेंशन, रिमोट कॉन्फ़िगरेशन (उदाहरण के लिए, JSON फ़ाइल) को रनटाइम पर लोड और कैश मेमोरी में सेव करता है. कैश किए गए कॉन्फ़िगरेशन से यह तय होता है कि कौनसी सुविधाएं चालू हैं.

रिमोट सेवा के साथ बाहरी लॉजिक

आपका एक्सटेंशन, किसी रिमोट वेब सेवा को कॉल करता है. इससे कोड को निजी रखा जा सकता है और ज़रूरत के मुताबिक उसमें बदलाव किया जा सकता है. साथ ही, Chrome Web Store पर फिर से सबमिट करने की अतिरिक्त परेशानी से बचा जा सकता है.

सैंडबॉक्स किए गए iframe में, रिमोट तरीके से होस्ट किया गया कोड एम्बेड करना

रिमोट तरीके से होस्ट किए गए कोड को सैंडबॉक्स किए गए iframe में इस्तेमाल किया जा सकता है. कृपया ध्यान दें कि अगर कोड को एम्बेड किए गए पेज के DOM का ऐक्सेस चाहिए, तो यह तरीका काम नहीं करता.

तीसरे पक्ष की लाइब्रेरी बंडल करना

अगर React या Bootstrap जैसे किसी लोकप्रिय फ़्रेमवर्क का इस्तेमाल किया जा रहा है, जिसे पहले किसी बाहरी सर्वर से लोड किया जाता था, तो आपके पास छोटी की गई फ़ाइलों को डाउनलोड करने का विकल्प होता है. इसके बाद, उन्हें अपने प्रोजेक्ट में जोड़कर स्थानीय तौर पर इंपोर्ट किया जा सकता है. उदाहरण के लिए:

<script src="./react-dom.production.min.js"></script>
<link href="./bootstrap.min.css" rel="stylesheet">

किसी लाइब्रेरी को सर्विस वर्कर में शामिल करने के लिए, मेनिफ़ेस्ट में "background.type" कुंजी को "module" पर सेट करें और import स्टेटमेंट का इस्तेमाल करें.

चेतावनी: कुछ लाइब्रेरी (जैसे, Firebase) रनटाइम के दौरान, ज़रूरत के हिसाब से अतिरिक्त कोड फ़ेच करती हैं. इससे बचने के लिए, आपके पास दो विकल्प हैं. ऐसी लाइब्रेरी चुनी जा सकती है जो रिमोटली होस्ट किए गए कोड का इस्तेमाल नहीं करती. बिल्ड टाइम पर, सभी संभावित डाइनैमिक इंपोर्ट भी डाउनलोड किए जा सकते हैं. यहां Rollup.js का इस्तेमाल करके Firebase को बंडल करने वाली स्क्रिप्ट का उदाहरण दिया गया है.

टैब में इंजेक्ट की गई स्क्रिप्ट में बाहरी लाइब्रेरी का इस्तेमाल करना

इसके अलावा, रनटाइम के दौरान बाहरी लाइब्रेरी लोड की जा सकती हैं. इसके लिए, scripting.executeScript() को कॉल करते समय, उन्हें files ऐरे में जोड़ें. हालांकि, अब भी रनटाइम के दौरान डेटा को रिमोटली लोड किया जा सकता है.

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

फ़ंक्शन इंजेक्ट करना

अगर आपको ज़्यादा डाइनैमिक कॉन्टेंट चाहिए, तो scripting.executeScript() में मौजूद नई func प्रॉपर्टी का इस्तेमाल करें. इससे, कॉन्टेंट स्क्रिप्ट के तौर पर फ़ंक्शन इंजेक्ट किया जा सकता है. साथ ही, args प्रॉपर्टी का इस्तेमाल करके वैरिएबल पास किए जा सकते हैं.

Manifest V2

let name = 'World!';
chrome.tabs.executeScript({
  code: `alert('Hello, ${name}!')`
});

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

Manifest V3

async function getCurrentTab() {/* ... */}
let tab = await getCurrentTab();

function showAlert(givenName) {
  alert(`Hello, ${givenName}`);
}

let name = 'World';
chrome.scripting.executeScript({
  target: {tabId: tab.id},
  func: showAlert,
  args: [name],
});

बैकग्राउंड में चलने वाली सेवा के वर्कर में.

Chrome एक्सटेंशन के सैंपल वाली repo में, फ़ंक्शन इंजेक्शन का उदाहरण दिया गया है. इसे आज़माया जा सकता है. getCurrentTab() का उदाहरण, उस फ़ंक्शन के रेफ़रंस में दिया गया है.

समस्या हल करने के अन्य तरीके देखें

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

कॉन्टेंट सुरक्षा नीति को अपडेट करना

"content_security_policy" को manifest.json फ़ाइल से नहीं हटाया गया है. हालांकि, अब यह एक डिक्शनरी है, जो दो प्रॉपर्टी के साथ काम करती है: "extension_pages" और "sandbox".

Manifest V2

{
  ...
  "content_security_policy": "default-src 'self'"
  ...
}

Manifest V3

{
  ...
  "content_security_policy": {
    "extension_pages": "default-src 'self'",
    "sandbox": "..."
  }
  ...
}

extension_pages: यह आपके एक्सटेंशन के कॉन्टेक्स्ट को दिखाता है. इसमें एचटीएमएल फ़ाइलें और सर्विस वर्कर शामिल हैं.

ध्यान दें: इन पेज टाइप को chrome-extension:// प्रोटोकॉल से दिखाया जाता है. उदाहरण के लिए, आपके एक्सटेंशन का कोई पेज chrome-extension://EXTENSION_ID/foo.html.

है

sandbox: इसका मतलब, आपके एक्सटेंशन के इस्तेमाल किए गए किसी भी सैंडबॉक्स किए गए एक्सटेंशन पेज से है.

कॉन्टेंट की सुरक्षा से जुड़ी ऐसी नीतियां हटाएं जो काम नहीं करती हैं

Manifest V3 में, कॉन्टेंट की सुरक्षा के लिए नीति (सीएसपी) की कुछ ऐसी वैल्यू इस्तेमाल करने की अनुमति नहीं है जिन्हें Manifest V2 में इस्तेमाल किया जा सकता था."extension_pages" खास तौर पर, मेनिफ़ेस्ट V3 ऐसे एक्सटेंशन को अनुमति नहीं देता है जो रिमोट कोड को चलाने की अनुमति देते हैं. script-src, object-src, और worker-src डायरेक्टिव की वैल्यू सिर्फ़ ये हो सकती हैं:

• self
• none
• wasm-unsafe-eval
• सिर्फ़ अनपैक किए गए एक्सटेंशन के लिए: कोई भी लोकल होस्ट सोर्स, (http://localhost, http://127.0.0.1 या उन डोमेन पर कोई भी पोर्ट)

sandbox के लिए कॉन्टेंट सिक्योरिटी पॉलिसी की वैल्यू पर, इस तरह की कोई नई पाबंदी नहीं है.