Kể từ Chrome 132, nhà phát triển có thể tham gia Chương trình dùng thử dành cho nhà phát triển để tìm hiểu một phương pháp mới về cửa sổ bật lên trên web: Cửa sổ bật lên được phân vùng. Bản dùng thử dành cho nhà phát triển này chỉ dành cho máy tính và tính năng này chưa có trên Android.
Cửa sổ bật lên phân vùng là một loại cửa sổ bật lên mới được thiết kế cho các lượt tương tác ngắn hạn, chẳng hạn như lượt đăng nhập hoặc xác nhận nhanh. Trình tải này tải nội dung web bằng hai tính năng riêng biệt:
Tại sao chúng ta cần cửa sổ bật lên được phân vùng?
Cửa sổ bật lên được phân vùng được thiết kế để duy trì các thuộc tính quyền riêng tư của một khung iframe được phân vùng và các thuộc tính bảo mật của cửa sổ bật lên.
Khi ngày càng có nhiều người dùng chọn duyệt web mà không cần cookie của bên thứ ba, các luồng dựa vào việc lưu trữ dữ liệu trong cửa sổ bật lên để truy xuất trong ngữ cảnh của bên thứ ba sau này (ví dụ: để duy trì phiên người dùng trên các trang web) có thể bị gián đoạn. Cửa sổ bật lên phân vùng nhằm giải quyết vấn đề này.
Cửa sổ bật lên được phân vùng hoạt động như thế nào?
Bộ nhớ của mỗi cửa sổ bật lên được phân vùng cho trình mở. Việc phân vùng bộ nhớ giới hạn quyền truy cập vào dữ liệu trên nhiều trang web, giảm thiểu rủi ro theo dõi và các cuộc tấn công chèn tập lệnh. Tìm hiểu cách hoạt động của tính năng phân vùng bộ nhớ trong tài liệu của chúng tôi.
Hãy xem xét một trang web opener.example nhúng nội dung từ third-party.example. Để hiển thị nội dung được cá nhân hoá trên opener.example, người dùng cần đăng nhập trên third-party.example. Khi cookie của bên thứ ba bị chặn trong trình duyệt của người dùng, quy trình bật lên hiện tại sẽ như sau:
- Người dùng nhấp vào nút đăng nhập.
- Một hộp thoại sẽ mở ra.
- Người dùng đăng nhập từ ngữ cảnh cấp cao nhất của
third-party.examplevà một cookie xác thực chưa phân vùng sẽ được ghi. - Nội dung
third-party.exampleđược nhúng trênopener.examplekhông có quyền truy cập vào các cookie cấp cao nhất của riêng nó được ghi trênthird-party.examplekhi nội dung đó được trình bày trong ngữ cảnh của bên thứ nhất. Điều này xảy ra do cookie xác thực không được phân vùng và do đó là cookie của bên thứ ba.
third-party.example được nhúng trên opener.example không có quyền truy cập vào cookie chưa phân vùng của chính nó được đặt trong ngữ cảnh cấp cao nhất của cửa sổ bật lên third-party.example.Bộ nhớ của một cửa sổ bật lên được phân vùng sẽ được phân vùng cho trình mở. Điều này sẽ thay đổi các bước 3-4 của luồng:
Người dùng đăng nhập từ ngữ cảnh cấp cao nhất của
third-party.example. Vì ứng dụng này mở trong một cửa sổ bật lên được phân vùng, nên bộ nhớ được phân vùng theoopener.example.Nội dung
third-party.exampleđược nhúng trênopener.examplecó quyền truy cập vào cookie riêng được đặt trong cửa sổ bật lên, vì chúng dùng chung bộ nhớ được phân vùng.
third-party.example được nhúng trên opener.example có quyền truy cập vào cookie được phân vùng riêng được đặt trong ngữ cảnh cấp cao nhất của cửa sổ bật lên third-party.example, vì cookie được phân vùng theo opener.example.Giao diện người dùng giống như phương thức so với thẻ trình mở
Cửa sổ bật lên được phân vùng nhằm giúp người dùng hiểu rằng trình mở và cửa sổ bật lên có liên quan với nhau:
- Khi người dùng chuyển sang một thẻ khác, cửa sổ bật lên sẽ tự động ẩn và không truy cập được, giống như cách một cửa sổ phương thức chỉ hiển thị khi thẻ trình mở đang hoạt động.
- Khi người dùng quay lại thẻ trình mở, cửa sổ bật lên sẽ xuất hiện lại.
- Người dùng không thể thay đổi trong thanh địa chỉ của trình duyệt của cửa sổ bật lên.
Dùng thử
Chrome 132 ra mắt bản dùng thử dành cho nhà phát triển cho tính năng cửa sổ bật lên được phân vùng. Điều này có nghĩa là tính năng này sẽ được cung cấp sau một cờ. Sau đây là cách bạn có thể thử cửa sổ bật lên được phân vùng:
- Đảm bảo bạn đang sử dụng Chrome 132 trở lên.
- Chuyển đến
chrome://flags#partitioned-popinsvà bật cờ tính năng. - Khởi động lại Chrome.
- Hãy dùng thử bản minh hoạ của chúng tôi.
Sử dụng cửa sổ bật lên được phân vùng trên trang web
Để sử dụng cửa sổ bật lên được phân vùng trên trang web, hãy gọi phương thức window.open() với tham số popin được truyền:
window.open("third-party-popin.example", "_blank", "popin");
Chia sẻ ý kiến phản hồi của bạn
Chúng tôi đang khám phá các cửa sổ bật lên được phân vùng và mong nhận được ý kiến phản hồi của nhà phát triển. Sau đây là một số trường hợp sử dụng tiềm năng:
- Quy trình xác thực người dùng. Nếu bạn đã triển khai luồng xác thực tuỳ chỉnh và quá trình xác thực diễn ra trên một miền khác với trang web của bạn (ví dụ: người dùng
site.exampleđăng nhập trênauth-site.example), hãy thử mở trang xác thực trong một cửa sổ bật lên để sử dụng cookie phiên trên trang trình mở. - Nội dung được nhúng. Hãy thử các cửa sổ bật lên được phân vùng để hiển thị nội dung bổ sung từ tiện ích của bên thứ ba, chẳng hạn như hộp thoại cài đặt, hình ảnh hoặc tệp PDF (hoặc nội dung khác thường được tải trong cửa sổ bật lên), được hiển thị trong một cửa sổ lớn hơn. Trong trường hợp này, cửa sổ bật lên được phân vùng nhằm giữ lại trạng thái phiên người dùng giữa tiện ích của bên thứ ba và trang web của bạn.
Nếu bạn có bất kỳ trường hợp nào trong số này trong giải pháp của mình, có các trường hợp sử dụng khác hoặc muốn góp phần định hình tương lai của tính năng này, hãy thử và cho chúng tôi biết:
- Bạn có gặp vấn đề nào không?
- Bạn có đề xuất nào để mang lại trải nghiệm tốt hơn cho người dùng không?
- Bạn có đề xuất nào để cải thiện giao diện người dùng không? Cụ thể, bạn có thấy giao diện người dùng cho biết rõ rằng trình mở và cửa sổ bật lên có liên quan với nhau không?
- Bạn thấy tính năng này hữu ích đến mức nào?
- Bạn có muốn sử dụng cửa sổ bật lên được phân vùng cho các trường hợp sử dụng khác không?
Hãy gửi vấn đề trên GitHub để chia sẻ suy nghĩ của bạn.