User-Agent Client Hints to nowe rozszerzenie interfejsu Client Hints API, które umożliwia deweloperom uzyskiwanie dostępu do informacji o przeglądarce użytkownika w sposób zapewniający ochronę prywatności i ergonomię.
Wskazówki dla klienta pozwalają programistom aktywnie prosić o informacje na temat urządzeń lub warunków, bez konieczności analizowania ich z klienta użytkownika (UA). ciągu znaków. Wyznaczanie alternatywnej trasy to pierwszy krok do tego, zmniejsza szczegółowość ciągu znaków klienta użytkownika.
Dowiedz się, jak zaktualizować obecne funkcje, które wymagają analizy składni Ciąg znaków klienta użytkownika, aby korzystać z instrukcji dotyczących klienta użytkownika.
Tło
Gdy przeglądarka wysyła żądania, podają informacje o przeglądarce aby serwery mogły włączyć statystyki i dostosować odpowiedź. Zostało to zdefiniowane już w 1996 roku (RFC 1945 dla HTTP/1.0), gdzie można znajdź pierwotną definicję ciągu znaków User-Agent, która zawiera przykład:
User-Agent: CERN-LineMode/2.15 libwww/2.17b3
Ten nagłówek służył do określania (w kolejności według istotności) produktu (np. (przeglądarka lub biblioteka) oraz komentarz (np. wersję).
Stan ciągu znaków klienta użytkownika
W ciągu dekad ten ciąg wygenerował różne dodatkowe szczegółowe informacje o kliencie przesyłającym żądanie (oraz informacje o problemie ze względu na negatywną sytuację); zgodność). Widać to, gdy spojrzymy na klienta użytkownika Chrome ciąg znaków:
Mozilla/5.0 (Linux; Android 10; Pixel 3) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/84.0.4076.0 Mobile Safari/537.36
Powyższy ciąg zawiera informacje o systemie operacyjnym użytkownika wersja, model urządzenia, marka i pełna wersja przeglądarki, a także kilka wskazówek, wywnioskować, że chodzi o przeglądarkę mobilną i nie wspominając o wielu odniesieniach do innych przeglądarek z powodów historycznych.
Połączenie tych parametrów z ogromną różnorodnością możliwych wartości oznacza, że ciąg znaków User-Agent może zawierać wystarczającą ilość informacji, jednoznaczną identyfikację użytkowników.
Ciąg znaków klienta użytkownika umożliwia wiele uzasadnionych przypadków użycia, i służą deweloperom i właścicielom witryn. Jest jednak kluczowe znaczenie ma też to, aby użytkownicy prywatność jest chroniona przed ukrytymi metodami śledzenia, a wysyłanie informacji UA domyślnie narusza ten cel.
Trzeba też poprawić zgodność z internetem, jeśli chodzi o klienta użytkownika. ciągu znaków. Jest nieuporządkowany, więc analizowanie go skutkuje zbędną złożonością, co jest często przyczyną błędów i problemów ze zgodnością witryny, które mają negatywny wpływ na użytkowników. Problemy te są także nieproporcjonalnie szkodliwe dla użytkowników mniej popularnych przeglądarek, może nie udać się przeprowadzić testów pod kątem ich konfiguracji.
Przedstawiamy nowe wskazówki dotyczące klienta użytkownika
Wskazówki dotyczące klienta użytkownika umożliwiają dostęp do tych samych informacji, ale w sposób zapewniający ochronę prywatności, włącz przeglądarki, aby ostatecznie zmniejszyć domyślne ustawienie ciągu znaków User-Agent transmitowanie wszystkiego. Wskazówki dla klienta wymuszają model, w którym serwer musi poprosić przeglądarkę o zebranie danych o kliencie (wskazówki), a przeglądarka stosuje własne zasady lub konfigurację użytkownika do określać, jakie dane są zwracane. Zamiast ujawniać wszystkie do informacji o kliencie użytkownika, dostęp jest teraz zarządzany w sposób bezpośredni i o modzie. Prostsze interfejsy API mogą być też przydatne dla programistów – nie trzeba ich już stosować wyrażenia.
Obecny zestaw wskazówek dla klienta opisuje przede wszystkim sposób wyświetlania i możliwości połączeń. Więcej informacji znajdziesz w artykule Automatyzacja wyboru zasobów za pomocą wskazówek klienta, ale przypomnę sobie ten proces w skrócie.
Serwer prosi o konkretne wskazówki dla klienta w nagłówku:
Љ️ Odpowiedź z serwera
Accept-CH: Viewport-Width, Width
Lub metatag:
<meta http-equiv="Accept-CH" content="Viewport-Width, Width" />
Przeglądarka może następnie zdecydować się na wysłanie poniższych nagłówków z powrotem żądania:
⬆️ Następna prośba
Viewport-Width: 460
Width: 230
Serwer może zróżnicować swoje odpowiedzi, na przykład wyświetlając obrazy w odpowiednie rozwiązanie.
Wskazówki dotyczące klienta użytkownika rozszerzają zakres właściwości za pomocą interfejsu Sec-CH-UA
prefiks, który można określić w nagłówku odpowiedzi serwera Accept-CH. Dla każdego
szczegóły, zacznij od wyjaśniania,
zapoznaj się z pełną ofertą.
Wskazówki dotyczące klienta użytkownika w Chromium 89
Wskazówki dotyczące klienta użytkownika są domyślnie włączone w Chrome od wersji 89.
Domyślnie przeglądarka zwraca markę przeglądarki, wersję istotną / główną, oraz wskaźnik, jeśli klient korzysta z urządzenia mobilnego:
⬆️ Wszystkie żądania
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"
Nagłówki odpowiedzi i żądań klienta użytkownika
⩍️ Odpowiedź Accept-CH⬆️ Nagłówek żądania |
⬆️ Żądanie Przykładowa wartość |
Opis |
|---|---|---|
Sec-CH-UA |
"Chromium";v="84","Google Chrome";v="84" |
Lista marek przeglądarek i ich najważniejszych wersji. |
Sec-CH-UA-Mobile |
?1 |
Wartość logiczna wskazująca, czy przeglądarka korzysta z urządzenia mobilnego (?1 – prawda) czy nie (?0 – fałsz). |
Sec-CH-UA-Full-Version |
"84.0.4143.2" |
[Wycofano]Kompletna wersja dla przeglądarki. |
Sec-CH-UA-Full-Version-List |
"Chromium";v="84.0.4143.2","Google Chrome";v="84.0.4143.2" |
Lista marek przeglądarek i ich pełna wersja. |
Sec-CH-UA-Platform |
"Android" |
Platforma, z której korzysta urządzenie, zwykle jest to system operacyjny. |
Sec-CH-UA-Platform-Version |
"10" |
Wersja platformy lub systemu operacyjnego. |
Sec-CH-UA-Arch |
"arm" |
Podstawowa architektura urządzenia. Choć wyświetlenie strony może nie mieć związku z wyświetlaniem, witryna może oferować możliwość pobrania pliku w domyślnym formacie. |
Sec-CH-UA-Model |
"Pixel 3" |
Model urządzenia. |
Sec-CH-UA-Bitness |
"64" |
Bitwa bazowej architektury (tzn. rozmiar w bitach liczby całkowitej lub adresu pamięci) |
Przykładowa giełda
Przykładowa giełda może wyglądać tak:
⬆️ Wstępne żądanie z przeglądarki
Przeglądarka żąda /downloads
z witryny i wysyła domyślny podstawowy klient użytkownika.
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"
Љ️ Odpowiedź z serwera
Serwer wysyła stronę z powrotem i dodatkowo
prosi o podanie pełnej wersji przeglądarki i platformy.
HTTP/1.1 200 OK
Accept-CH: Sec-CH-UA-Full-Version-List
⬆️ Kolejne żądania
Przeglądarka przyznaje serwerowi dostęp do danych
zawiera dodatkowe informacje i odsyła dodatkowe wskazówki w kolejnych
żądań.
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"
JavaScript API
Oprócz nagłówków do pola User-Agent możesz uzyskać dostęp w JavaScripcie za pomocą
navigator.userAgentData Domyślne ustawienia: Sec-CH-UA, Sec-CH-UA-Mobile oraz
Informacje z nagłówka Sec-CH-UA-Platform są dostępne za pomocą interfejsów brands oraz
mobile właściwości:
// 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";
Dostęp do dodatkowych wartości uzyskuje się poprzez wywołanie getHighEntropyValues().
„wysoka entropia” oznacza entropię informacji, w innym
słowa – ilość informacji na temat
przeglądarki. Podobnie jak w przypadku żądania dodatkowych nagłówków, wybór należy do przeglądarki,
jakie wartości są zwracane.
// 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"
}
Prezentacja
Zarówno nagłówki, jak i interfejs JavaScript API możesz wypróbować na swoim urządzeniu na user-agent-client-hints.glitch.me.
Cykl życia podpowiedzi i resetowanie
Wskazówki określone w nagłówku Accept-CH będą wysyłane na czas
lub do określenia innego zestawu wskazówek.
Oznacza to, że jeśli serwer wysyła:
⩍️ Odpowiedź
Accept-CH: Sec-CH-UA-Full-Version-List
Następnie przeglądarka będzie wysyłać nagłówek Sec-CH-UA-Full-Version-List we wszystkich żądaniach
do momentu zamknięcia przeglądarki.
⬆️ Kolejne prośby
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"
Jeśli jednak zostanie odebrany inny nagłówek Accept-CH, zostanie to całkowicie usunięte
zastąp bieżące wskazówki wysyłane przez przeglądarkę.
⩍️ Odpowiedź
Accept-CH: Sec-CH-UA-Bitness
⬆️ Kolejne prośby
Sec-CH-UA-Platform: "64"
Pytanie o: Sec-CH-UA-Full-Version-List nie zostanie wysłane.
Nagłówek Accept-CH najlepiej traktować jako określenie pełnego zestawu
wskazówki dotyczące danej strony, co oznacza, że przeglądarka wysyła określone wskazówki
dla wszystkich zasobów podrzędnych na tej stronie. Wskazówki będą obowiązywać przez następne
nawigacji, witryna nie powinna polegać na tym, że zostaną wyświetlone.
Możesz również użyć tej opcji, aby usunąć wszystkie wskazówki wysyłane przez przeglądarkę.
wysyłając w odpowiedzi puste pole Accept-CH. Zastanów się nad dodaniem tych elementów w dowolnym miejscu
o resetowaniu ustawień lub wylogowaniu się użytkownika z Twojej witryny.
Ten wzorzec odpowiada również temu, jak działają wskazówki na podstawie
<meta http-equiv="Accept-CH" …>. Żądane wskazówki zostaną wysłane tylko
żądaniami zainicjowanymi przez stronę, a nie przy kolejnych odwiedzinach.
Zakres podpowiedzi i żądania z innych domen
Domyślnie wskazówki dla klienta będą wysyłane tylko w przypadku żądań z tej samej domeny. Oznacza to,
jeśli prosisz o konkretne wskazówki w https://example.com, ale zasoby,
chcą zoptymalizować, są w https://downloads.example.com, nie będą
nie otrzymasz żadnych wskazówek.
Aby zezwolić na wskazówki dotyczące żądań z innych domen, należy określić każdą wskazówkę i źródło
przez nagłówek Permissions-Policy. Aby zastosować tę metodę do klienta użytkownika,
wpisz podpowiedź i usuń prefiks sec-. Na przykład:
⩍️ Odpowiedź od: 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");
⬆️ Prośba do: downloads.example.com
Sec-CH-UA-Platform-Version: "10"
⬆️ Prośby dotyczące: cdn.provider lub img.example.com
DPR: 2
Gdzie można korzystać ze wskazówek dotyczących klienta użytkownika?
Pamiętaj, że musisz refaktoryzować wszystkie wystąpienia analizy
nagłówek User-Agent lub użycie
wywołań JavaScript, które
mają dostęp do tych samych informacji (np. navigator.userAgent, navigator.appVersion,
lub navigator.platform), aby umożliwić korzystanie z instrukcji dotyczących klienta użytkownika.
Pójdź o krok dalej, ponownie sprawdź, w jakim stopniu korzystasz z interfejsu User-Agent. i zastępować je innymi metodami, gdy tylko jest to możliwe. Można często aby osiągnąć ten sam cel, stopniowo ulepszając funkcje, wykrywaniem czy projektowaniem responsywnym. Podstawowym problemem związanym z korzystaniem z danych klienta użytkownika jest to, że zachowanie mapowania między sprawdzaną usługą a jej zachowaniem które umożliwia. To opłata za konserwację, która gwarantuje, że wykrywanie jest wyczerpująca i aktualna.
Mając na uwadze te zastrzeżenia, repozytorium User-Agent Client Hints zawiera listę prawidłowych przypadków użycia witryn.
Co się dzieje z ciągiem znaków User-Agent?
Celem jest ograniczenie możliwości ukrytego śledzenia użytkowników w internecie przez zmniejszenie ilość informacji umożliwiających identyfikację ujawnianych przez istniejący ciąg znaków klienta użytkownika nie powodując nadmiernych zakłóceń w działaniu istniejących witryn. Przedstawiamy klienta użytkownika Wskazówki dla klienta dają teraz szansę na zrozumienie i eksperymentowanie z nowymi przed wprowadzeniem jakichkolwiek zmian w ciągach znaków User-Agent.
Ostatecznie informacje w ciągu znaków User-Agent zostaną zmniejszone, aby zachować starszego formatu, a jednocześnie udostępnia tylko tę samą przeglądarkę wysokiego poziomu zgodnie z domyślnymi wskazówkami. W Chromium ta zmiana odroczone co najmniej do 2022 r., aby dać ekosystemowi dodatkowy czas na ocenią nowe możliwości funkcji Wskazówki dotyczące klienta użytkownika.
Możesz przetestować jedną z wersji, włączając
flaga about://flags/#reduce-user-agent z Chrome 93 (uwaga: ta flaga była
o nazwie about://flags/#freeze-user-agent w wersjach Chrome 84–92). Dzięki temu
zwraca ciąg z wpisami historycznymi ze względu na zgodność, ale z
oczyszczone niuanse. Na przykład:
Mozilla/5.0 (Linux; Android 10; K) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/93.0.0.0 Mobile Safari/537.36
Miniatura: Sergey Zolkin włączono Odloty