JavaScript कंसोल लॉग का इस्तेमाल करके डीबग करना

इस दस्तावेज़ में, JavaScript कंसोल लॉग देखने के अलग-अलग तरीकों के बारे में बताया गया है. इससे WebView में कॉन्टेंट को डीबग किया जा सकता है.

JavaScript कंसोल को ऐक्सेस करके, JavaScript console.log() स्टेटमेंट से मिली गड़बड़ियां, चेतावनियां, और कस्टम मैसेज देखे जा सकते हैं. इससे यह पता लगाया जा सकता है कि WebView में क्या हो रहा है. आपके WebView से जनरेट किए गए JavaScript कंसोल मैसेज देखने के तीन अलग-अलग तरीके हैं:

• Chrome DevTools: अपने वेबव्यू को Chrome DevTools से कनेक्ट करें. WebView JavaScript कंसोल मैसेज देखने के लिए, Console टैब खोलें.

• WebView DevTools ऐप्लिकेशन: अपने डिवाइस पर webview-log-js-console-messages फ़्लैग चालू करने के लिए, WebView DevTools ऐप्लिकेशन का इस्तेमाल करें. इससे Logcat में कंसोल लॉग देखे जा सकते हैं.

• मैसेज इंटरसेप्शन: अपने WebChromeClient में onConsoleMessage() लागू करके, JavaScript कंसोल से मिले मैसेज को इंटरसेप्ट करें. इस तरीके के बारे में, यहां दिए गए सेक्शन में बताया गया है.

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

onConsoleMessage() के मैसेज इंटरसेप्ट करना

WebView को डीबग करते समय, कंसोल एपीआई का इस्तेमाल किया जा सकता है. आपको एक WebChromeClient देना होगा, जो Logcat में कंसोल मैसेज दिखाने के लिए onConsoleMessage() तरीके को लागू करता हो. इसके बाद, setWebChromeClient() की मदद से, WebChromeClient को अपने WebView पर लागू करें.

WebChromeClient, WebView के लिए हेल्पर क्लास है. यह यूज़र इंटरफ़ेस (यूआई) से जुड़े उन इवेंट को मैनेज करता है जो वेब कॉन्टेंट में होते हैं. जैसे, JavaScript से जुड़ी सूचनाएं दिखाना, वेब पेज का टाइटल बदलना, और ब्राउज़र के कंसोल को भेजे गए मैसेज मैनेज करना.

नीचे दिए गए कोड में, WebChromeClient को कॉन्फ़िगर किया गया है. इससे JavaScript कंसोल के आउटपुट को इंटरसेप्ट किया जा सकता है और उन्हें Logcat पर रीडायरेक्ट किया जा सकता है, ताकि डीबग करना आसान हो.

val myWebView: WebView = findViewById(R.id.my_webview)
myWebView.webChromeClient = object : WebChromeClient() {
    // Override onConsoleMessage to intercept JavaScript console messages
    override fun onConsoleMessage(message: ConsoleMessage): Boolean {
        // Log JavaScript console messages to Logcat
        Log.d("WebViewConsole", "${message.message()} -- From line ${message.lineNumber()} of ${message.sourceId()}")
        // Return true to indicate that the message has been handled
        return true
    }
}

WebView myWebView = findViewById(R.id.webview);
myWebView.setWebChromeClient(new WebChromeClient() {
    // Override onConsoleMessage to intercept JavaScript console messages
    @Override
    public boolean onConsoleMessage(ConsoleMessage consoleMessage) {
        // Log JavaScript console messages to Logcat
        Log.d("MyApplication", consoleMessage.message() + " -- From line " +
        consoleMessage.lineNumber() + " of " + consoleMessage.sourceId());
        // Return true to indicate that the message has been handled
        return true;
    }
});

onConsoleMessage() का इस्तेमाल करने पर, आपकी कस्टम लॉगिंग लॉजिक, JavaScript की गड़बड़ियों के लिए प्राइमरी हैंडलर बन जाता है. यह webview-log-js-console-messages फ़्लैग के डिफ़ॉल्ट व्यवहार को बदल देता है. साथ ही, आपको अपनी पसंद के मुताबिक लॉग फ़ॉर्मैट करने की सुविधा देता है.

ConsoleMessage में एक MessageLevel ऑब्जेक्ट भी शामिल होता है. इससे यह पता चलता है कि किस तरह का कंसोल मैसेज डिलीवर किया जा रहा है. मैसेज की गंभीरता का पता लगाने के लिए, messageLevel() का इस्तेमाल करके मैसेज लेवल पर क्वेरी की जा सकती है. इसके बाद, Log के सही तरीके का इस्तेमाल किया जा सकता है या अन्य ज़रूरी कार्रवाइयां की जा सकती हैं.

जब अपने वेब पेज में कोई कंसोल मेथड लागू की जाती है, तब Android, onConsoleMessage(ConsoleMessage) मेथड को कॉल करता है, ताकि गड़बड़ी की जानकारी दी जा सके. उदाहरण के लिए, उदाहरण कोड के साथ, Logcat मैसेज प्रिंट किया जाता है. यह मैसेज कुछ ऐसा दिखता है:

Hello World -- From line 82 of http://www.example.com/hello.html