chrome.declarativeContent

refresh date: 2026-09-25 robots: noindex

ब्यौरा

chrome.declarativeContent API का इस्तेमाल करके, पेज के कॉन्टेंट के आधार पर कार्रवाइयां की जा सकती हैं. इसके लिए, पेज के कॉन्टेंट को पढ़ने की अनुमति की ज़रूरत नहीं होती.

अनुमतियां

declarativeContent

लेख पढ़ें

इस्तेमाल

Declarative Content API की मदद से, अपने एक्सटेंशन की कार्रवाई को किसी वेब पेज के यूआरएल के हिसाब से चालू किया जा सकता है. इसके अलावा, अगर कोई सीएसएस सिलेक्टर पेज पर मौजूद किसी एलिमेंट से मेल खाता है, तो भी एक्सटेंशन की कार्रवाई को चालू किया जा सकता है. इसके लिए, होस्ट अनुमतियां जोड़ने या कॉन्टेंट स्क्रिप्ट इंजेक्ट करने की ज़रूरत नहीं होती.

उपयोगकर्ता के एक्सटेंशन की कार्रवाई पर क्लिक करने के बाद, किसी पेज से इंटरैक्ट करने के लिए activeTab अनुमति का इस्तेमाल करें.

नियम

नियमों में शर्तें और कार्रवाइयां शामिल होती हैं. अगर कोई भी शर्त पूरी होती है, तो सभी कार्रवाइयां पूरी की जाती हैं. कार्रवाइयां setIcon और showAction हैं.

PageStateMatcher, वेब पेजों से तब ही मैच करता है, जब सूची में दिए गए सभी मानदंड पूरे किए गए हों. यह पेज के यूआरएल, सीएसएस कंपाउंड सिलेक्टर या किसी पेज की बुकमार्क की गई स्थिति से मेल खा सकता है. यहां दिया गया नियम, Google पेजों पर एक्सटेंशन की कार्रवाई को तब चालू करता है, जब पासवर्ड फ़ील्ड मौजूद हो:

let rule1 = {
  conditions: [
    new chrome.declarativeContent.PageStateMatcher({
      pageUrl: { hostSuffix: '.google.com', schemes: ['https'] },
      css: ["input[type='password']"]
    })
  ],
  actions: [ new chrome.declarativeContent.ShowAction() ]
};

अगर आपको वीडियो वाली Google साइटों के लिए भी एक्सटेंशन की कार्रवाई चालू करनी है, तो दूसरी शर्त जोड़ी जा सकती है. ऐसा इसलिए, क्योंकि हर शर्त, तय की गई सभी कार्रवाइयों को ट्रिगर करने के लिए काफ़ी होती है:

let rule2 = {
  conditions: [
    new chrome.declarativeContent.PageStateMatcher({
      pageUrl: { hostSuffix: '.google.com', schemes: ['https'] },
      css: ["input[type='password']"]
    }),
    new chrome.declarativeContent.PageStateMatcher({
      css: ["video"]
    })
  ],
  actions: [ new chrome.declarativeContent.ShowAction() ]
};

onPageChanged इवेंट से यह पता चलता है कि किसी नियम की कम से कम एक शर्त पूरी हुई है या नहीं. अगर शर्त पूरी हुई है, तो कार्रवाइयां लागू होती हैं. नियम, ब्राउज़िंग सेशन में बने रहते हैं. इसलिए, एक्सटेंशन इंस्टॉल करते समय, आपको पहले removeRules का इस्तेमाल करके, पहले से इंस्टॉल किए गए नियमों को मिटाना चाहिए. इसके बाद, नए नियमों को रजिस्टर करने के लिए addRules का इस्तेमाल करना चाहिए.

chrome.runtime.onInstalled.addListener(function(details) {
  chrome.declarativeContent.onPageChanged.removeRules(undefined, function() {
    chrome.declarativeContent.onPageChanged.addRules([rule2]);
  });
});

activeTab अनुमति के साथ, आपका एक्सटेंशन अनुमति से जुड़ी कोई चेतावनी नहीं दिखाएगा. साथ ही, जब उपयोगकर्ता एक्सटेंशन के लिए कार्रवाई पर क्लिक करेगा, तब यह सिर्फ़ काम के पेजों पर चलेगा.

पेज के यूआरएल का मिलान

यूआरएल की शर्तें पूरी होने पर, PageStateMatcher.pageurl मैच करता है. सबसे सामान्य मानदंड, होस्ट, पाथ या यूआरएल का कॉनकैटेनेशन होता है. इसके बाद, इसमें शामिल है, इसके बराबर है, प्रीफ़िक्स या सुफ़िक्स होता है. यहां दी गई टेबल में कुछ उदाहरण दिए गए हैं:

नियम और शर्तें मैच
{ hostSuffix: 'google.com' } Google के सभी यूआरएल
{ pathPrefix: '/docs/extensions' } एक्सटेंशन के दस्तावेज़ों के यूआरएल
{ urlContains: 'developer.chrome.com' } Chrome डेवलपर के लिए उपलब्ध दस्तावेज़ों के सभी यूआरएल

सभी मानदंड केस-सेंसिटिव होते हैं. शर्तों की पूरी सूची देखने के लिए, UrlFilter देखें.

सीएसएस मैचिंग

PageStateMatcher.css शर्तों में कंपाउंड सिलेक्टर होने चाहिए. इसका मतलब है कि अपने सिलेक्टर में, व्हाइटस्पेस या ">" जैसे कॉम्बिनेटर शामिल नहीं किए जा सकते. इससे Chrome को सिलेक्टर को ज़्यादा असरदार तरीके से मैच करने में मदद मिलती है.

कंपाउंड सिलेक्टर (ठीक है) कॉम्प्लेक्स सिलेक्टर (ठीक नहीं हैं)
a div p
iframe.special[src^='http'] p>span.highlight
ns|* p + ol
#abcd:checked p::first-line

सीएसएस की शर्तें सिर्फ़ दिखाए गए एलिमेंट से मेल खाती हैं: अगर आपके सिलेक्टर से मेल खाने वाला कोई एलिमेंट display:none है या उसके पैरंट एलिमेंट में से कोई एक display:none है, तो इससे शर्त मेल नहीं खाती. visibility:hidden की मदद से स्टाइल किए गए एलिमेंट, स्क्रीन से बाहर मौजूद एलिमेंट या अन्य एलिमेंट से छिपे हुए एलिमेंट, अब भी आपकी शर्त से मेल खा सकते हैं.

बुकमार्क की गई स्थिति से मैच करना

PageStateMatcher.isBookmarked शर्त की मदद से, उपयोगकर्ता की प्रोफ़ाइल में मौजूद मौजूदा यूआरएल की बुकमार्क की गई स्थिति को मैच किया जा सकता है. इस शर्त का इस्तेमाल करने के लिए, एक्सटेंशन के मेनिफ़ेस्ट में "bookmarks" अनुमति का एलान किया जाना चाहिए.

टाइप

टाइप

ImageData

PageStateMatcher

यह कुकी, अलग-अलग शर्तों के आधार पर किसी वेब पेज की स्थिति से मेल खाती है.

प्रॉपर्टी

  • कंस्ट्रक्टर

    void

    constructor फ़ंक्शन इस तरह दिखता है: 

    (arg: PageStateMatcher) => {...}

  • css

    string[] ज़रूरी नहीं है

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

  • isBookmarked

    boolean ज़रूरी नहीं है

    Chrome 45 या इसके बाद के वर्शन

    अगर पेज की बुकमार्क की गई स्थिति, तय की गई वैल्यू के बराबर है, तो यह शर्त पूरी होती है. इसके लिए, बुकमार्क करने की अनुमति ज़रूरी है.

  • pageUrl

    UrlFilter ज़रूरी नहीं है

    अगर पेज के टॉप-लेवल यूआरएल के लिए UrlFilter की शर्तें पूरी होती हैं, तो यह मैच करता है.

RequestContentScript

कॉन्टेंट स्क्रिप्ट को इंजेक्ट करने वाला इवेंट ऐक्शन.

चेतावनी: यह सुविधा अब भी एक्सपेरिमेंट के तौर पर उपलब्ध है. यह Chrome के स्टेबल बिल्ड पर काम नहीं करती.

प्रॉपर्टी

  • कंस्ट्रक्टर

    void

    constructor फ़ंक्शन इस तरह दिखता है: 

    (arg: RequestContentScript) => {...}

  • allFrames

    boolean ज़रूरी नहीं है

    कॉन्टेंट स्क्रिप्ट, मैच करने वाले पेज के सभी फ़्रेम में चलती है या सिर्फ़ टॉप फ़्रेम में. डिफ़ॉल्ट रूप से, यह false पर सेट होता है.

  • css

    string[] ज़रूरी नहीं है

    कॉन्टेंट स्क्रिप्ट के हिस्से के तौर पर इंजेक्ट की जाने वाली सीएसएस फ़ाइलों के नाम.

  • js

    string[] ज़रूरी नहीं है

    कॉन्टेंट स्क्रिप्ट के हिस्से के तौर पर इंजेक्ट की जाने वाली JavaScript फ़ाइलों के नाम.

  • matchAboutBlank

    boolean ज़रूरी नहीं है

    about:blank और about:srcdoc पर कॉन्टेंट स्क्रिप्ट डालनी है या नहीं. डिफ़ॉल्ट रूप से, यह false पर सेट होता है.

SetIcon

यह इवेंट ऐक्शन, एक्सटेंशन के पेज ऐक्शन या ब्राउज़र ऐक्शन के लिए, n-डिप स्क्वेयर आइकॉन सेट करता है. ऐसा तब होता है, जब इससे जुड़ी शर्तें पूरी हो जाती हैं. इस कार्रवाई को होस्ट की अनुमतियों के बिना भी इस्तेमाल किया जा सकता है. हालांकि, एक्सटेंशन में कोई पेज या ब्राउज़र ऐक्शन होना चाहिए.

imageData या path में से कोई एक वैल्यू दी जानी चाहिए. ये दोनों डिक्शनरी हैं, जो पिक्सेल की संख्या को इमेज के तौर पर दिखाती हैं. imageData में इमेज को ImageData ऑब्जेक्ट के तौर पर दिखाया जाता है. उदाहरण के लिए, canvas एलिमेंट से. वहीं, path में इमेज को एक्सटेंशन के मेनिफ़ेस्ट के हिसाब से इमेज फ़ाइल के पाथ के तौर पर दिखाया जाता है. अगर scale स्क्रीन पिक्सल, डिवाइस के हिसाब से पिक्सल में फ़िट होते हैं, तो scale * n आइकॉन का इस्तेमाल किया जाता है. अगर वह स्केल मौजूद नहीं है, तो दूसरी इमेज का साइज़ बदलकर ज़रूरी साइज़ कर दिया जाता है.

प्रॉपर्टी

  • कंस्ट्रक्टर

    void

    constructor फ़ंक्शन इस तरह दिखता है: 

    (arg: SetIcon) => {...}

  • imageData

    ImageData | object ज़रूरी नहीं है

    सेट किए जाने वाले आइकॉन को दिखाने वाला ImageData ऑब्जेक्ट या डिक्शनरी {size -> ImageData}. अगर आइकॉन को डिक्शनरी के तौर पर तय किया गया है, तो इस्तेमाल की गई इमेज को स्क्रीन की पिक्सल डेंसिटी के हिसाब से चुना जाता है. अगर स्क्रीन स्पेस की एक यूनिट में फ़िट होने वाले इमेज पिक्सल की संख्या scale के बराबर है, तो scale * n साइज़ वाली इमेज चुनी जाती है. यहां n, यूज़र इंटरफ़ेस (यूआई) में आइकॉन का साइज़ है. कम से कम एक इमेज के बारे में बताना ज़रूरी है. ध्यान दें कि details.imageData = foo, details.imageData = {'16': foo} के बराबर होता है.

ShowAction

Chrome 97 और इसके बाद के वर्शन

यह एक एलान वाली इवेंट कार्रवाई है. इससे एक्सटेंशन के टूलबार ऐक्शन को चालू किया जाता है. ऐसा तब होता है, जब इससे जुड़ी शर्तें पूरी हो जाती हैं. इस कार्रवाई को होस्ट की अनुमतियों के बिना भी इस्तेमाल किया जा सकता है. अगर एक्सटेंशन के पास activeTab अनुमति है, तो पेज ऐक्शन पर क्लिक करने से, ऐक्टिव टैब का ऐक्सेस मिल जाता है.

जिन पेजों पर शर्तें पूरी नहीं होती हैं वहां एक्सटेंशन के टूलबार का ऐक्शन ग्रे-स्केल में दिखेगा. इस पर क्लिक करने से, ऐक्शन ट्रिगर होने के बजाय कॉन्टेक्स्ट मेन्यू खुलेगा.

प्रॉपर्टी

  • कंस्ट्रक्टर

    void

    constructor फ़ंक्शन इस तरह दिखता है: 

    (arg: ShowAction) => {...}

ShowPageAction

Chrome 97 से बंद कर दिया गया है

कृपया declarativeContent.ShowAction का इस्तेमाल करें.

यह एक डिक्लेरेटिव इवेंट ऐक्शन है. इससे एक्सटेंशन के पेज ऐक्शन को चालू किया जाता है. हालांकि, ऐसा तब ही होता है, जब इससे जुड़ी शर्तें पूरी हो जाती हैं. इस कार्रवाई का इस्तेमाल, होस्ट की अनुमतियों के बिना किया जा सकता है. हालांकि, एक्सटेंशन में पेज ऐक्शन होना चाहिए. अगर एक्सटेंशन के पास activeTab अनुमति है, तो पेज ऐक्शन पर क्लिक करने से, ऐक्टिव टैब का ऐक्सेस मिल जाता है.

जिन पेजों पर शर्तें पूरी नहीं होती हैं वहां एक्सटेंशन के टूलबार का ऐक्शन ग्रे-स्केल में दिखेगा. इस पर क्लिक करने से, ऐक्शन ट्रिगर होने के बजाय कॉन्टेक्स्ट मेन्यू खुलेगा.

प्रॉपर्टी

इवेंट

onPageChanged

Declarative Events API उपलब्ध कराता है. इसमें addRules, removeRules, और getRules शामिल हैं.

शर्तें

PageStateMatcher

कार्रवाइयां

RequestContentScript

SetIcon

ShowPageAction

ShowAction