Android: Gỡ lỗi ứng dụng web

Các khóa học qua video:
Python SQL Server PHP C# Lập trình C Java HTML5-CSS3-JavaScript
Học trên YouTube <76K/tháng. Đăng ký Hội viên
Viết nhanh hơn - Học tốt hơn
Giải phóng thời gian, khai phóng năng lực

Nếu ta đang kiểm tra ứng dụng web với một thiết bị chạy Android 4.4 trở lên, ta có thể gỡ lỗi từ xa các trang web bằng WebView với Chrome Developer Tools.

Nếu ta không có thiết bị chạy Android 4.4 trở lên, ta có thể gỡ lỗi JavaScript bằng API JavaScript console và xem các thông báo đầu ra để logcat. Nếu ta đã quen với việc gỡ lỗi các trang web với Fireorms hoặc Web Inspector, thì có thể ta cũng quen với việc sử dụng console (chẳng hạn như console.log()). Framework WebKit của Android hỗ trợ hầu hết các API giống nhau, do đó ta có thể nhận nhật ký từ trang web của mình khi gỡ lỗi trong Trình duyệt của Android hoặc của WebView. Bài viết này mô tả cách sử dụng API console để gỡ lỗi.

Tham khảo các tài nguyên liên quan sau đây:

  • Gỡ lỗi từ xa trên Android
  • Gỡ lỗi ứng dụng của bạn

Sử dụng API console trong Trình duyệt Android

Khi ta gọi một hàm console (trong đối tượng window.console của DOM), đầu ra xuất hiện trong logcat. Ví dụ: nếu trang web của ta thực thi đoạn JavaScript sau:

console.log("Hello World");

Thì thông điệp logcat trông giống như thế này:

Console: Hello World http://www.example.com/hello.html :123

Định dạng của thông báo có thể xuất hiện khác nhau tùy thuộc vào phiên bản Android ta đang sử dụng. Từ Android 2.1 trở lên, các thông báo console từ Trình duyệt Android được gắn thẻ với tên "trình duyệt". Từ Android 1.6 trở xuống, các thông báo Trình duyệt Android được gắn thẻ với tên "WebCore".

WebKit của Android không triển khai tất cả các API console có sẵn trong các trình duyệt máy tính để bàn khác. Tuy nhiên, ta có thể sử dụng các chức năng ghi nhật ký văn bản cơ bản:

  • console.log(String)
  • console.info(String)
  • console.warn(String)
  • console.error(String)

Các hàm console khác không gây ra lỗi, nhưng có thể không hoạt động giống như những gì ta mong đợi từ các trình duyệt web khác.

Sử dụng API console trong WebView

Tất cả các API console hiển thị ở trên cũng được hỗ trợ khi gỡ lỗi trong WebView. Nếu ta đang nhắm mục tiêu Android 2.1 (API level 7) trở lên, ta phải cung cấp một WebChromeClient để thực hiện phương thức onConsoleMessage() để thông báo console xuất hiện trong logcat. Sau đó, áp dụng WebChromeClient cho WebView với setWebChromeClient().

Ví dụ: để hỗ trợ API cấp 7, thì ta có thể sử dụng onConsoleMessage(String, int, String) theo cách sau:

WebView myWebView = (WebView) findViewById(R.id.webview);
myWebView.setWebChromeClient(new WebChromeClient() {
  public void onConsoleMessage(String message, int lineNumber, String sourceID) {
    Log.d("MyApplication", message + " -- From line "
                         + lineNumber + " of "
                         + sourceID);
  }
});

Tuy nhiên, nếu phiên bản được hỗ trợ thấp nhất là API level 8 trở lên, thì ta nên thực hiện onConsoleMessage(ConsoleMessage). Ví dụ:

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

ConsoleMessage cũng bao gồm một đối tượng MessageLevel để chỉ ra loại thông báo console được gửi. Ta có thể dùng messageLevel() để xác định mức độ nghiêm trọng của thông báo, sau đó sử dụng phương thức Log thích hợp hoặc thực hiện các hành động thích hợp khác.

Cho dù ta sử dụng onConsoleMessage(String, int, String) hay onConsoleMessage(ConsoleMessage), thì khi ta thực hiện một phương thức console trong trang web của mình, Android sẽ gọi phương thức onConsoleMessage() thích hợp để ta có thể báo cáo lỗi. Ví dụ, với mã ví dụ ở trên, một thông điệp logcat được in trông như thế này:

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

Logcat

Logcat là một công cụ kết xuất một bản ghi các thông báo hệ thống. Các thông báo bao gồm theo dõi ngăn xếp khi thiết bị gặp lỗi, cũng như các thông báo nhật ký được viết từ ứng dụng của ta và các thông báo được viết bằng API JavaScript console.

Để chạy logcat và xem tin nhắn từ Android Studio, ta chọn View > Tool Windows > Logcat.

Để biết thêm thông tin, hãy xem bài viết Viết và Xem Nhật ký bằng Logcat.

Nguồn: https://developer.android.com/guide/webapps/debugging

» Tiếp: Thực tiễn tốt nhất cho các ứng dụng web
« Trước: Hỗ trợ các màn hình khác nhau trong các ứng dụng web
Các khóa học qua video:
Python SQL Server PHP C# Lập trình C Java HTML5-CSS3-JavaScript
Học trên YouTube <76K/tháng. Đăng ký Hội viên
Viết nhanh hơn - Học tốt hơn
Giải phóng thời gian, khai phóng năng lực
Copied !!!