Xuất bản: Ngày 19 tháng 8 năm 2025
Quản lý hoạt động điều hướng bao gồm các phương thức kiểm soát cách một Ứng dụng web tiến bộ (PWA) xử lý hoạt động điều hướng của người dùng. Một thành phần quan trọng của việc này là chụp thông tin điều hướng, quy trình trình duyệt xác định xem việc nhấp vào một đường liên kết có nên khởi chạy PWA đã cài đặt hay mở một thẻ trình duyệt mới.
Hướng dẫn này trình bày về phiên bản mới của tính năng ghi lại thao tác điều hướng, có trong Chrome 139. Mặc dù hành vi mặc định của trình duyệt phù hợp với hầu hết các trường hợp, nhưng bạn cần hiểu rõ hơn về những kỹ thuật quản lý này và các API liên quan nếu muốn mang đến trải nghiệm mượt mà nhất cho người dùng.
Phần Các chế độ kiểm soát dành cho nhà phát triển chia sẻ cách tuỳ chỉnh chế độ điều hướng để mang lại trải nghiệm khởi chạy tốt nhất có thể cho PWA của bạn.
Hành vi mặc định mới
Để phù hợp với lựa chọn ưu tiên của người dùng và giảm bớt phiền toái, Chrome đang chuẩn hoá cách xử lý các đường liên kết. Trước đây, hành vi này không nhất quán trên các nền tảng. Các thiết bị di động thường ưu tiên việc chạy các ứng dụng đã cài đặt, trong khi các trình duyệt trên máy tính sẽ mở một đường liên kết trong thẻ trước khi báo hiệu rằng một ứng dụng có thể xử lý đường liên kết đó.
Phương pháp mới, hợp nhất để ghi lại hoạt động điều hướng, tự động mở các đường liên kết trong PWA đã cài đặt tương ứng. Các đường liên kết sẽ chỉ chuyển về thẻ trình duyệt nếu PWA chưa được cài đặt hoặc nếu người dùng đã chọn không sử dụng. Hành vi mới này có trong Chrome 139 cho Windows, Mac và Linux, đồng thời sẽ có trong ChromeOS ở một bản phát hành trong tương lai.
Quy trình quản lý điều hướng
Việc ghi lại hoạt động điều hướng là một phần của quy trình quản lý hoạt động điều hướng. Quy trình này bao gồm toàn bộ luồng, từ hành động ban đầu của người dùng đến các quyết định của trình duyệt và các hành vi kết quả do nhà phát triển định cấu hình:
- Hành động của người dùng: Bao gồm các lượt tương tác như nhấp hoặc nhấn vào đường liên kết.
- Quyết định của trình duyệt: bao gồm các tác vụ và quyết định do trình duyệt quản lý, chẳng hạn như các hành vi mặc định, chẳng hạn như hoạt động ghi lại thao tác điều hướng.
- Chế độ kiểm soát dành cho nhà phát triển: Bao gồm các API web cho phép nhà phát triển hướng dẫn trình duyệt cách xử lý các tác vụ cụ thể.
Sự tương tác của các phần tử này sẽ xác định xem PWA có mở trong một cửa sổ độc lập hay một thẻ trình duyệt.
Một trường hợp sử dụng cơ bản của việc quản lý hoạt động điều hướng là khi người dùng nhấp hoặc nhấn vào một đường liên kết đến PWA đã cài đặt từ một trang khác trong trình duyệt. Ví dụ sau đây minh hoạ trường hợp một người dùng đã cài đặt PWA Google Chat và nhấp vào đường liên kết đến PWA đó trong lời mời trên Lịch Google.
calendar.google.com.Hành động của người dùng:
Mỗi hành động của người dùng bao gồm 3 thành phần chính: sự kiện (chẳng hạn như lượt nhấp hoặc lượt nhấn), nền tảng nơi sự kiện diễn ra (chẳng hạn như trang web hoặc lối tắt trên máy tính) và loại đường liên kết được kích hoạt (chẳng hạn như URL HTTPS). Ví dụ: hành động của người dùng có thể là nhấp vào một đường liên kết đến https://chat.google.com/meeting_room_id trong phạm vi PWA Google Chat từ một trang trên calendar.google.com.
Quyết định của trình duyệt
Khi người dùng thực hiện một hành động, chẳng hạn như nhấp vào bước trước đó, trình duyệt sẽ chạy quy trình ghi lại thao tác điều hướng để quyết định xem các đường liên kết sẽ được mở trong một thẻ trình duyệt hay trong một PWA đã cài đặt. Quy trình này bao gồm các bước sau:
- Xác định xem thao tác điều hướng có thể ghi lại hay không: Nhìn chung, một thao tác điều hướng được coi là có thể ghi lại nếu thao tác đó tạo một khung mới và không mở trong một bối cảnh duyệt web phụ.
- Xác định một PWA kiểm soát: Nếu có thể ghi lại thao tác điều hướng, trình duyệt sẽ cố gắng tìm một PWA "kiểm soát" URL (nằm trong phạm vi được xác định trong Tệp kê khai ứng dụng web).
- Xác minh lựa chọn ưu tiên của người dùng: Nếu tìm thấy một PWA kiểm soát, trình duyệt sẽ kiểm tra lựa chọn ưu tiên của người dùng. Nếu người dùng chưa chọn không nhận trong phần cài đặt ứng dụng, thì PWA sẽ khởi chạy; nếu không, đường liên kết sẽ mở trong một thẻ trình duyệt mới.
- Chạy PWA: Trình duyệt chạy PWA bằng Thuật toán xử lý lượt chạy. Bạn có thể tác động đến điều này bằng cách sử dụng Launch Handler API (API Trình xử lý lượt khởi chạy), sẽ được đề cập ở phần tiếp theo.
Sơ đồ sau đây tóm tắt quy trình này:
Các quyền kiểm soát dành cho nhà phát triển
Mặc dù quy trình điều hướng chủ yếu dựa vào chế độ cài đặt mặc định của trình duyệt và chế độ cài đặt của người dùng, nhưng bạn có thể sử dụng nhiều API để quản lý các khía cạnh cụ thể của quy trình này. Sau bản cập nhật gần đây về tính năng ghi lại thao tác điều hướng, một số API web lâu đời đã trở nên phù hợp hơn.
Launch Handler API
API này sẽ hoạt động khi trình duyệt quyết định chạy PWA, cho phép bạn kiểm soát cách chạy PWA (ví dụ: trong một cửa sổ mới hoặc cửa sổ hiện có).
Xác định cách PWA khởi chạy thông qua thành phần launch_handler trong Tệp kê khai ứng dụng web, bao gồm một trường con có tên là client_mode. Trường phụ này xác định xem có nên sử dụng cửa sổ mới hay cửa sổ hiện có và liệu cửa sổ đó có nên điều hướng hay không. Các giá trị được phép cho client_mode là:
focus-existing: Để xử lý đường liên kết trong một cửa sổ ứng dụng hiện có, chẳng hạn như một PWA đang chạy ở chế độ độc lập.navigate-existing: Trong lựa chọn này, hệ thống sẽ chuyển đến URL mục tiêu của lần khởi chạy gần đây nhất mà người dùng tương tác với bối cảnh duyệt web trong cửa sổ ứng dụng web.navigate-new: Với lựa chọn này, một bối cảnh duyệt web mới sẽ được tạo trong cửa sổ ứng dụng web để tải URL mục tiêu của lượt khởi chạy.
Sử dụng launchQueue API để cung cấp các tham số bổ sung và xử lý các trường hợp đặc biệt.
Launch Handler API có trong Chrome 110, nhưng sẽ hữu ích hơn nhiều khi có bản cập nhật tính năng ghi lại thao tác điều hướng. Bạn có thể tìm hiểu thêm về API này trong tài liệu về Launch Handler API.
Các API liên quan khác
Ngoài việc xử lý hoạt động khởi chạy, các API khác cũng có thể đóng vai trò trong quy trình này, tuỳ thuộc vào nhu cầu cụ thể của ứng dụng. Trong đó có Trình xử lý giao thức URL, cho phép một ứng dụng web đăng ký khả năng xử lý các lược đồ URL ngoài http và https tiêu chuẩn (ví dụ: các giao thức tiêu chuẩn như mailto: hoặc các giao thức tuỳ chỉnh như web+music). Ngoài ra, API Tiện ích phạm vi ứng dụng web (hiện đang được phát triển) cho phép bạn mở rộng phạm vi của PWA để thu thập các đường liên kết từ các nguồn khác, bao gồm cả miền con, để khi người dùng nhấp vào một đường liên kết từ một nguồn được liên kết, PWA có thể được khởi chạy. Việc đề cập đến các vấn đề này một cách chi tiết nằm ngoài phạm vi của bài viết này, nhưng bạn có thể xem các đường liên kết tương ứng để biết thêm thông tin.
Trường hợp sử dụng: Chụp đường liên kết Google Chat trong PWA Chat
Để kết thúc, hãy tìm hiểu cách các phần khác nhau hoạt động cùng nhau trong ví dụ về việc nhấp vào một đường liên kết đến phòng Google Chat trong Lịch Google đối với người dùng đã cài đặt PWA Google Chat.
Trước khi ghi lại thao tác điều hướng
Trong video sau đây, một người dùng tạo cuộc họp trên Lịch Google và mời 3 khách. Ứng dụng Lịch tự động tạo một đường liên kết đến Google Chat bao gồm tất cả người tham gia. Khi người dùng nhấp vào đường liên kết này, phòng trò chuyện sẽ mở trong một thẻ trình duyệt mới. Sau đó, một biểu tượng trong thanh địa chỉ sẽ cho biết rằng một PWA tương ứng đã được cài đặt, nhưng người dùng phải tự khởi chạy PWA đó. Đây là hành vi trước khi có bản cập nhật tính năng ghi lại thao tác điều hướng:
Sau khi ghi lại chế độ chỉ đường
Video sau đây cho thấy quy trình làm việc tương tự của người dùng, nhưng giờ đây có hành vi ghi lại thao tác điều hướng mới. Trong phiên bản này, khi bạn nhấp vào đường liên kết Google Chat trong Lịch Google, phòng trò chuyện tương ứng sẽ mở ra ngay trong PWA đã cài đặt. Hơn nữa, nhóm Google Chat đã triển khai tính năng Xử lý khi khởi chạy bằng cách thêm thuộc tính launch_handler vào Tệp kê khai ứng dụng web. Bằng cách đặt client_mode thành focus-existing, họ đảm bảo rằng đường liên kết sẽ mở trong một phiên bản hiện có của PWA, nếu phiên bản đó đang chạy. Bằng cách loại bỏ độ trễ liên quan đến việc mở một thẻ trình duyệt mới rồi kích hoạt quá trình tải trang, "thời gian tương tác với người dùng" hiệu quả có thể nhanh hơn theo thiết kế. Trên thực tế, Google Chat đã cải thiện đáng kể độ trễ khi điều hướng bằng cách loại bỏ nhu cầu khởi chạy ứng dụng mới.
Kết luận và các bước tiếp theo
Bài viết này khám phá hành vi mặc định mới khi ghi lại hoạt động điều hướng có trong Chrome 139, tập trung vào một trường hợp sử dụng phổ biến là người dùng nhấp vào một đường liên kết HTTPS trong phạm vi của một PWA đã cài đặt. Bạn có thể xem thêm thông tin và các trường hợp sử dụng trong phần Quản lý thao tác điều hướng trong PWA đã cài đặt. Sơ đồ sau đây cho thấy thông tin chi tiết về các trường hợp sử dụng, bao gồm cả sự kiện người dùng, nền tảng và giao thức, cùng với kết quả tương ứng:
Quản lý hoạt động điều hướng là một khía cạnh quan trọng nhưng thường bị bỏ qua trong trải nghiệm người dùng của ứng dụng, vì hoạt động này kiểm soát điểm truy cập của ứng dụng. Các tính năng và đường liên kết được đề cập trong bài viết này có thể giúp bạn đạt được trải nghiệm giống như ứng dụng tốt nhất có thể cho PWA của mình.