सवाल यह पता लगाने के लिए कि कौन सा जावास्क्रिप्ट एक jQuery अजाक्स अनुरोध का कारण बनता है?


जावास्क्रिप्ट कोड कैसे प्राप्त करें जहां से अजाक्स अनुरोध ट्रिगर हुआ? फायरबग के कंसोल में हम फ़ाइल और लाइन नंबर की पहचान करने में सक्षम हैं, लेकिन अगर हम इसका उपयोग कर रहे हैं $.ajax या $.post या jQuery के कुछ समान कार्य, यह केवल फ़ायरबग के कंसोल में jQuery लाइब्रेरी फ़ाइल लॉग करेगा। क्या jQuery फ़ंक्शन का वास्तविक ट्रिगर बिंदु प्राप्त करने का कोई तरीका है?


44
2018-06-20 07:59


मूल


अपने सभी AJAX कॉल में console.log (अद्वितीय नाम) का उपयोग करें और इसे चलाएं। निष्पादन के दौरान आप कंसोल देख सकते हैं - Nirus
यदि आप क्रोम का उपयोग करते हैं तो बस कंसोल में लॉग XMLHttpRequests चालू करें - ryanc1256
निर्भर करता है कि आप वास्तव में क्या करना चाहते हैं। या तो निरुस ने कहा या आप हमेशा jQuery के न्यूनतम संस्करण का उपयोग नहीं कर सकते हैं और एक ब्रेकपॉइंट सेट कर सकते हैं जहां अनुरोध होता है या क्रोम एक्सएचआर ब्रेकपॉइंट्स का उपयोग करता है, तो आप आपको पूरे कॉलिंग स्टैक देख सकते हैं। - t.niese
मुझे आशा है कि, हम जावास्क्रिप्ट का उपयोग कर jquery API कार्यान्वयन को डीबग करने में सक्षम नहीं हो सकते हैं - Hariharan
@Udhay आपके पास देव उपकरण में क्रोम का उपयोग करें Sources दाईं तरफ आप देखते हैं XHR Breakpoints अगर आप जांचते हैं Any XHR आप स्क्रिप्ट का उपयोग प्रत्येक अनुरोध पर रोक देंगे XMLHttpRequest (इसलिए कभी भी अनुरोध जो उपयोग नहीं करता है jsonp अनुरोध के लिए)। उसके साथ Call Stack(दाएं तरफ भी) आप देखेंगे कि अनुरोध की उत्पत्ति क्या थी। - t.niese


जवाब:


उपयोग Chrome में devtool आपके पास Sources

यदि आप इसे खोलते हैं तो आप दाईं ओर देखेंगे XHR/fetch Breakpoints, यदि आप जांचते हैं Any XHR आपकी स्क्रिप्ट का उपयोग करने वाले प्रत्येक अनुरोध पर रोक देगा XMLHttpRequest (इसलिए कभी भी अनुरोध जो उपयोग नहीं करता है jsonp अनुरोध के लिए)।

अगर Any XHR विकल्प उपलब्ध नहीं हैं (केवल No Breakpoints सूचीबद्ध है) तो आपको उस पर क्लिक करना होगा + छुट्टी Break when URL contains: क्षेत्र खाली और हिट दर्ज करें। यह बना देगा Any XHR विकल्प। (करने के लिए धन्यवाद यास्मीन फ्रांसीसी इस जानकारी के लिए)

उसके साथ Call Stack (दाएं तरफ भी) आप देखेंगे कि अनुरोध की उत्पत्ति क्या थी।

लेकिन जैसा कि मैंने उल्लेख किया है कि यह टूट नहीं जाता है jsonp अनुरोध यदि आप इन्हें ढूंढना चाहते हैं तो आपको न्यूनतम संस्करण का उपयोग करने की आवश्यकता नहीं है jQuery (या minified संस्करण के स्रोतमैप शामिल) और सही स्रोत पर अपने स्रोत में एक ब्रेकपॉइंट सेट करें। इस भाग को खोजने के लिए आप निम्न चरणों का उपयोग कर सकते हैं:

  1. बनाओ jsonp अपने कोड में अनुरोध करें और इस जगह पर ब्रेकपॉइंट सेट करें।
  2. अपने कोड के इस भाग को कॉल करें ताकि आप डीबगर पर स्विच कर सकें।
  3. उपयोग Step into, अब आप jQuery कोड में होना चाहिए। यदि अब आप वहां ब्रेकपॉइंट डालते हैं, तो क्रोम हर किसी के लिए रुक जाएगा jsonp निवेदन।

एक नोट: कभी-कभी क्रोम (शायद केवल में बीटा या देव संस्करण) पुनः लोड करने पर ब्रेकपॉइंट्स को खो देता है, इसलिए आपको यह जांचना होगा कि वे अभी भी पुनः लोड पर मौजूद हैं या नहीं।


102
2018-06-20 09:33



मुझे कोई एक्सएचआर चेकबॉक्स नहीं दिख रहा है। क्या इसे बाद के क्रोम संस्करणों में हटा दिया गया है? - Tony_Henrich
@ टोनी_हेनरिक यह अभी भी नवीनतम क्रोम संस्करण (55.0.2883.9 5) में है। - t.niese
@ टोनी_हेनरिक यदि आप इसे पहले से ही समझ चुके हैं तो यह टिप्पणी भविष्य के लोगों के लिए है जो पता लगाने की कोशिश कर रहे हैं, + बटन पर क्लिक करें या राइट क्लिक करें और क्लिक करें add breakpoint फिर फ़ील्ड खाली होने पर एंटर दबाएं और यह ऑटोफिल होगा any xhr चेकबॉक्स - Yasmin French
@YasminFrench उस जानकारी के लिए धन्यवाद, मैंने अपना जवाब अपडेट कर दिया है। मुझे यह पुरस्कार नहीं मिला कि मुझे कभी ऐसा करना पड़ा, शायद यह क्रोम के एक निश्चित संस्करणों के बाद आवश्यक है और मेरे सेटअप में बने रहे क्योंकि यह पहले से ही अस्तित्व में था। - t.niese


यह पहले क्रोम संस्करणों में मौजूद नहीं हो सकता है, लेकिन संस्करण 56.0.2924.87 में एक 'प्रारंभकर्ता' कॉलम है जो HTML / जेएस फ़ाइल और उस फ़ाइल के भीतर सटीक रेखा को बताता है जिसने अनुरोध शुरू किया था।

यह अनुरोध एक्सएचआर, जेपीजी, सीएसएस या किसी अन्य चीज़ के लिए http अनुरोध हो सकता है।

वापस अनुरोधों का पता लगाने में बहुत चिकना और सहायक।

इसका उपयोग कैसे करें?

  1. डेवलपर कंसोल खोलने के लिए "एफ 12" दबाएं।
  2. प्रत्येक अनुरोध में "आरंभकर्ता" कॉलम की तलाश करें, आप "jquery.min.js: 4" देख सकते हैं, जिसका अर्थ है कि अनुरोध "jquery.min.js" फ़ाइल की चौथी पंक्ति से शुरू किया गया था।

enter image description here


9
2018-03-03 09:13



सरल जवाब, धन्यवाद! - NPC
यह हमेशा काम नहीं करता है क्योंकि कभी-कभी क्रोम रिपोर्ट करता है Other। - cjbarth


क्रोम और फ़ायरफ़ॉक्स / फ़ायरबग में आप console.trace () का उपयोग कर सकते हैं ।हमेशा() या शायद आपके AJAX कॉल के पहले हैंडलर पर यह देखने के लिए कि इसे किसने बुलाया।


1
2018-06-20 08:03



यह ट्रिगर बिंदु का पता लगाने में मेरी मदद कैसे करेगा? - Stranger
जैसा कि मैं समझता हूं कि आप यह जानना चाहते हैं कि आपकी कौन सी घटनाओं ने AJAX अनुरोध को निकाल दिया है। इस तरह आपको वह फ़ंक्शन मिलेगा जिसे इसे कहा जाता है। या क्या मैं गलत समझ गया? - sivann