chrome.devtools.inspectedWindow

ब्यौरा

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

Developer Tools API के इस्तेमाल के बारे में सामान्य जानकारी के लिए, DevTool API की खास जानकारी देखें.

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

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

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

मेनिफ़ेस्ट

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

"devtools_page"

जांच की गई विंडो में कोड चलाएं

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

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

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

चेतावनी: ऊपर बताई गई सुरक्षा से जुड़ी बातों की वजह से, जांच किए गए पेज के DOM डेटा को ऐक्सेस करने के लिए, scripting.executeScript तरीका एक एक्सटेंशन का पसंदीदा तरीका है. यह तरीका उन मामलों में इस्तेमाल होता है जहां जांचे गए पेज के लिए JavaScript की स्थिति का ऐक्सेस देना ज़रूरी नहीं होता.

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

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

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

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-sample डेटा स्टोर करने की जगह से devtools API के उदाहरण इंस्टॉल करें.

टाइप

Resource

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

प्रॉपर्टी

• यूआरएल

  स्ट्रिंग

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

• getContent

  void

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

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

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

  • कॉलबैक

    फ़ंक्शन

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

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

    • वीडियो

      स्ट्रिंग

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

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

      स्ट्रिंग

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

• setContent

  void

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

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

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

  • वीडियो

    स्ट्रिंग

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

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

    boolean

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

  • कॉलबैक

    फ़ंक्शन ज़रूरी नहीं

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

    (error?: object)=>void

    • गड़बड़ी

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

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

प्रॉपर्टी

tabId

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

टाइप

नंबर

तरीके

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 ScriptActionContext, accessContentScriptContext पर 'सही' सेटिंग को बदल देता है.

  • useContentScriptContext

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

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

• कॉलबैक

  फ़ंक्शन ज़रूरी नहीं

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

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

  • नतीजा

    ऑब्जेक्ट

    इवैलुएशन का नतीजा.

  • exceptionInfo

    ऑब्जेक्ट

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

    • कोड

      स्ट्रिंग

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

    • ब्यौरा

      स्ट्रिंग

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

    • विवरण

      कोई भी[]

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

    • isError

      boolean

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

    • isException

      boolean

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

    • 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

  • संसाधन

    संसाधन

  • वीडियो

    स्ट्रिंग