रिमोट डीबग Android डिवाइस

Kayce Basques

Sofia Emelianova

Windows, Mac या Linux कंप्यूटर से, Android डिवाइस पर लाइव कॉन्टेंट को रिमोट डीबग करना. इस ट्यूटोरियल में, आपको ये काम करने का तरीका बताया गया है:

• अपने Android डिवाइस को रिमोट डीबगिंग के लिए सेट अप करें और उसे अपने डेवलपमेंट मशीन से ढूंढें.
• अपने डेवलपमेंट मशीन से, अपने Android डिवाइस पर लाइव कॉन्टेंट की जांच करें और उसे डीबग करें.
• अपने Android डिवाइस से, डेवलपमेंट मशीन पर मौजूद DevTools इंस्टेंस पर कॉन्टेंट को स्क्रीनकास्ट करें.

पहला चरण: अपना Android डिवाइस ढूंढना

यहां दिया गया वर्कफ़्लो, ज़्यादातर उपयोगकर्ताओं के लिए काम करता है. ज़्यादा मदद पाने के लिए, समस्या हल करना: DevTools में Android डिवाइस का पता नहीं चल रहा है लेख पढ़ें.

1. अपने Android डिवाइस पर, डेवलपर के लिए सेटिंग और टूल स्क्रीन खोलें. डिवाइस पर 'डेवलपर के लिए सेटिंग और टूल' कॉन्फ़िगर करना लेख पढ़ें.
2. यूएसबी डीबग करने की सुविधा चालू करें को चुनें.
3. अपने डेवलपमेंट मशीन पर, Chrome खोलें.
4. chrome://inspect#devices पर जाएं.

5. पक्का करें कि यूएसबी डिवाइसों को ढूंढें सेटिंग चालू हो.

   

6. यूएसबी केबल का इस्तेमाल करके, अपने Android डिवाइस को सीधे डेवलपमेंट मशीन से कनेक्ट करें.

7. अगर आपने डिवाइस को पहली बार कनेक्ट किया है, तो वह "ऑफ़लाइन" के तौर पर दिखेगा. साथ ही, पुष्टि की प्रक्रिया जारी रहेगी.

   

   इस मामले में, अपने डिवाइस की स्क्रीन पर, डीबगिंग सेशन का अनुरोध स्वीकार करें.

8. अगर आपको अपने Android डिवाइस का मॉडल नाम दिखता है, तो इसका मतलब है कि DevTools आपके डिवाइस से कनेक्ट हो गया है.

   

9. दूसरे चरण पर जाएं.

समस्या हल करना: DevTools, Android डिवाइस का पता नहीं लगा पा रहा है

पक्का करें कि आपका हार्डवेयर सही तरीके से सेट अप किया गया हो:

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

पक्का करें कि आपका सॉफ़्टवेयर सही तरीके से सेट अप किया गया हो:

• अगर आपकी डेवलपमेंट मशीन पर Windows काम कर रहा है, तो अपने Android डिवाइस के लिए यूएसबी ड्राइवर मैन्युअल तरीके से इंस्टॉल करने की कोशिश करें. OEM यूएसबी ड्राइवर इंस्टॉल करना लेख पढ़ें.
• Windows और Android डिवाइसों के कुछ कॉम्बिनेशन (खास तौर पर Samsung) के लिए, अतिरिक्त सेट अप की ज़रूरत होती है. देखें कि Chrome DevTools में, प्लग इन किए जाने पर डिवाइस का पता नहीं चलता.

अगर आपको अपने Android डिवाइस पर यूएसबी डीबग करने की अनुमति दें प्रॉम्प्ट नहीं दिखता है, तो ये काम आज़माएं:

• जब आपकी डेवलपमेंट मशीन पर DevTools फ़ोकस में हो और Android की होम स्क्रीन दिख रही हो, तो यूएसबी केबल को डिसकनेक्ट करके फिर से कनेक्ट करें. दूसरे शब्दों में, कभी-कभी आपके Android या डेवलपमेंट मशीन की स्क्रीन लॉक होने पर, प्रॉम्प्ट नहीं दिखता.
• अपने Android डिवाइस और डेवलपमेंट मशीन की डिसप्ले सेटिंग अपडेट करना, ताकि वे कभी स्लीप मोड (कम बैटरी मोड) में न जाएं.
• Android के यूएसबी मोड को PTP पर सेट करना. Galaxy S4 में, यूएसबी डीबग करने की अनुमति देने वाला डायलॉग बॉक्स नहीं दिखता लेख पढ़ें.
• अपने Android डिवाइस को फिर से सेट करने के लिए, डेवलपर के विकल्प स्क्रीन पर जाकर, यूएसबी डिबगिंग की अनुमतियां रद्द करें को चुनें.

अगर आपको कोई ऐसा समाधान मिलता है जिसके बारे में इस सेक्शन या Chrome DevTools डिवाइसों में प्लग इन करने पर, डिवाइस का पता नहीं चलता में नहीं बताया गया है, तो कृपया उस Stack Overflow सवाल का जवाब दें या developer.chrome.com रिपॉज़िटरी में कोई समस्या दर्ज करें!

दूसरा चरण: डेवलपमेंट मशीन से अपने Android डिवाइस पर कॉन्टेंट को डीबग करना

1. अपने Android डिवाइस पर Chrome खोलें.

2. डेवलपमेंट मशीन पर chrome://inspect/#devices में, आपको अपने Android डिवाइस के मॉडल का नाम दिखेगा. इसके बाद, उसका सीरियल नंबर दिखेगा. इसके नीचे, आपको डिवाइस पर चल रहे Chrome का वर्शन दिखेगा. साथ ही, ब्रैकेट में वर्शन नंबर भी दिखेगा.

   

3. यूआरएल के साथ टैब खोलें टेक्स्ट बॉक्स में, कोई यूआरएल डालें. इसके बाद, खोलें पर क्लिक करें. यह पेज, आपके Android डिवाइस पर नए टैब में खुलता है.

   

   chrome://inspect/#devices में, हर रिमोट Chrome टैब का अपना सेक्शन होता है. इस सेक्शन से, उस टैब से इंटरैक्ट किया जा सकता है. अगर कोई ऐप्लिकेशन WebView का इस्तेमाल कर रहा है, तो आपको उन सभी ऐप्लिकेशन के लिए एक सेक्शन भी दिखेगा. इस उदाहरण में, सिर्फ़ एक टैब खुला है.

4. आपने जो यूआरएल अभी-अभी खोला है उसके बगल में मौजूद, जांच करें पर क्लिक करें. एक नया DevTools इंस्टेंस खुलता है.

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

अन्य कार्रवाइयां: टैब को रोकना, फ़ोकस करना, रीलोड करना या बंद करना

यूआरएल के नीचे, आपको एक मेन्यू दिखेगा. इसकी मदद से, किसी टैब को रोका, फ़ोकस किया, रीलोड किया या बंद किया जा सकता है.

एलिमेंट की जांच करना

अपने DevTools इंस्टेंस के एलिमेंट पैनल पर जाएं और किसी एलिमेंट पर कर्सर घुमाएं, ताकि उसे अपने Android डिवाइस के व्यूपोर्ट में हाइलाइट किया जा सके.

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

अपनी Android स्क्रीन को डेवलपमेंट मशीन पर स्क्रीनकास्ट करना

अपने DevTools इंस्टेंस में Android डिवाइस का कॉन्टेंट देखने के लिए, स्क्रीनकास्ट टॉगल करें पर क्लिक करें.

स्क्रीनकास्ट के साथ कई तरीकों से इंटरैक्ट किया जा सकता है:

• क्लिक को टैप में बदल दिया जाता है, जिससे डिवाइस पर सही टच इवेंट ट्रिगर होते हैं.
• आपके कंप्यूटर पर कीस्ट्रोक, डिवाइस पर भेजे जाते हैं.
• पिंच जेस्चर का इस्तेमाल करने के लिए, खींचते समय Shift बटन को दबाकर रखें.
• स्क्रोल करने के लिए, अपने ट्रैकपैड या माउस व्हील का इस्तेमाल करें या अपने माउस पॉइंटर को फ़्लिंग करें.

स्क्रीनकास्ट के बारे में कुछ ज़रूरी बातें:

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

Android डीबग ब्रिज (adb) की मदद से, मैन्युअल तरीके से डीबग करना

कुछ मामलों में, रिमोट डीबगिंग का कोई दूसरा तरीका काम आ सकता है. उदाहरण के लिए, हो सकता है कि आप Android पर Chrome के Chrome DevTools प्रोटोकॉल (CDP) से सीधे कनेक्ट करना चाहें.

ऐसा करने के लिए, Android डीबग ब्रिज (adb) का इस्तेमाल किया जा सकता है:

1. अपने Android डिवाइस पर, डेवलपर के लिए सेटिंग और यूएसबी डीबग करने की सुविधा चालू करना न भूलें.
2. अपने Android डिवाइस पर Chrome खोलें.

3. Android डिवाइस को डेवलपमेंट मशीन से इनके ज़रिए कनेक्ट करें:

   • यूएसबी केबल (सीधी).
   • इसके अलावा, adb वाई-फ़ाई कनेक्शन भी इस्तेमाल किया जा सकता है.

4. डेवलपमेंट मशीन की कमांड लाइन में, adb devices -l चलाएं और देखें कि आपका डिवाइस सूची में मौजूद है या नहीं.

5. डिवाइस पर मौजूद सीडीपी सॉकेट को अपनी मशीन के लोकल पोर्ट पर फ़ॉरवर्ड करें. उदाहरण के लिए, 9222. ऐसा करने के लिए, यह चलाएं:

   adb forward tcp:9222 localabstract:chrome_devtools_remote
   

6. कनेक्ट होने के बाद, देखें कि:

   • http://localhost:9222/json आपके page टारगेट की सूची दिखाता है.
   • http://localhost:9222/json/version, browser टारगेट एंडपॉइंट को एक्सपोज़ करता है, जैसा कि सीडीपी दस्तावेज़ में बताया गया है.
   • यूएसबी डिवाइसों को ढूंढें सेटिंग के चुने हुए होने के बिना भी, chrome://inspect/#devices में जानकारी अपने-आप भर जाती है.

समस्या हल करने के लिए, यह लेख पढ़ें:

• adb दस्तावेज़

• इसके अलावा, पुरानी गाइड भी पढ़ी जा सकती हैं:

  • remote-debugging-legacy
  • रिमोट-डीबगिंग
  • girish.in/…how