chrome.devtools.inspectedWindow

ब्यौरा

जांच की गई विंडो से इंटरैक्ट करने के लिए, chrome.devtools.inspectedWindow API का इस्तेमाल करें: जांच किए गए पेज के लिए टैब आईडी पाएं, जांच की गई विंडो के हिसाब से कोड का आकलन करें, पेज को फिर से लोड करें या पेज में मौजूद संसाधनों की सूची पाएं.

मेनिफ़ेस्ट

इस एपीआई का इस्तेमाल करने के लिए, मेनिफ़ेस्ट में इन कुंजियों का एलान करना ज़रूरी है.

"devtools_page"

जांच की गई विंडो से इंटरैक्ट करने के लिए, chrome.devtools.inspectedWindow का इस्तेमाल करें: इसके लिए टैब आईडी पाएं वह जांचा गया पेज, जिस विंडो की जांच की गई है उसके संदर्भ में कोड का आकलन करें, पेज को फिर से लोड करें या पेज में मौजूद संसाधनों की सूची पर क्लिक करें.

डेवलपर टूल एपीआई इस्तेमाल करने के बारे में सामान्य जानकारी के लिए, DevTools API की खास जानकारी देखें.

खास जानकारी

tabId प्रॉपर्टी से टैब आइडेंटिफ़ायर मिलता है, जिसे chrome.tabs.* के साथ इस्तेमाल किया जा सकता है एपीआई कॉल. हालांकि, कृपया ध्यान रखें कि chrome.tabs.* एपीआई को डेवलपर टूल की अनुमति नहीं दी जाती सुरक्षा से जुड़ी वजहों के चलते एक्सटेंशन पेज इस्तेमाल किए जा सकते हैं—आपको टैब आईडी को बैकग्राउंड में पास करना होगा पेज पर जाएं और वहां से chrome.tabs.* एपीआई फ़ंक्शन शुरू करें.

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

संसाधनों की सूची पाने के लिए, getResources कॉल और onResourceContent इवेंट का इस्तेमाल करें जांच किए गए पेज में मौजूद दस्तावेज़, स्टाइलशीट, स्क्रिप्ट, इमेज वगैरह. getContent और Resource क्लास के setContent तरीके और onResourceContentCommitted इवेंट हो सकते हैं उसका इस्तेमाल संसाधन के कॉन्टेंट में बदलाव करने के लिए किया जाना चाहिए. उदाहरण के लिए, कोई बाहरी एडिटर.

जांच की गई विंडो में कोड चलाया जा रहा है

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

eval और tabs.executeScript तरीकों के बीच मुख्य अंतर यहां दिया गया है:

  • eval तरीका, मूल्यांकन किए जा रहे कोड के लिए किसी आइसोलेटेड वर्ल्ड का इस्तेमाल नहीं करता. इसलिए, JavaScript जांच की गई विंडो की स्थिति को कोड ऐक्सेस कर सकता है. इस तरीके का इस्तेमाल तब करें, जब जांच किए गए पेज की JavaScript स्थिति ज़रूरी है.
  • जिस कोड का आकलन किया जा रहा है उसे लागू करने के कॉन्टेक्स्ट में Developer Tools Console API शामिल है. उदाहरण के लिए, कोड में inspect और $0 का इस्तेमाल किया जा सकता है.
  • जांचा गया कोड, एक्सटेंशन कॉलबैक में दी गई वैल्यू दिखा सकता है. लौटाया गया मान एक मान्य JSON ऑब्जेक्ट होना चाहिए (इसमें सिर्फ़ प्रिमिटिव JavaScript टाइप और असाइक्लिक शामिल हो सकते हैं) अन्य JSON ऑब्जेक्ट के रेफ़रंस). कृपया मिलने वाले डेटा को प्रोसेस करते समय ज़्यादा सावधानी बरतें जांचे गए पेज से—लागू करने का संदर्भ मुख्य रूप से जांच किए गए पेज से कंट्रोल होता है; एक नुकसान पहुंचाने वाले पेज, एक्सटेंशन में दिखाए जाने वाले डेटा पर असर डाल सकते हैं.

ध्यान दें कि किसी पेज में, JavaScript लागू करने के अलग-अलग कॉन्टेक्स्ट शामिल हो सकते हैं. हर फ़्रेम में इसके अलावा, हर उस एक्सटेंशन के लिए एक अतिरिक्त संदर्भ भी होना चाहिए जिसमें कॉन्टेंट स्क्रिप्ट चल रही हों फ़्रेम.

डिफ़ॉल्ट रूप से, eval तरीका जांच किए गए पेज के मुख्य फ़्रेम के हिसाब से काम करता है.

eval तरीके में एक वैकल्पिक दूसरा तर्क दिया जाता है. इसका इस्तेमाल करके, यह बताया जा सकता है कि किस कॉन्टेक्स्ट में कोड का आकलन किया जाता है. इस options ऑब्जेक्ट में, इनमें से एक या उससे ज़्यादा कुंजियां हो सकती हैं:

frameURL
जांच किए गए पेज के मुख्य फ़्रेम के अलावा, किसी दूसरे फ़्रेम के बारे में बताने के लिए इसका इस्तेमाल करें.
contextSecurityOrigin
किसी तय फ़्रेम में, उसके वेब ऑरिजिन के हिसाब से कोई कॉन्टेक्स्ट चुनने के लिए इसका इस्तेमाल करें.
useContentScriptContext
अगर सही है, तो स्क्रिप्ट को उसी कॉन्टेक्स्ट में एक्ज़ीक्यूट करें जिस कॉन्टेक्स्ट में एक्सटेंशन के कॉन्टेंट स्क्रिप्ट को लागू किया गया है. (इसके बराबर और एक्सटेंशन के वेब पेज को कॉन्टेक्स्ट सिक्योरिटी ऑरिजिन के तौर पर शामिल करना.) इसका इस्तेमाल इन कामों के लिए किया जा सकता है कॉन्टेंट स्क्रिप्ट के साथ डेटा का लेन-देन करना.

उदाहरण

यहां दिया गया कोड, jQuery के उस वर्शन की जांच करता है जिसका इस्तेमाल जांच किए गए पेज के लिए किया गया है:

chrome.devtools.inspectedWindow.eval(
  "jQuery.fn.jquery",
  function(result, isException) {
    if (isException) {
      console.log("the page is not using jQuery");
    } else {
      console.log("The page is using jQuery v" + result);
    }
  }
);

इस एपीआई को आज़माने के लिए, chrome-extension-samples से devtools API के उदाहरण इंस्टॉल करें डेटा स्टोर करने की जगह.

टाइप

Resource

जांच किए गए पेज में मौजूद कोई संसाधन, जैसे कि दस्तावेज़, स्क्रिप्ट या इमेज.

प्रॉपर्टी

  • url

    स्ट्रिंग

    संसाधन का यूआरएल.

  • getContent

    अमान्य

    संसाधन का कॉन्टेंट फ़ेच करता है.

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

    (callback: function) => {...}

    • कॉलबैक

      फ़ंक्शन

      callback पैरामीटर ऐसा दिखता है: 

      (content: string, encoding: string) => void

      • कॉन्टेंट

        स्ट्रिंग

        संसाधन का कॉन्टेंट (संभावित रूप से कोड में बदला गया).

      • कोड में बदलने का तरीका

        स्ट्रिंग

        अगर कॉन्टेंट को कोड में नहीं बदला गया है, तो कोड खाली है. अगर कोड में कोई बदलाव नहीं किया गया है, तो इस फ़ील्ड को खाली छोड़ा जा सकता है. फ़िलहाल, सिर्फ़ base64 का इस्तेमाल किया जा सकता है.

  • कॉन्टेंट सेट करें

    अमान्य

    संसाधन का कॉन्टेंट सेट करता है.

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

    (content: string, commit: boolean, callback?: function) => {...}

    • कॉन्टेंट

      स्ट्रिंग

      संसाधन का नया कॉन्टेंट. फ़िलहाल, सिर्फ़ टेक्स्ट टाइप वाले संसाधन इस्तेमाल किए जा सकते हैं.

    • डेटाबेस के बदलावों को सेव करें

      बूलियन

      अगर उपयोगकर्ता ने संसाधन में बदलाव कर लिया है और संसाधन का नया कॉन्टेंट मौजूद रहना चाहिए, तो 'सही'; अगर यह कोई मामूली बदलाव है, तो गलत है. ऐसा तब होता है, जब उपयोगकर्ता संसाधन में बदलाव कर रहा हो.

    • कॉलबैक

      फ़ंक्शन वैकल्पिक

      callback पैरामीटर ऐसा दिखता है: 

      (error?: object) => void

      • गड़बड़ी

        ऑब्जेक्ट ज़रूरी नहीं

        अगर संसाधन का कॉन्टेंट सही तरीके से सेट हो गया था, तो 'तय नहीं है' पर सेट करें; गड़बड़ी के बारे में बताता है.

प्रॉपर्टी

tabId

उस टैब का आईडी जिसकी जांच की जा रही है. इस आईडी का इस्तेमाल chrome.tabs के साथ किया जा सकता है.* एपीआई.

टाइप

संख्या

तरीके

eval()

chrome.devtools.inspectedWindow.eval(
  expression: string,
  options?: object,
  callback?: function,
)

यह जांच किए गए पेज के मुख्य फ़्रेम के हिसाब से JavaScript एक्सप्रेशन का आकलन करता है. एक्सप्रेशन का आकलन JSON के हिसाब से होना चाहिए. ऐसा न होने पर, एक अपवाद दिया जाता है. eval फ़ंक्शन, इवैलुएशन के दौरान होने वाले DevTools की तरफ़ से हुई गड़बड़ी या JavaScript के अपवाद को रिपोर्ट कर सकता है. दोनों ही मामलों में, कॉलबैक का result पैरामीटर undefined होता है. DevTools साइड की गड़बड़ी के मामले में, isException पैरामीटर शून्य नहीं होता है. साथ ही, isError पैरामीटर को 'सही' पर सेट किया गया है और code को गड़बड़ी के कोड पर सेट किया गया है. JavaScript की गड़बड़ी के मामले में, isException को 'सही' पर सेट किया जाता है और value को थ्रो किए गए ऑब्जेक्ट की स्ट्रिंग वैल्यू पर सेट किया जाता है.

पैरामीटर

  • एक्सप्रेशन

    स्ट्रिंग

    आकलन करने के लिए एक्सप्रेशन.

  • विकल्प

    ऑब्जेक्ट ज़रूरी नहीं

    विकल्प पैरामीटर में एक या उससे ज़्यादा विकल्प हो सकते हैं.

    • frameURL

      स्ट्रिंग ज़रूरी नहीं

      अगर बताया गया, तो एक्सप्रेशन का आकलन उस iframe पर किया जाता है जिसके यूआरएल का मिलान तय किए गए यूआरएल से होता है. डिफ़ॉल्ट रूप से, एक्सप्रेशन का आकलन, जांच किए गए पेज के सबसे ऊपर वाले फ़्रेम में किया जाता है.

    • scriptExecutionContext

      स्ट्रिंग ज़रूरी नहीं

      Chrome 107 और उसके बाद वाले वर्शन

      बताए गए ऑरिजिन से मेल खाने वाले किसी एक्सटेंशन की कॉन्टेंट स्क्रिप्ट के कॉन्टेक्स्ट में एक्सप्रेशन का आकलन करें. अगर दिया गया है, तो script सर्वर इवेंट, 'सही' को बदल देता है सेटिंग का इस्तेमाल करें.

    • useContentScriptContext

      बूलियन ज़रूरी नहीं

      कॉलिंग एक्सटेंशन की कॉन्टेंट स्क्रिप्ट के संदर्भ में एक्सप्रेशन का आकलन करें. हालांकि, इसके लिए यह ज़रूरी है कि जांच किए गए पेज में कॉन्टेंट स्क्रिप्ट पहले से ही डाली गई हो. अगर नहीं, तो एक्सप्रेशन का आकलन नहीं किया जाता और कॉलबैक को एक ऐसे ऑब्जेक्ट पर सेट अपवाद पैरामीटर के साथ शुरू किया जाता है जिसमें isError फ़ील्ड 'सही' पर सेट हो और code फ़ील्ड को E_NOTFOUND पर सेट किया गया हो.

  • कॉलबैक

    फ़ंक्शन वैकल्पिक

    callback पैरामीटर ऐसा दिखता है: 

    (result: object, exceptionInfo: object) => void

    • नतीजा

      ऑब्जेक्ट

      आकलन का नतीजा.

    • exceptionInfo

      ऑब्जेक्ट

      एक्सप्रेशन का आकलन करते समय कोई अपवाद होने की जानकारी देने वाला ऑब्जेक्ट.

      • कोड

        स्ट्रिंग

        सेट करें कि एक्सप्रेशन का आकलन होने से पहले, DevTools की तरफ़ कोई गड़बड़ी हुई है या नहीं.

      • ब्यौरा

        स्ट्रिंग

        सेट करें कि एक्सप्रेशन का आकलन होने से पहले, DevTools की तरफ़ कोई गड़बड़ी हुई है या नहीं.

      • विवरण

        कोई भी[]

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

      • isError

        बूलियन

        सेट करें कि एक्सप्रेशन का आकलन होने से पहले, DevTools की तरफ़ कोई गड़बड़ी हुई है या नहीं.

      • isException

        बूलियन

        सेट करें कि जांचा गया कोड, बिना हैंडल किए अपवाद देता है या नहीं.

      • value

        स्ट्रिंग

        सेट करें कि जांचा गया कोड, बिना हैंडल किए अपवाद देता है या नहीं.

getResources()

chrome.devtools.inspectedWindow.getResources(
  callback: function,
)

जांच किए गए पेज से संसाधनों की सूची लाता है.

पैरामीटर

  • कॉलबैक

    फ़ंक्शन

    callback पैरामीटर ऐसा दिखता है: 

    (resources: Resource[]) => void

    • संसाधन खोजें

      संसाधन[]

      पेज में मौजूद संसाधन.

reload()

chrome.devtools.inspectedWindow.reload(
  reloadOptions?: object,
)

जांच किए गए पेज को फिर से लोड करता है.

पैरामीटर

  • reloadOptions

    ऑब्जेक्ट ज़रूरी नहीं

    • ignoreCache

      बूलियन ज़रूरी नहीं

      सही होने पर, लोडर जांच किए गए सभी पेज रिसॉर्स की कैश मेमोरी को बायपास कर देगा. ये रिसॉर्स, load इवेंट के चालू होने से पहले लोड होते हैं. इसका असर, जांच की गई विंडो या डेवलपर टूल विंडो में Ctrl+Shift+R दबाने जैसा होता है.

    • injectedScript

      स्ट्रिंग ज़रूरी नहीं

      अगर बताया गया है, तो लोड होने के तुरंत बाद, स्क्रिप्ट को जांचे गए पेज के हर फ़्रेम में इंजेक्ट किया जाएगा. इसे फ़्रेम की किसी भी स्क्रिप्ट से पहले इंजेक्ट किया जाएगा. फिर से लोड होने पर स्क्रिप्ट इंजेक्ट नहीं की जाएगी—उदाहरण के लिए, अगर उपयोगकर्ता Ctrl+R दबाता है.

    • userAgent

      स्ट्रिंग ज़रूरी नहीं

      अगर बताया गया, तो स्ट्रिंग जांच किए गए पेज के संसाधनों को लोड करते समय भेजे जाने वाले User-Agent एचटीटीपी हेडर की वैल्यू को बदल देगी. यह स्ट्रिंग, जांच किए गए पेज में चल रही किसी भी स्क्रिप्ट पर दिखाई जाने वाली navigator.userAgent प्रॉपर्टी की वैल्यू को भी बदल देगी.

इवेंट

onResourceAdded

chrome.devtools.inspectedWindow.onResourceAdded.addListener(
  callback: function,
)

जांच किए गए पेज में नया संसाधन जोड़े जाने पर सक्रिय होता है.

पैरामीटर

  • कॉलबैक

    फ़ंक्शन

    callback पैरामीटर ऐसा दिखता है: 

    (resource: Resource) => void

onResourceContentCommitted

chrome.devtools.inspectedWindow.onResourceContentCommitted.addListener(
  callback: function,
)

संसाधन का नया संशोधन होने पर सक्रिय होता है (उदा. जब उपयोगकर्ता संसाधन के किसी बदलाव किए गए वर्शन को डेवलपर टूल में सेव करता है).

पैरामीटर

  • कॉलबैक

    फ़ंक्शन

    callback पैरामीटर ऐसा दिखता है: 

    (resource: Resource, content: string) => void