Chrome में मॉनिटरिंग का अनुरोध करें


208

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

क्या प्रत्येक http अनुरोध को मज़बूती से देखने का एक तरीका है जो एक पृष्ठ क्रोम के भीतर से जावास्क्रिप्ट के माध्यम से बना रहा है?

[संपादित करें: 11/30/09 11:55]

वर्तमान में, इसे प्राप्त करने के लिए, मैं अपने अनुरोधों को देखने के लिए Chrome के बगल में Fiddler चला रहा हूं, लेकिन यदि ब्राउज़र के भीतर से इसे करने का कोई तरीका है, तो मैं इसे पसंद करूंगा।


2
मुझे एक ही समस्या है-मैंने यहां सभी समाधानों की कोशिश की। देव टूल्स में XHR विंडो के रिस्पांस भाग में कुछ भी नहीं दिखता है। यह सिर्फ दिखाता है "इस अनुरोध का कोई प्रतिक्रिया डेटा उपलब्ध नहीं है"। अगर मैं फायरबग का उपयोग करके समान कोड चलाता हूं, तो यह ठीक दिखाता है। cog dev टूल्स सेटिंग में, मैंने "Log XMLHttpRequest" पर टिक करने की कोशिश की है, लेकिन यह सहायता नहीं करता है (प्रतिक्रिया प्रकार अनुप्रयोग / json है)। मुझे फायरबग में सभी डिबगिंग करनी है। फायरबग भी JSON को अच्छी तरह से प्रारूपित करता है, क्रोम देव उपकरण नहीं है यदि आप इसे प्रतिक्रिया प्रदर्शित करने के लिए प्राप्त कर सकते हैं (जैसे ajax का उपयोग नहीं करके)।
जॉन लिटिल

जवाबों:


359

मुझे पता है कि यह एक पुराना धागा है लेकिन मुझे लगा कि मैं इसमें झंकार करूंगा।

वर्तमान में Chrome में एक समाधान बनाया गया है।

  1. डेवलपर टूल को सक्षम करने के लिए क्रोम के नए संस्करणों में उपयोग करें CTRL+SHIFT+Iया नेविगेट करें Current Page Control > Developer > Developer Tools। क्रोम के नए संस्करणों में, रिंच आइकन> टूल्स> डेवलपर टूल।) पर क्लिक करें।
  2. डेवलपर टूल के भीतर से Networkबटन पर क्लिक करें। यदि यह पहले से नहीं है, तो इसे सत्र के लिए या हमेशा सक्षम करें।
  3. "XHR"उप बटन पर क्लिक करें।
  4. एक पहल AJAX call
  5. आप देखेंगे कि आइटम बाएं कॉलम में दिखाई देने लगेंगे "Resources"
  6. संसाधन पर क्लिक करें और हेडर और रिटर्न सामग्री दिखाने वाले 2 टैब हैं।

2
धन्यवाद फिल! मैंने इसे अलग रख दिया था और ज्यादातर फिडलर पर भरोसा कर रहा था। लेकिन वह एक्सएचआर बटन वही है जिसकी मुझे तलाश थी: डी
वेस पी

कल ही मैं बात कर रहा था कि अगर क्रोम उपकरण ऐसा कर सकते हैं तो यह सही होगा, धन्यवाद।
जर्मन रोड्रिगेज

3
हाय सब, "एक्सएचआर उप-बटन" खोजने की कोशिश कर रहा हूं मुझे लगता है कि मैं इसे याद कर रहा हूं, क्या कोई मुझे बता सकता है कि वह कहां है? यह वही है जो मेरे इंस्पेक्टर को imgur.com/9e6yDcB
डेविड विलियम्स

2
यह केवल तब होता है जब एक AJAX कॉल को एक प्रतिक्रिया मिलती है, लेकिन यह आपको एक आउटगोइंग अनुरोध नहीं दिखाता है जो प्रतिक्रिया की उम्मीद नहीं कर सकता है। किसी को पता है कि कैसे सक्षम करने के लिए?
मोमो जूल

1
यदि पृष्ठ उसी विंडो पर पुनर्निर्देशित करता है, तो आप नेटवर्क टैब विकल्पों के शीर्ष पर 'संरक्षित लॉग' चेकबॉक्स का उपयोग कर सकते हैं (यदि आप सेटिंग में उसी विंडो में खोलने के लिए उस लिंक को बदल नहीं सकते हैं target='_self')। फिर, उदाहरण के लिए, आप उस फॉर्म से प्रतिक्रिया देख सकते हैं जो आपके द्वारा रीडायरेक्ट होने के बाद सबमिट की गई है। नए पृष्ठ लोड पर प्रतिक्रियाओं के ढेर के रूप में फिल्टर को भी नोटिस करना सुनिश्चित करें।
जेरेमीएस

57

इसका सबसे अद्यतित उत्तर है: वे डेवलपर टूल में 'नेटवर्क' बटन के तहत सूचीबद्ध हैं, अब 'संसाधन' के तहत नहीं, जैसे कि यह हुआ करता था।


5
यह वास्तव में जहां यह अब है, मुझे उन्नयन के बाद इसे खोजने के लिए स्टैक ओवरफ्लो खोज रहा था।
20 सितंबर को Kzqai

42

अपडेट करें

Chrome ने अनुरोधों का निरीक्षण करने के तरीके को बदल दिया और क्रोम से निर्यात किए गए लॉग के साथ कैटापुल्टस व्यूअर का उपयोग करने का सुझाव देता है : // net-export /

chrome://net-export/

और जानकारी

पुराने क्रोम संस्करण

इंस्पेक्टर ने जितना किया उससे अधिक विस्तृत जानकारी के लिए आप इस लिंक का उपयोग क्रोम में भी कर सकते हैं।

chrome://net-internals/#events

यह खुले रहने के दौरान ब्राउज़र के सभी अनुरोधों के लॉग को दिखाता है


क्या आप निर्यात कर सकते हैं?
पचेरियर

14

पता नहीं है कि यह किस क्रोम संस्करण के रूप में उपलब्ध है, लेकिन मुझे एक सेटिंग मिली 'कंसोल - लॉग XMLHttpRequests' (मैक पर क्रोम में डेवलपर टूल के निचले दाएं कोने में आइकन पर क्लिक करके)


3
यह XHR अनुरोधों की निगरानी करने का सबसे आसान और सबसे अच्छा तरीका है।
कोर्टमोन

6

अपने DevTools खोलें और सेटिंग्स तक पहुंचने के लिए F1 दबाएं। कंसोल अनुभाग देखें और "लॉग XMLHttpRequests" के लिए चेकबॉक्स जांचें।

अब आपके सभी ajax और अन्य समान अनुरोध कंसोल में लॉग इन होंगे।

मैं इस पद्धति को पसंद करता हूं क्योंकि यह आमतौर पर मुझे वह सब कुछ देखने की अनुमति देता है जो मैं नेटवर्क टैब पर जाने के बिना कंसोल में देख रहा हूं।


4

आप फ़िडलर का उपयोग कर सकते हैं जो एक अच्छा मुफ़्त उपकरण है।


1
हाँ, मेरे पास फिडलर है जो मैं यह करने के लिए उपयोग कर रहा हूं। बस ब्राउज़र के भीतर से इसे करने का एक तरीका खोज रहा है, क्योंकि यह थोड़ा अधिक सुविधाजनक है।
वेस पी

3

इस पोस्ट में मदद करने की कोशिश करने वाले सभी व्यक्ति को धन्यवाद

मेरे पास ubuntu 13.10 है और मेरा क्रोम संस्करण 34.0 है

मेरी स्थिति के लिए यह काम करता है

1.open developer tools in chrome(or use right click on your page and then select inspect element)
2.go to "Network" tab
3.find your ajax request in "Name Path" column 
4.click on the specific ajax link

अब आपको अनुरोध के सामने एक नया पैनल देखना चाहिए

in this panel select "Response" tab

1

फिल के चरण 5 में, "संसाधन" अब क्रोम के नए संस्करण में उपलब्ध नहीं है। आपको नाम, विधि, स्थिति, ... के कॉलम के साथ नीचे फलक में सूचीबद्ध Ajax पृष्ठ के पास पृष्ठ आइकन पर क्लिक करने की आवश्यकता है

फिर यह आपको अधिक पैनल दिखाएगा जहां आपको त्रुटि संदेश मिलेगा।


0

आप ब्राउज़र में केवल पृष्ठ पर राइट क्लिक कर सकते हैं और डेवलपर टूल को लाने के लिए "इंसिस्टेंट एलीमेंट" का चयन कर सकते हैं।

https://developer.chrome.com/devtools

हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.