Chrome DevTools का इस्तेमाल करके डीबग करना

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

DevTools के बारे में ज़्यादा जानने के लिए, Chrome DevTools की खास जानकारी देखें.

Chrome DevTools से कनेक्शन चालू करना

आपके ऐप्लिकेशन का WebView, Chrome DevTools से कनेक्शन डिफ़ॉल्ट रूप से चालू नहीं करेगा. आपको अपने ऐप्लिकेशन के कोड में वेबव्यू डीबग करने की सुविधा चालू करनी होगी.

  1. पक्का करें कि आपने हार्डवेयर पर अपना ऐप्लिकेशन चलाने या वर्चुअल डिवाइस पर ऐप्लिकेशन चलाने के लिए, सेटअप किया हो.
  2. setWebContentsDebuggingEnabled को कॉल करके, अपने ऐप्लिकेशन कोड में WebView डीबगिंग चालू करें. आम तौर पर, यह काम Activity या Application क्लास में किया जाता है. इस क्लास में WebView को शुरू किया जाता है.

हमारा सुझाव है कि setWebContentsDebuggingEnabled को किसी शर्त के साथ रैप करें, ताकि डीबग करने की सुविधा सिर्फ़ डेवलपमेंट बिल्ड में चालू हो, न कि प्रोडक्शन में. यह सेटिंग, आपके ऐप्लिकेशन में मौजूद सभी वेबव्यू पर लागू होती है.

वेबव्यू डीबग करने की सुविधा पर, ऐप्लिकेशन की मेनिफ़ेस्ट फ़ाइल में मौजूद debuggable फ़्लैग की स्थिति का कोई असर नहीं पड़ता. अगर आपको सिर्फ़ तब WebView डीबग करने की सुविधा चालू करनी है, जब debuggable फ़्लैग को true पर सेट किया गया हो, तो रनटाइम के दौरान इस फ़्लैग की जांच करें. इसके लिए, यहां दिया गया उदाहरण देखें:

Kotlin

if (applicationInfo.flags and ApplicationInfo.FLAG_DEBUGGABLE != 0) {
     WebView.setWebContentsDebuggingEnabled(true)
}

Java

if (0 != (getApplicationInfo().flags & ApplicationInfo.FLAG_DEBUGGABLE)) {
     WebView.setWebContentsDebuggingEnabled(true);
}

अपने वेबव्यू को डीबग करना

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

  1. अपने डेवलपमेंट मशीन पर Chrome खोलें.
  2. chrome://inspect पर जाएं
  3. chrome://inspect पेज पर, पक्का करें कि यूएसबी डिवाइसों का पता लगाएं विकल्प चुना गया हो. रिमोट टारगेट सेक्शन में जाकर, अपना डिवाइस ढूंढें.

    Chrome DevTools में, डीबग करने के लिए उपलब्ध रिमोट टारगेट दिखाने वाला पेज
    पहली इमेज. Chrome DevTools में, डीबग करने के लिए उपलब्ध रिमोट टारगेट दिखाने वाला पेज.
  4. आपके डिवाइस के नाम के नीचे, Chrome उस डिवाइस पर चल रहे सभी डीबग किए जा सकने वाले WebViews की सूची दिखाता है. आम तौर पर, इनकी पहचान WebView in के तौर पर की जाती है. इसके बाद, ऐप्लिकेशन के पैकेज का नाम होता है. उस WebView को ढूंढें जिसे डीबग करना है. इसके बाद, जांच करें लिंक पर क्लिक करें.

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

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