แก้ไขข้อบกพร่องของเว็บแอป

คุณสามารถแก้ไขข้อบกพร่องของ JavaScript ได้โดยใช้ console JavaScript API และดูข้อความเอาต์พุตใน Logcat หากคุณคุ้นเคยกับการแก้ไขข้อบกพร่องของหน้าเว็บด้วย Firebug หรือ Web Inspector ก็น่าจะคุ้นเคยกับการใช้ console (เช่น console.log()) เฟรมเวิร์ก WebKit ของ Android รองรับ API ส่วนใหญ่เดียวกัน คุณจึงรับบันทึกจากหน้าเว็บได้เมื่อแก้ไขข้อบกพร่องใน WebView ส่วนนี้จะอธิบายวิธีใช้ API ของคอนโซลเพื่อแก้ไขข้อบกพร่อง

ใช้ Console API ใน WebView

นอกจากนี้ ระบบยังรองรับ Console API เมื่อแก้ไขข้อบกพร่องใน WebView ด้วย คุณต้องระบุ WebChromeClient ที่ใช้เมธอด onConsoleMessage() เพื่อให้ข้อความคอนโซลปรากฏใน Logcat จากนั้นใช้ WebChromeClient กับ WebView ด้วย setWebChromeClient() ดูข้อมูลเพิ่มเติมได้ที่เอกสารประกอบของ Webview

ตัวอย่างต่อไปนี้แสดงวิธีใช้ API ของคอนโซลใน WebView

Kotlin

val myWebView: WebView = findViewById(R.id.webview)
myWebView.webChromeClient = object : WebChromeClient() {

    override fun onConsoleMessage(message: ConsoleMessage): Boolean {
        Log.d("MyApplication", "${message.message()} -- From line " +
              "${message.lineNumber()} of ${message.sourceId()}")
        return true
    }
}

Java

WebView myWebView = findViewById(R.id.webview);
myWebView.setWebChromeClient(new WebChromeClient() {
    @Override
    public boolean onConsoleMessage(ConsoleMessage consoleMessage) {
        Log.d("MyApplication", consoleMessage.message() + " -- From line " +
        consoleMessage.lineNumber() + " of " + consoleMessage.sourceId());
        return true;
    }
});

ConsoleMessage ยังมีออบเจ็กต์ MessageLevel อยู่ด้วยเพื่อระบุประเภทข้อความคอนโซลที่ส่ง คุณสามารถค้นหาระดับข้อความด้วย messageLevel() เพื่อพิจารณาความรุนแรงของข้อความ จากนั้นใช้วิธีการที่เหมาะสม Log หรือดําเนินการอื่นๆ ที่เหมาะสม

ไม่ว่าคุณจะใช้ onConsoleMessage(String, int, String) หรือ onConsoleMessage(ConsoleMessage) เมื่อเรียกใช้เมธอดคอนโซลในหน้าเว็บ Android จะเรียกใช้เมธอด onConsoleMessage() ที่เหมาะสมเพื่อให้คุณรายงานข้อผิดพลาดได้ ตัวอย่างเช่น เมื่อใช้โค้ดตัวอย่างด้านบน ระบบจะพิมพ์ข้อความ Logcat ดังต่อไปนี้

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

แหล่งข้อมูลเพิ่มเติมเกี่ยวกับการแก้ไขข้อบกพร่องมีดังนี้

ทดสอบฟีเจอร์ทดลองในเว็บ

คุณสามารถทดสอบฟีเจอร์เว็บเวอร์ชันทดลองใน WebView ได้ด้วย ซึ่งคล้ายกับหน้า chrome://flags ของ Google Chrome

โดยทำตามขั้นตอนต่อไปนี้

  1. ติดตั้งWebViewแชแนลรุ่นก่อนเปิดตัว (เบต้า เวอร์ชันที่กำลังพัฒนา หรือเวอร์ชัน Canary){: .external}

  2. เปลี่ยนWebView แชแนลในอุปกรณ์ทดสอบเป็นแชแนลรุ่นทดลองที่ติดตั้งไว้

  3. คลิกตัวเปิดเครื่องมือสำหรับนักพัฒนาเว็บ WebView


    รูปที่ 1 ไอคอนเครื่องมือสำหรับนักพัฒนาซอฟต์แวร์ WebView สําหรับแอปที่ติดตั้งในอุปกรณ์

  4. จากเครื่องมือสำหรับนักพัฒนาเว็บ ให้คลิกการแจ้ง แล้วค้นหาฟีเจอร์ทดลองที่ต้องการเปิดหรือปิดใช้ การเปลี่ยนแปลงจะมีผลกับอินสแตนซ์ WebView ทั้งหมดในอุปกรณ์

  5. หยุดแอปแล้วรีสตาร์ทเพื่อเริ่มทดสอบด้วยฟีเจอร์ใหม่

ดูข้อมูลเพิ่มเติมเกี่ยวกับการเปิด/ปิดการตั้งค่าได้ที่WebView เอกสารประกอบของ DevTools