Khắc phục sự cố và ghi nhật ký

Việc gỡ lỗi trình chạy dịch vụ rất khó khăn. Bạn đang xử lý vòng đời, nội dung cập nhật, bộ nhớ đệm và sự tương tác giữa tất cả những thứ này. May mắn là Workbox giúp việc phát triển trình chạy dịch vụ trở nên dễ dàng hơn, đồng thời cũng giúp gỡ lỗi dễ dàng hơn thông qua tính năng ghi nhật ký thông tin. Trang này sẽ đề cập đến một số công cụ gỡ lỗi có sẵn, cách hoạt động của tính năng ghi nhật ký trong Workbox và cách định cấu hình tính năng này.

Các công cụ khắc phục sự cố hiện có

Có rất nhiều công cụ trên trình duyệt để gỡ lỗi và khắc phục sự cố trong quá trình phát triển trình chạy dịch vụ. Sau đây là một số tài nguyên giúp bạn bắt đầu sử dụng trình duyệt mà bạn chọn.

Chrome và Edge

Chrome (và các phiên bản Edge gần đây dựa trên công cụ Blink) có một bộ công cụ mạnh mẽ cho nhà phát triển. Một số công cụ trong số đó (cụ thể là trong Công cụ cho nhà phát triển của Chrome) đã được đề cập ở phần trước trong tài liệu này, nhưng vẫn còn nhiều điều khác cần tìm hiểu:

Firefox

Người dùng Firefox có thể tham khảo các tài nguyên sau:

Safari

Safari hiện có một bộ công cụ hạn chế hơn dành cho nhà phát triển dành cho trình chạy dịch vụ gỡ lỗi. Bạn có thể tìm hiểu thêm về các dịch vụ này qua những tài nguyên sau:

Ghi nhật ký hộp làm việc

Tính năng ghi nhật ký chứa thông tin là một điểm cải tiến quan trọng về trải nghiệm của nhà phát triển mà Workbox mang lại. Khi bật tính năng ghi nhật ký, Workbox sẽ ghi lại gần như toàn bộ hoạt động của mình theo cách đặc biệt và chức năng.

Ảnh chụp màn hình thông báo ghi nhật ký Workbox trong bảng điều khiển của Công cụ cho nhà phát triển của Chrome. Thông báo ghi nhật ký được phân biệt với nhật ký thông thường của bảng điều khiển bằng huy hiệu Hộp công việc. Bạn có thể mở rộng từng thông báo để biết thêm thông tin gỡ lỗi.

Các bản dựng phát triển của Workbox sẽ bật tính năng ghi nhật ký theo mặc định, trong khi các bản dựng chính thức sẽ tắt tính năng này. Có nhiều bước để chuyển đổi giữa bản dựng phát triển và bản dựng chính thức, tuỳ thuộc vào việc bạn đang tạo gói Workbox tuỳ chỉnh hay sử dụng bản sao được gói trước qua workbox-sw.

Có hoặc không có bộ kèm theo

Trình gói ( Bundler) là công cụ lấy mã từ các mô-đun riêng lẻ và tạo đầu ra JavaScript sẵn sàng chạy trên trình duyệt. Khi sử dụng trình gói, bạn cũng có thể sử dụng một trình bổ trợ Hộp công việc dành riêng cho gói để hỗ trợ việc lưu trước vào bộ nhớ đệm, chẳng hạn như workbox-webpack-plugin, hoặc bạn có thể chỉ cần gói logic lưu vào bộ nhớ đệm trong thời gian chạy của Hộp công việc. Dù bằng cách nào, tính năng ghi nhật ký của Workbox cũng chịu ảnh hưởng từ việc đặt chế độ sản xuất trong cấu hình của bộ gói:

  • Trong gói web, bạn có thể đặt tuỳ chọn cấu hình mode thành 'production' hoặc 'development'. workbox-webpack-plugin sẽ sử dụng tính năng ghi nhật ký cho quá trình sản xuất hoặc phát triển trong Workbox dựa trên giá trị này.
  • Đối với công cụ hợp nhất, rollup-plugin-workbox chấp nhận tuỳ chọn cấu hình mode. Tuỳ chọn này cũng ảnh hưởng đến việc Workbox ghi lại nội dung bất kỳ vào bảng điều khiển. Nếu đang dùng công cụ hợp nhất mà không có trình bổ trợ dành riêng cho Workbox, bạn cần phải định cấu hình @rollup/plugin-replace để thay thế process.env.NODE_ENV bằng 'development' hoặc 'production'.

Giả sử hành vi ghi nhật ký mặc định phải được ghi đè trong quá trình phát triển. Trong trường hợp đó, trình bổ trợ Workbox thích hợp cho trình gói của bạn phải cho phép bạn mã hoá cứng một lựa chọn ưu tiên để gỡ lỗi nhật ký trong cấu hình của nó. Ví dụ: bạn có thể tắt tính năng đăng nhập trong Workbox thông qua tuỳ chọn mode của workbox-webpack-plugin cho phương thức GenerateSW.

Không có trình gói

Mặc dù bộ gói rất hữu ích, nhưng không phải dự án nào cũng cần đến. Nếu bạn gặp phải trường hợp muốn thêm Workbox vào một dự án không sử dụng trình gói, thì workbox-sw là cách phù hợp.

Mô-đun workbox-sw đơn giản hoá việc tải các mô-đun Hộp công việc khác (ví dụ: workbox-routing, workbox-precaching, v.v.) từ CDN. Việc tải gói phát triển hoặc sản xuất phụ thuộc vào URL dùng để truy cập vào ứng dụng web của bạn. Theo mặc định, workbox-sw sẽ tải phiên bản phát triển của Workbox nếu ứng dụng web của bạn đang chạy trên http://localhost, và luôn tải phiên bản phát hành chính thức.

Bạn có thể ghi đè hành vi mặc định bằng cách gọi phương thức setConfig của Workbox để đặt tuỳ chọn debug thành true:

// Load workbox-sw from a CDN
importScripts('https://storage.googleapis.com/workbox-cdn/releases/6.2.0/workbox-sw.js');

// This must come before any other workbox.* methods.
workbox.setConfig({
  debug: true
});

// Now use workbox.routing.*, workbox.precaching.*, etc.

Tắt tính năng ghi nhật ký vào các bản dựng phát triển trong mọi quy trình công việc

Cho dù có sử dụng trình gói hay không, bạn vẫn có thể tắt tất cả tính năng ghi nhật ký trong bản dựng phát triển bằng cách chỉ định true cho một biến self.__WB_DISABLE_DEV_LOGS đặc biệt vào trình chạy dịch vụ:

//
self.__WB_DISABLE_DEV_LOGS = true;

// The rest of your Workbox service worker code goes here

Một ưu điểm của phương pháp này là hoàn toàn độc lập với cấu hình gói của bạn, đồng thời sẽ hoạt động cho dù bạn sử dụng trực tiếp workbox-sw hay phụ thuộc vào một gói để đóng gói trình chạy dịch vụ dựa trên Workbox cho bạn.

Thông tin khác

Nếu bạn vẫn gặp khó khăn trong việc tìm hiểu điều gì đang xảy ra trong một trình chạy dịch vụ bị lỗi và việc ghi nhật ký vẫn chưa đủ, hãy thử đăng câu hỏi lên Stack Overflow bằng thẻ workbox. Nếu bạn không tìm thấy câu trả lời ở đó, hãy gửi vấn đề trên GitHub (sau khi đọc hướng dẫn đóng góp). Việc này không chỉ cho phép một lượng lớn nhà phát triển đọc và trả lời câu hỏi của bạn, mà còn giúp ích cho những người trong tình huống tương tự sau này.