Cải thiện quyền riêng tư của người dùng và trải nghiệm của nhà phát triển nhờ tính năng Gợi ý ứng dụng của tác nhân người dùng

Tính năng Gợi ý ứng dụng tác nhân người dùng là một bản mở rộng mới cho API Gợi ý ứng dụng, giú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à hiệu quả.

Tính năng 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 đó khỏi 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 vào việc phân tích cú pháp chuỗi User-Agent để sử dụng tính năng Gợi ý của ứng dụng tác nhân người dùng.

Thông tin khái quát

Khi đưa ra yêu cầu, trình duyệt web sẽ cung cấp 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. Chuỗi này đã được xác định từ năm 1996 (RFC 1945 cho HTTP/1.0), nơi bạn có thể tìm thấy định nghĩa ban đầu cho chuỗi tác nhân người dùng, bao gồm 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) và nhận xét (ví dụ: phiên bản) theo mức độ ý nghĩa.

Trạng thái của chuỗi Tác nhân người dùng

Trong 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 gian thông tin do khả năng tương thích ngược). Chúng ta có thể thấy điều đó khi xem chuỗi Tác nhân người dùng 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, mẫu thiết bị, thương hiệu và phiên bản đầy đủ của trình duyệt, đủ gợi ý để suy ra đó là trình duyệt trên thiết bị di động, đồng thời không đề cập đến một số tham chiếu đến các trình duyệt khác vì lý do trước đây.

Sự kết hợp giữa các tham số này với sự đa dạng tuyệt đối của các giá trị có thể có nghĩa là chuỗi Tác nhân người dùng có thể chứa đủ thông tin để cho phép từng người dùng được xác định duy nhất. Nếu bạn kiểm tra trình duyệt của mình tại AmIUnique, thì bạn có thể thấy chuỗi User-Agent của bạn xác định bạn chính xác đến mức nào. "Tỷ lệ tương tự" kết quả của bạn càng thấp thì yêu cầu của bạn càng độc đáo thì các máy chủ càng dễ dàng theo dõi bạn.

Chuỗi User-Agent cho phép nhiều trường hợp sử dụng hợp pháp và phục vụ mục đích quan trọng cho các nhà phát triển cũng như 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 khi nói đến chuỗi Tác nhân người dùng. Không có cấu trúc, vì vậy việc phân tích cú pháp 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 của trang web làm ảnh hưởng đến người dùng. Những vấn đề này cũng gây tổn hại không cân đối cho người dùng các trình duyệt ít phổ biến, vì các trang web có thể đã không kiểm thử được cấu hình.

Ra mắt tính năng Gợi ý mới của ứng dụng tác nhân người dùng

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 việc truyền phát mọi thứ theo mặc định của chuỗi Tác nhân người dùng. Gợi ý ứ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 một tập dữ liệu về ứng dụng (gợi ý) và trình duyệt áp dụng chính sách hoặc cấu hình người dùng của riêng mình để 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 về Tác nhân người dùng theo mặc định, quyền truy cập hiện được quản lý theo cách rõ ràng và có thể kiểm tra được. Nhà phát triển cũng được hưởng lợi từ một API đơn giản hơn – không cần biểu thức thông thường nữa!

Tập hợp 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 phần Tự động hoá việc lựa chọn tài nguyên bằng Gợi ý ứng dụng, nhưng sau đây là ôn tập nhanh về quy trình này.

Máy chủ yêu cầu các Gợi ý ứng dụng cụ thể 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 nhiều kiểu phản hồi, chẳng hạn như bằng cách phân phát hình ảnh ở độ phân giải thích hợp.

Gợi ý ứng dụng tác nhân người dùng mở rộng phạm vi thuộc tính có 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 phần giải thích, sau đó đi sâu vào đề xuất đầy đủ.

Gợi ý của ứng dụng tác nhân người dùng trên Chromium 89

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 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 ứng dụ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 tác nhân người dùng

⬇️ Phản hồi Accept-CH
⬆️ Tiêu đề yêu cầ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 các thương hiệu trình duyệt và phiên bản quan trọng của các trình duyệt đó.
Sec-CH-UA-Mobile ?1 Boolean cho biết trình duyệt có đang sử dụng thiết bị di động hay không (?1 cho giá trị true) hay không (?0 cho giá trị false).
Sec-CH-UA-Full-Version "84.0.4143.2" [Deprecated]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 các trình duyệt đó.
Sec-CH-UA-Platform "Android" Nền tảng của thiết bị, thường là hệ điều hành (OS).
Sec-CH-UA-Platform-Version "10" Phiên bản của nền tảng hoặc hệ điều hành.
Sec-CH-UA-Arch "arm" Cấu trúc cơ bản của thiết bị. Mặc dù điều 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 có đị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 cấu trúc cơ bản (ví dụ: 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

Ví dụ về một giao dịch trao đổi 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 đủ cũng như nền tảng.

HTTP/1.1 200 OK
Accept-CH: Sec-CH-UA-Full-Version-List

⬆️ 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

Bên cạnh các tiêu đề, bạn cũng có thể truy cập 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-MobileSec-CH-UA-Platform mặc định thông qua thuộc tính brandsmobile 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(). Nói cách khác, thuật ngữ "entropy cao" dùng để chỉ entropy thông tin, tứ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, tuỳ thuộc vào trình duyệt, giá trị nào được trả về (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ể thử cả tiêu đề và API JavaScript trên thiết bị của mình tại user-agent-client-hints.glitch.me.

Thời gian tồn tại của gợi ý và đặt lại

Các gợi ý được chỉ định thông qua tiêu đề Accept-CH sẽ được gửi trong suốt phiên duyệt web hoặc cho đến khi một tập hợp gợi ý khác được chỉ định.

Điều đó có nghĩa là nếu máy chủ gửi:

⬇️ Phản hồ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 cho tất cả các yêu cầu cho trang web đó cho đến khi trình duyệt đóng.

⬆️ 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 các gợi ý hiện tại mà trình duyệt đang gửi.

⬇️ Phản hồi

Accept-CH: Sec-CH-UA-Bitness

⬆️ Yêu cầu tiếp theo

Sec-CH-UA-Platform: "64"

Sec-CH-UA-Full-Version-List đã yêu cầu trước đó sẽ không được gửi.

Bạn nên coi tiêu đề Accept-CH là một tập hợp đầy đủ các gợi ý mong muốn cho trang đó, nghĩa là trình duyệt sẽ gửi các gợi ý được chỉ định cho tất cả các tài nguyên phụ trên trang đó. Mặc dù gợi ý sẽ vẫn tồn tại cho thao tác điều hướng tiếp theo, nhưng trang web không nên dựa vào hoặc cho rằng các 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 thêm thẻ này ở bất kỳ nơi nào mà 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 trên các yêu cầu do trang khởi tạo chứ không phải trong bất kỳ lần đ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, tính năng Gợi ý của ứ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 những tài nguyên bạn muốn tối ưu hoá lại nằm trên https://downloads.example.com, thì chúng sẽ không nhận được bất kỳ gợi ý nào.

Để cho phép gợi ý trên các yêu cầu 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 thuộc tính 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ụ:

🎂️ Nội dung trả lời của 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"

⬆️ Các yêu cầu đến cdn.provider hoặc img.example.com

DPR: 2

Trường hợp sử dụng tính năng Gợi ý của ứng dụng tác nhân người dùng ở đâu?

Câu trả lời nhanh là bạn nên tái cấu trúc mọi trường hợp mà bạn đ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 cùng một thông tin (tức là navigator.userAgent, navigator.appVersion hoặc navigator.platform) để sử dụng Gợi ý ứng dụng tác nhân người dùng.

Để phát triển thêm, 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ể đạt được 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 của việc dựa vào dữ liệu Tác nhân người dùng là bạn phải luôn duy trì mối liên kết giữa thuộc tính 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 kết quả phát hiện của bạn là toàn diện và luôn được cập nhật.

Vì vậy, hãy lưu ý đến những điề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ì 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 mà chuỗi Tác nhân người dùng hiện có hiển thị, đồng thời không gây gián đoạn quá mức trên các trang web hiện có. Giờ đây, khi giới thiệu tính năng Gợi ý ứng dụng tác nhân người dùng, bạn sẽ có cơ hội tìm hiểu và thử nghiệm với tính năng mới này trước khi thực hiện bất kỳ thay đổi nào đối với chuỗi 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 xuống để 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 quan trọng về phiên bản theo gợi ý mặc định. Trong Chromium, thay đổi này đã được hoãn lại cho đến ít nhất là năm 2022 để hệ sinh thái có thêm thời gian đánh giá các tính năng Gợi ý mới của ứ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 từ Chrome 93 (Lưu ý: cờ này có 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 chi tiết cụ thể đã được dọn dẹp. Ví dụ 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