Tính năng Gợi ý ứng dụng tác nhân người dùng là một phần mở rộng mới của API Gợi ý ứng dụng, cho phép nhà phát triển truy cập vào thông tin về trình duyệt của người dùng theo cách bảo đảm quyền riêng tư và thiết kế công thái học.
Gợi ý ứng dụng cho phép nhà phát triển chủ động yêu cầu thông tin về thiết bị hoặc điều kiện của người dùng, thay vì cần phân tích cú pháp thông tin đó trong chuỗi Tác nhân người dùng (UA). Việc cung cấp tuyến thay thế này là bước đầu tiên để cuối cùng giảm mức độ chi tiết của chuỗi User-Agent.
Tìm hiểu cách cập nhật chức năng hiện có dựa trên quá trình phân tích cú pháp chuỗi User-Agent để sử dụng Gợi ý về ứng dụng tác nhân người dùng.
Thông tin khái quát
Khi trình duyệt web đưa ra yêu cầu, chúng sẽ bao gồm thông tin về trình duyệt và môi trường của trình duyệt để máy chủ có thể bật tính năng phân tích và tuỳ chỉnh phản hồi. Định nghĩa này được định nghĩa từ đầu năm 1996 (RFC 1945 cho HTTP/1.0), trong đó bạn có thể tìm thấy định nghĩa gốc cho chuỗi User-Agent, trong đó có một ví dụ:
User-Agent: CERN-LineMode/2.15 libwww/2.17b3
Tiêu đề này nhằm chỉ định sản phẩm (ví dụ: trình duyệt hoặc thư viện) theo thứ tự quan trọng và ghi chú (ví dụ: phiên bản).
Trạng thái của chuỗi Tác nhân người dùng
Trong nhiều thập kỷ xen kẽ, chuỗi này đã tích luỹ nhiều thông tin chi tiết bổ sung về ứng dụng đưa ra yêu cầu (cũng như không liên quan do khả năng tương thích ngược). Chúng ta có thể thấy điều đó khi xem chuỗi User-Agent hiện tại của Chrome:
Mozilla/5.0 (Linux; Android 10; Pixel 3) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/84.0.4076.0 Mobile Safari/537.36
Chuỗi trên chứa thông tin về hệ điều hành và phiên bản của người dùng, kiểu thiết bị, thương hiệu và phiên bản đầy đủ của trình duyệt, đủ gợi ý để suy luận đó là trình duyệt dành cho thiết bị di động và chưa đề cập đến một số nội dung tham chiếu đến các trình duyệt khác vì lý do trước đây.
Khi kết hợp các tham số này với tính đa dạng tuyệt đối về các giá trị có thể có, chuỗi User-Agent có thể chứa đủ thông tin để cho phép từng người dùng được xác định riêng biệt.
Chuỗi User-Agent hỗ trợ nhiều trường hợp sử dụng hợp lệ và phục vụ mục đích quan trọng cho các nhà phát triển và chủ sở hữu trang web. Tuy nhiên, điều quan trọng là quyền riêng tư của người dùng phải được bảo vệ khỏi các phương thức theo dõi bí mật và việc gửi thông tin UA theo mặc định sẽ đi ngược lại mục tiêu đó.
Ngoài ra, bạn cũng cần cải thiện khả năng tương thích của web đối với chuỗi User-Agent. Công cụ này không có cấu trúc, vì vậy, việc phân tích cú pháp sẽ dẫn đến sự phức tạp không cần thiết, thường là nguyên nhân gây ra lỗi và các vấn đề về khả năng tương thích trang web và gây tổn hại cho người dùng. Những vấn đề này cũng gây tổn hại không đáng kể cho người dùng của những trình duyệt ít phổ biến hơn, vì các trang web có thể đã không kiểm thử được cấu hình của họ.
Ra mắt tính năng Gợi ý ứng dụng tác nhân người dùng mới
Gợi ý ứng dụng tác nhân người dùng cho phép truy cập vào cùng một thông tin nhưng theo cách bảo đảm quyền riêng tư hơn, từ đó cho phép các trình duyệt giảm thiểu chế độ mặc định của chuỗi Tác nhân người dùng là truyền mọi thông tin. Gợi ý về ứng dụng thực thi một mô hình trong đó máy chủ phải yêu cầu trình duyệt cung cấp tập dữ liệu về ứng dụng (gợi ý) và trình duyệt áp dụng các chính sách hoặc cấu hình người dùng riêng để xác định dữ liệu nào được trả về. Điều này có nghĩa là thay vì hiển thị tất cả thông tin Tác nhân người dùng theo mặc định, giờ đây quyền truy cập được quản lý theo cách rõ ràng và có thể kiểm tra được. Nhà phát triển cũng hưởng lợi từ một API đơn giản hơn – không còn biểu thức chính quy!
Bộ Gợi ý ứng dụng hiện tại chủ yếu mô tả khả năng hiển thị và kết nối của trình duyệt. Bạn có thể khám phá thông tin chi tiết trong bài viết Tự động hoá lựa chọn tài nguyên bằng gợi ý ứng dụng, nhưng sau đây là phần ôn lại kiến thức về quy trình này.
Máy chủ yêu cầu Gợi ý ứng dụng cụ thể thông qua một tiêu đề:
⬇️ Phản hồi từ máy chủ
Accept-CH: Viewport-Width, Width
Hoặc thẻ meta:
<meta http-equiv="Accept-CH" content="Viewport-Width, Width" />
Sau đó, trình duyệt có thể chọn gửi lại các tiêu đề sau trong các yêu cầu tiếp theo:
⬆️ Yêu cầu tiếp theo
Viewport-Width: 460
Width: 230
Máy chủ có thể chọn thay đổi các phản hồi, chẳng hạn như phân phát hình ảnh ở độ phân giải phù hợp.
Gợi ý ứng dụng tác nhân người dùng mở rộng phạm vi của các tài sản với tiền tố Sec-CH-UA có thể được chỉ định thông qua tiêu đề phản hồi của máy chủ Accept-CH. Để biết mọi thông tin chi tiết, hãy bắt đầu với nội dung giải thích rồi tìm hiểu kỹ đề xuất đầy đủ.
Gợi ý ứng dụng tác nhân người dùng trên Chromium 89
Tính năng Gợi ý ứng dụng tác nhân người dùng đã được bật theo mặc định trong Chrome kể từ phiên bản 89.
Theo mặc định, trình duyệt sẽ trả về thương hiệu của trình duyệt, phiên bản quan trọng / chính, nền tảng và một chỉ báo nếu khách hàng là thiết bị di động:
⬆️ Tất cả yêu cầu
Sec-CH-UA: "Chromium";v="93", "Google Chrome";v="93", " Not;A Brand";v="99"
Sec-CH-UA-Mobile: ?0
Sec-CH-UA-Platform: "macOS"
Tiêu đề của yêu cầu và phản hồi của tác nhân người dùng
⬇️ Phản hồi Accept-CH⬆️ yêu cầu tiêu đề |
⬆️ Yêu cầu Giá trị mẫu |
Nội dung mô tả |
|---|---|---|
Sec-CH-UA |
"Chromium";v="84","Google Chrome";v="84" |
Danh sách thương hiệu trình duyệt và phiên bản quan trọng của trình duyệt. |
Sec-CH-UA-Mobile |
?1 |
Giá trị boolean cho biết trình duyệt có trên thiết bị di động (?1 cho giá trị true) hay không (?0 cho giá trị false). |
Sec-CH-UA-Full-Version |
"84.0.4143.2" |
[Không dùng nữa]Phiên bản hoàn chỉnh cho trình duyệt. |
Sec-CH-UA-Full-Version-List |
"Chromium";v="84.0.4143.2","Google Chrome";v="84.0.4143.2" |
Danh sách thương hiệu trình duyệt và phiên bản đầy đủ của trình duyệt. |
Sec-CH-UA-Platform |
"Android" |
Nền tảng cho thiết bị, thường là hệ điều hành (OS). |
Sec-CH-UA-Platform-Version |
"10" |
Phiên bản dành cho nền tảng hoặc hệ điều hành. |
Sec-CH-UA-Arch |
"arm" |
Kiến trúc cơ bản của thiết bị. Mặc dù việc này có thể không liên quan đến việc hiển thị trang, nhưng trang web có thể muốn cung cấp tệp tải xuống với định dạng mặc định. |
Sec-CH-UA-Model |
"Pixel 3" |
Mẫu thiết bị. |
Sec-CH-UA-Bitness |
"64" |
Độ bit của kiến trúc cơ bản (tức là kích thước tính bằng bit của một số nguyên hoặc địa chỉ bộ nhớ) |
Trao đổi mẫu
Một ví dụ về giao dịch trao đổi sẽ có dạng như sau:
⬆️ Yêu cầu ban đầu từ trình duyệt
Trình duyệt đang yêu cầu trang /downloads
từ trang web và gửi Tác nhân người dùng cơ bản mặc định.
GET /downloads HTTP/1.1
Host: example.site
Sec-CH-UA: "Chromium";v="93", "Google Chrome";v="93", " Not;A Brand";v="99"
Sec-CH-UA-Mobile: ?1
Sec-CH-UA-Platform: "Android"
⬇️ Phản hồi từ máy chủ
Máy chủ gửi lại trang và yêu cầu cung cấp phiên bản trình duyệt đầy đủ và nền tảng.
HTTP/1.1 200 OK
Accept-CH: Sec-CH-UA-Full-Version-List
⬆️ Các yêu cầu tiếp theo
Trình duyệt cấp cho máy chủ quyền truy cập vào thông tin bổ sung và gửi lại gợi ý bổ sung trong tất cả các yêu cầu tiếp theo.
GET /downloads/app1 HTTP/1.1
Host: example.site
Sec-CH-UA: " Not A;Brand";v="99", "Chromium";v="98", "Google Chrome";v="98"
Sec-CH-UA-Mobile: ?1
Sec-CH-UA-Full-Version-List: " Not A;Brand";v="99.0.0.0", "Chromium";v="98.0.4738.0", "Google Chrome";v="98.0.4738.0"
Sec-CH-UA-Platform: "Android"
API JavaScript
Cùng với các tiêu đề, bạn cũng có thể truy cập vào Tác nhân người dùng trong JavaScript thông qua navigator.userAgentData. Bạn có thể truy cập thông tin tiêu đề Sec-CH-UA, Sec-CH-UA-Mobile và Sec-CH-UA-Platform mặc định thông qua thuộc tính brands và mobile tương ứng:
// Log the brand data
console.log(navigator.userAgentData.brands);
// output
[
{
brand: 'Chromium',
version: '93',
},
{
brand: 'Google Chrome',
version: '93',
},
{
brand: ' Not;A Brand',
version: '99',
},
];
// Log the mobile indicator
console.log(navigator.userAgentData.mobile);
// output
false;
// Log the platform value
console.log(navigator.userAgentData.platform);
// output
"macOS";
Các giá trị bổ sung được truy cập thông qua lệnh gọi getHighEntropyValues(). Thuật ngữ "entropy cao" đề cập đến entropy thông tin, nói cách khác là lượng thông tin mà các giá trị này tiết lộ về trình duyệt của người dùng. Giống như việc yêu cầu tiêu đề bổ sung, trình duyệt phụ thuộc vào việc trình duyệt nào trả về giá trị nào (nếu có).
// Log the full user-agent data
navigator
.userAgentData.getHighEntropyValues(
["architecture", "model", "bitness", "platformVersion",
"fullVersionList"])
.then(ua => { console.log(ua) });
// output
{
"architecture":"x86",
"bitness":"64",
"brands":[
{
"brand":" Not A;Brand",
"version":"99"
},
{
"brand":"Chromium",
"version":"98"
},
{
"brand":"Google Chrome",
"version":"98"
}
],
"fullVersionList":[
{
"brand":" Not A;Brand",
"version":"99.0.0.0"
},
{
"brand":"Chromium",
"version":"98.0.4738.0"
},
{
"brand":"Google Chrome",
"version":"98.0.4738.0"
}
],
"mobile":false,
"model":"",
"platformVersion":"12.0.1"
}
Bản minh hoạ
Bạn có thể dùng thử cả tiêu đề và API JavaScript trên thiết bị của mình tại user-agent-client-hints.glitch.me.
Gợi ý về thời gian tồn tại và đặt lại
Các gợi ý được chỉ định qua tiêu đề Accept-CH sẽ được gửi trong suốt phiên duyệt web hoặc cho đến khi bạn chỉ định một bộ gợi ý khác.
Điều đó có nghĩa là nếu máy chủ gửi:
⬇️ Câu trả lời
Accept-CH: Sec-CH-UA-Full-Version-List
Sau đó, trình duyệt sẽ gửi tiêu đề Sec-CH-UA-Full-Version-List trong tất cả các yêu cầu của trang web đó cho đến khi trình duyệt đóng.
⬆️ Các yêu cầu tiếp theo
Sec-CH-UA-Full-Version-List: " Not A;Brand";v="99.0.0.0", "Chromium";v="98.0.4738.0", "Google Chrome";v="98.0.4738.0"
Tuy nhiên, nếu nhận được một tiêu đề Accept-CH khác, thì tiêu đề đó sẽ thay thế hoàn toàn gợi ý hiện tại mà trình duyệt đang gửi.
⬇️ Câu trả lời
Accept-CH: Sec-CH-UA-Bitness
⬆️ Các yêu cầu tiếp theo
Sec-CH-UA-Platform: "64"
Sec-CH-UA-Full-Version-List đã được yêu cầu trước đó sẽ không được gửi.
Bạn nên xem tiêu đề Accept-CH chỉ định bộ gợi ý hoàn chỉnh mà bạn muốn cho trang đó, nghĩa là sau đó trình duyệt sẽ gửi các gợi ý được chỉ định cho mọi tài nguyên phụ trên trang đó. Mặc dù gợi ý sẽ vẫn được duy trì cho thành phần điều hướng tiếp theo, nhưng trang web không được dựa hoặc giả định rằng gợi ý sẽ được phân phối.
Bạn cũng có thể sử dụng tính năng này để xoá tất cả gợi ý mà trình duyệt gửi một cách hiệu quả bằng cách gửi một Accept-CH trống trong phản hồi. Hãy cân nhắc việc thêm URL này vào bất kỳ nơi nào
người dùng đang đặt lại lựa chọn ưu tiên hoặc đăng xuất khỏi trang web của bạn.
Mẫu này cũng khớp với cách hoạt động của gợi ý thông qua thẻ <meta http-equiv="Accept-CH" …>. Gợi ý đã yêu cầu sẽ chỉ được gửi theo các yêu cầu do trang khởi tạo, chứ không phải trên bất kỳ hoạt động điều hướng tiếp theo nào.
Phạm vi gợi ý và yêu cầu trên nhiều nguồn gốc
Theo mặc định, Gợi ý ứng dụng sẽ chỉ được gửi đối với các yêu cầu có cùng nguồn gốc. Điều đó có nghĩa là nếu bạn yêu cầu gợi ý cụ thể trên https://example.com, nhưng các tài nguyên bạn muốn tối ưu hoá lại nằm trên https://downloads.example.com, thì các tài nguyên đó sẽ không nhận được bất kỳ gợi ý nào.
Để cho phép gợi ý về các yêu cầu trên nhiều nguồn gốc, mỗi gợi ý và nguồn gốc phải được chỉ định bằng một tiêu đề Permissions-Policy. Để áp dụng gợi ý này cho Gợi ý ứng dụng tác nhân người dùng, bạn cần viết thường gợi ý và xoá tiền tố sec-. Ví dụ:
⬇️ Câu trả lời từ example.com
Accept-CH: Sec-CH-UA-Platform-Version, DPR
Permissions-Policy: ch-ua-platform-version=(self "downloads.example.com"),
ch-dpr=(self "cdn.provider" "img.example.com");
⬆️ Yêu cầu gửi đến downloads.example.com
Sec-CH-UA-Platform-Version: "10"
⬆️ Yêu cầu đến cdn.provider hoặc img.example.com
DPR: 2
Sử dụng Gợi ý ứng dụng tác nhân người dùng ở đâu?
Câu trả lời ngắn gọn là bạn nên tái cấu trúc mọi trường hợp đang phân tích cú pháp tiêu đề Tác nhân người dùng hoặc sử dụng bất kỳ lệnh gọi JavaScript nào truy cập vào cùng thông tin (ví dụ: navigator.userAgent, navigator.appVersion hoặc navigator.platform) để sử dụng Gợi ý ứng dụng tác nhân người dùng.
Tiến thêm một bước nữa, bạn nên kiểm tra lại việc sử dụng thông tin Tác nhân người dùng và thay thế bằng các phương thức khác bất cứ khi nào có thể. Thông thường, bạn có thể hoàn thành cùng một mục tiêu bằng cách sử dụng tính năng nâng cao tăng dần, phát hiện tính năng hoặc thiết kế thích ứng. Vấn đề cơ bản khi dựa vào dữ liệu Tác nhân người dùng là bạn luôn duy trì mối liên kết giữa thuộc tính mà bạn đang kiểm tra và hành vi mà thuộc tính đó bật. Đó là chi phí bảo trì để đảm bảo rằng hoạt động phát hiện của bạn là toàn diện và luôn được cập nhật.
Với những lưu ý này, kho lưu trữ Gợi ý ứng dụng tác nhân người dùng liệt kê một số trường hợp sử dụng hợp lệ cho các trang web.
Điều gì sẽ xảy ra với chuỗi Tác nhân người dùng?
Mục đích của kế hoạch này là giảm thiểu khả năng theo dõi bí mật trên web bằng cách giảm lượng thông tin nhận dạng do chuỗi Tác nhân người dùng hiện có tiết lộ trong khi không gây gián đoạn quá mức trên các trang web hiện có. Giờ đây, việc ra mắt tính năng Gợi ý về ứng dụng tác nhân người dùng giúp bạn có cơ hội tìm hiểu và thử nghiệm tính năng mới này trước khi thay đổi bất kỳ chuỗi nào cho tác nhân người dùng.
Cuối cùng, thông tin trong chuỗi Tác nhân người dùng sẽ giảm bớt để duy trì định dạng cũ trong khi chỉ cung cấp cùng một trình duyệt cấp cao và thông tin phiên bản quan trọng theo gợi ý mặc định. Trong Chromium, thay đổi này đã được trì hoãn cho đến ít nhất là năm 2022 để hệ sinh thái có thêm thời gian đánh giá các khả năng mới của tính năng Gợi ý ứng dụng tác nhân người dùng.
Bạn có thể kiểm thử phiên bản của tính năng này bằng cách bật cờ about://flags/#reduce-user-agent trên Chrome 93 (Lưu ý: cờ này được đặt tên là about://flags/#freeze-user-agent trong các phiên bản Chrome 84 – 92). Thao tác này sẽ trả về một chuỗi chứa các mục nhập trước đây vì lý do tương thích, nhưng với các thông tin cụ thể đã được dọn dẹp. Ví dụ: bạn có thể nhập một số thông tin như:
Mozilla/5.0 (Linux; Android 10; K) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/93.0.0.0 Mobile Safari/537.36
Hình thu nhỏ của Sergey Zolkin trên Unsplash