ब्यौरा
जांची गई विंडो से इंटरैक्ट करने के लिए, chrome.devtools.inspectedWindow
API का इस्तेमाल करें: जांच किए गए पेज के लिए टैब आईडी पाएं, जांच की गई विंडो के हिसाब से कोड की जांच करें, पेज को फिर से लोड करें या पेज में संसाधनों की सूची पाएं.
Developer Tools API के इस्तेमाल के बारे में सामान्य जानकारी के लिए, DevTool API की खास जानकारी देखें.
tabId
प्रॉपर्टी से टैब आइडेंटिफ़ायर मिलता है. इसका इस्तेमाल chrome.tabs.*
एपीआई कॉल के साथ किया जा सकता है. हालांकि, कृपया ध्यान दें कि सुरक्षा की वजह से डेवलपर टूल एक्सटेंशन पेजों को chrome.tabs.*
एपीआई नहीं दिखाया जाता है—आपको टैब आईडी को बैकग्राउंड पेज पर भेजना होगा और वहां से chrome.tabs.*
एपीआई फ़ंक्शन शुरू करना होगा.
जांच किए गए पेज को फिर से लोड करने के लिए, reload
तरीके का इस्तेमाल किया जा सकता है. इसके अलावा, कॉलर, उपयोगकर्ता एजेंट स्ट्रिंग के लिए एक बदलाव तय कर सकता है. इसके अलावा, यह एक ऐसी स्क्रिप्ट जिसे पेज लोड होने पर जल्दी इंजेक्ट किया जाएगा या कैश मेमोरी में सेव किए गए संसाधनों को ज़बरदस्ती फिर से लोड करने का विकल्प तय कर सकता है.
जिस पेज की जांच की गई है उसमें संसाधनों की सूची (दस्तावेज़, स्टाइलशीट, स्क्रिप्ट, इमेज वगैरह) पाने के लिए, getResources
कॉल और onResourceContent
इवेंट का इस्तेमाल करें. संसाधन के कॉन्टेंट में बदलाव करने के लिए, onResourceContentCommitted
इवेंट के साथ-साथ Resource
क्लास के getContent
और setContent
तरीकों का इस्तेमाल किया जा सकता है. उदाहरण के लिए, कोई बाहरी एडिटर.
मेनिफ़ेस्ट
जांच की गई विंडो में कोड चलाएं
eval
तरीके से, एक्सटेंशन को जांच किए गए पेज के संदर्भ में JavaScript कोड चलाने की सुविधा मिलती है. यह तरीका तब कारगर साबित होता है, जब इसे सही संदर्भ में इस्तेमाल किया जाता है और गलत तरीके से इस्तेमाल करना खतरनाक होता है. tabs.executeScript
वाले तरीके का इस्तेमाल सिर्फ़ तब करें, जब आपको eval
तरीके से मिलने वाली किसी खास सुविधा की ज़रूरत हो.
यहां eval
और tabs.executeScript
तरीकों के बीच मुख्य अंतर बताए गए हैं:
eval
तरीके में, आकलन किए जा रहे कोड के लिए किसी आइसोलेटेड वर्ल्ड का इस्तेमाल नहीं किया जाता. इसलिए, जांच की गई विंडो की JavaScript स्टेट को ऐक्सेस किया जा सकता है. इस तरीके का इस्तेमाल तब करें, जब जांच किए गए पेज की JavaScript स्थिति को ऐक्सेस करना ज़रूरी हो.- जिस कोड की जांच की जा रही है उसे चलाने के कॉन्टेक्स्ट में, Developer Tools console एपीआई शामिल होता है.
उदाहरण के लिए, कोड
inspect
और$0
का इस्तेमाल कर सकता है. - जांचा गया कोड, एक्सटेंशन कॉलबैक को पास की गई वैल्यू दिखा सकता है. दिखाई गई वैल्यू, एक मान्य JSON ऑब्जेक्ट होना चाहिए. इसमें सिर्फ़ शुरुआती JavaScript टाइप और दूसरे JSON ऑब्जेक्ट के एसाइकल रेफ़रंस हो सकते हैं. कृपया जांच किए गए पेज से मिले डेटा को प्रोसेस करते समय ज़्यादा सावधानी बरतें. इसे लागू करने का कॉन्टेक्स्ट, जांच किए गए पेज से ही कंट्रोल होता है. नुकसान पहुंचाने वाला कोई पेज, एक्सटेंशन में वापस भेजे जाने वाले डेटा पर असर डाल सकता है.
ध्यान दें कि किसी पेज में 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,
)
जांच किए गए पेज से संसाधनों की सूची लाता है.
पैरामीटर
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,
)
जांच किए गए पेज में कोई नया संसाधन जोड़े जाने पर सक्रिय होता है.
onResourceContentCommitted
chrome.devtools.inspectedWindow.onResourceContentCommitted.addListener(
callback: function,
)
संसाधन में एक नया बदलाव किए जाने पर सक्रिय होता है (उदाहरण के लिए, उपयोगकर्ता डेवलपर टूल में संसाधन के बदलाव किए गए वर्शन को सेव करता है).