Ostatnia aktualizacja: 

User-Agent i wykrywanie urządzenia użytkownika

User-Agent? Usiądź wygodnie i poznaj historię oraz dalszy rozwój technologii stojącej u trzonu niejednej milionowej korporacji - narzędzia do analityki i określania urządzenia użytkownika.

Sprawdź swoją wiedzę w quizie o User-Agent!

Pytanie 1 / 2

Jakiego typu nagłówkiem jest User-Agent?

Zobacz wyniki
arrow_forward
{ "lead": "Sprawdź swoją wiedzę w quizie o User-Agent!", "quiz": [{ "question": "Jakiego typu nagłówkiem jest User-Agent?", "options": [{ "value": "Response Header", "correct": false }, { "value": "HTTP Header", "correct": true }, { "value": "Request Header", "correct": true }, { "value": "TCP Header", "correct": false } ] }, { "question": "Jak nazywa się potencjalny następca tego nagłówka?", "options": [{ "value": "Super Agent Client Hints", "correct": false }, { "value": "User Agent Client Hints", "correct": true }, { "value": "User Agent Security Hints", "correct": false }, { "value": "Sec User Agent Client Hints", "correct": false } ] } ] }

Wsparcie Nagłówków SEC-CH według CanIUSE

Narazie nie jest to jeszcze "standard" :) 

Data on support for the client-hints-dpr-width-viewport feature across the major browsers from caniuse.com

Transkrypt wideo

User-Agent to nagłówek który pozwala na pobranie metadanych na temat urządzenia - takich jak wersja przeglądarki, platforma czy model urządzenia.
Jest to ciąg znaków na którego podstawie możemy zidentyfikować daną
przeglądarkę bądź program który wykonuje zapytanie http do naszego serwera www
po dany zasób - jak obrazek, albo kod HTML / CSS.
Dla kontekstu, w momencie gdy uruchamiamy dowolna stronę
internetowa z paska przeglądarki, przeglądarka robi zapytania poprzez protokół HTTP oraz otrzymuje odpowiedzi. Są to tzw.
request oraz response. Zarówno przeglądarka jak i serwer mogą takie nagłówki ustawiać (czyli np. przeglądarka ustawia nagłówki zapytań, serwer ustawia nagłówki odpowiedzi). Jednym z takich nagłówków zapytań  czyli request headers jest właśnie User-Agent. Treść
tego nagłówka jest później dostępna w przeglądarce pod window.navigator.userAgent,
bądź w narzędziach developerskich w zakładce network, i sekcji headers
dla każdego zapytania http. I tutaj
ciekawostka: możesz podejrzeć swojego agenta użytkownika poprzez zapytanie o niego
google. "What is my user agent?" - no i mamy
odpowiedź. Omówmy więc jego zawartość - z reguły wygląda
on mniej więcej tak. Mozilla/5.0 to ogólny token
który określa że przeglądarka jest kompatybilna z mozillą - na dzień dzisiejszy jest to
obecne jedynie ze względów historycznych, aby zachować kompatybilność wsteczną sieci.
Następnie, w nawiasach mamy platformę - może to być nasz system operacyjny,
jak na przykład windows bądź linux, z opcjonalnymi informacjami o jego
architekturze. Kolejne opcje to wersja produktu, silniki przeglądarki
oraz dodatkowe metadane. Ciągi znaków User-Agent różnią się
między platformami, przez co powstały różne biblioteki do ich prasowania, bazujące
na skomplikowanych wyrażeniach regularnych. I tutaj kolejna ciekawostka -
user-parser-js, jedna z najpopularniejszych bibliotek do parsowania
ciągu User-Agent miała pod koniec 2021 roku publiczne
vulnerability, czyli po prostu lukę bezpieczeństwa, przez którą hakerzy
kopali kryptowaluty na zainfekowanych maszynach, czy próbowali wykraść prywatne dane użytkowników.
Luka ta została załatana w ciągu pięciu godzin poprzez publikacje
nowych wersji biblioteki. [ a komu to potrzebne, a dlaczego ]
Do najpopularniejszych przypadków kiedy potrzebny jest
User-Agent należy między innymi szeroko pojęta analityka, diagnoza
błędów na konkretnych wersjach przeglądarek, czy cała gałąź marketingu oparta
na targetowanych reklamach. Natomiast UserAgent ma też swoje problemy:
między innymi jest to prywatność i bezpieczeństwo,
ponieważ udostępnia wrażliwe dane na temat użytkownika; idąc dalej
"fingerprinting" - czyli identyfikacja i śledzenie konkretnych użytkowników sieci
bez korzystania z rozwiązań typu ciasteczka; ze względu na różne warianty
formatów tego jak User-Agent  jest reprezentowany
jego interpretacja jest problematyczna i dlatego właśnie parsery wykorzystują skomplikowane
wyrażenie regularne, aby wysnuć hipotezę - czy tak zwany "educated
guess" - na temat tego jakie jest urządzenie z którego korzysta nasz użytkownik.
No i co dalej? Na horyzoncie pojawia się User-Agent Client Hints.
To Chrome jest prekursorem tego rozwiązania zapowiadając
plan tak zwanego "zamrażania" klasycznych User-Agent i zastąpienia
ich przez User-Agent Client Hints. Zamrożenie to sytuacja
w której część treści i User-Agenta zmieni się w kolejnych release'ach Chrome,
ustawiając wersję systemu operacyjnego na stałą, tak samo jak model urządzenia,
czy nie pokazując konkretnej wersji przeglądarki - a jedynie główny release.
W tym momencie jesteśmy tutaj na roadmapie Chrome i jak widzimy w wersji 101
tej przeglądarki widnieje monit informujący o planowanych zmianach.
Po wdrożeniu Client Hints, developerzy będą mieli do czynienia z teoretycznie prostszym API -
koniec z wyrażeniami regularnymi aby dostać się do informacji na której
nam zależy. Jednak przed nami sporo wyzwań. Domyślnie
jedynie trzy nagłówki żądania będą dostępne dla każdego zapytania, czyli nagłówki
dotyczące przeglądarki i wersji informacji czy urządzenie jest urządzeniem
mobilnym oraz platformy. Jeśli aplikacja potrzebuje
więcej informacji niż nagłówki domyślne serwer będzie musiał poprosić o ich
udostępnienie poprzez nagłówek odpowiedzi Accept-CH.
Odpowiedź otrzyma jednak w kolejnych zapytaniach HTTP, nie mając gwarancji uzyskania
informacji o które prosił. Wszystkie nagłówki
powiązane z User-Agent Client Hints mają prefiks "SEC-CH",
a jest tak z powodów bezpieczeństwa - aby upewnić się, że te nagłówki
mogą być ustawione tylko i wyłącznie przez program wykonujący zapytanie - a nie, na przykład
z poziomu kodu źródłowego. Dodatkowo User-Agent Client Hints
nie zadziałają na niezabezpieczonych stronach www, to jest takich które nie operują
na protokole https. No i to rozwiązanie również
nie jest bez wad. Mianowicie, wiele potencjalnie krytycznych danych nie będzie dostępnych przy
pierwszym zapytaniu http; możliwe są potencjalne kolizje modeli urządzeń
oraz mamy dwa standardy. Stary User-Agent oraz nowy,
gdzie na rynku dalej będą miliony urządzeń wspierających tylko tą
starą składnię w związku z czym debugowanie będzie utrudnione ze względu
na więcej wariacji ekosystemu. No cóż, pozostaje
nam trzymać rękę na pulsie i obserwować dalszy rozwój wydarzeń.

Subskrybuj kanał Koduje by nie przegapić kolejnych treści!

Kliknij by pominąć tę sekcję
06 czerwca 2022

Komentarz od autora

User-Agent - niby prosta sprawa, a ile informacji! Co prawda implementacja UA Client Hints jest wymuszana przede wszystkim przez Chrome, jestem ciekawy wpływu tych decyzji na ekosystem sieciowy. Trzeba przyznać, że obecny UserAgent string jest często wykorzystywany dla miliardowych zarobków kosztem prywatności użytkownika!

Poznaj Wojtka

Cześć! Nazywam się Wojciech Połowniak i jestem programistą Fullstack z zacięciem do tworzenia jakościowych materiałów szkoleniowych.

Uwielbiam automatyzację, VR oraz interaktywne sposoby przekazywania wiedzy. Tematy takie jak UX, dostępność czy devops również nie są mi obce.

Jestem też organizatorem meet.js oraz Techspeakerem pod banderą Mozilli... A to jeszcze nie wszystko.

Chcesz więcej?

Nie ma sprawy! Koduje to długie godziny darmowej treści dostępnej na wyciągnięcie ręki.

Newsletter

Jeśli chcesz być na bieżąco z najnowszymi inicjatywami od twórców koduje? Zapisz się na newsletter - nie spamujemy!

Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.

W przyszłości, możemy udostępnić Ci informacje o dodatkowych kursach naszego autorstwa.

Najczęściej zadawane pytania

Jaka tematyka jest poruszana na Koduje?
expand_more
Mówimy o HTML, CSS i JavaScript - zarówno na backendzie, jak i frontendzie. Tematyka taka jak Devops, architektura i infrastruktura oprogramowania również pojawią się na kanale!
Czy mogę zaproponować temat kolejnych wideo?
expand_more
Oczywiście, że tak! Najlepiej sugerować materiały w sekcji komentarzy na YouTube 
Jak to możliwe, że Koduje jest darmowe? 
expand_more
Moją pasją jest dzielenie się wiedzą w sposób zrozumiały i klarowny, jednocześnie interaktwny i angażujący. Tworząc materiały, utrwalam też własną wiedzę. Wierzę, że za to widzowie nie powinni płacić
W sieci można znaleźć strony przypominające do koduje.pl, o co chodzi?
expand_more
Niestety, na przełomie lat wiele osób próbowało podszyć się pod Koduje i wykorzystać nasze materiały do promocji własnych kanałów dystrybucyjnych.  Jeśli masz wątpliwości, czy dana strona współpracuje z Koduje - daj nam o tym znać. Nie pochwalamy piractwa, plagiatu ani szarej strefy prawa autorskiego.
Czy prowadzicie szkolenia indywidualne?
expand_more
W chwili obecnej, niestety nie. Na przełomie lat prowadziłem kursantów przez ich przygodę z programowaniem, z czego każdy otrzymał pracę jako programista. Jeśli jesteś zainteresowany lekcjami indywidualnymi, zapraszam do kontaktu mailowego.
Czy oferujecie płatne kursy?
expand_more
W przyszłości nie wykluczamy możliwości tworzenia dedykowanych kursów o danych zagadnieniach. Zapisz się na nasz newsletter, aby być na bieżąco z naszymi najnowszymi płatnymi materiałami.
Jak mogę się z wami skontaktować?
expand_more
Czytamy komentarze na YouTube! Śmiało możesz zadać pytanie na dowolny temat pod którymkolwiek z naszych wideo. Poza tym możesz skontaktować się z nami mailowo bądź poprzez fanpage na Facebooku
Obecnym właścicielem marki jest Wojciech Połowniak. Zobacz zakładkę o nas!