Gazdarendszer észlelése a böngészőben
Ha progresszív webalkalmazást ír, és szeretné meghatározni, hogy milyen rendszer tárolja az ügynököt, egy egyszerű API segíthet.
Kifejezetten csak a modern webalkalmazásokat céloztam meg a cikkben szereplő kóddal. Az operációs rendszer vagy a böngésző verziójának észlelése korábban köztudottan törékeny volt, így a „navigátoron” elérhető új API-k robusztus megoldást nyújtanak az ilyen feladatokra, de csak a modern böngészőkben érhetők el.
A platform ellenőrzése
A következő kód megmutatja, hogyan határozhatja meg megbízhatóan a környezetet Javascript segítségével. Hozzáfér a „navigátorhoz”, az ablakban elérhető objektumhoz, amely API-k egész készletét biztosítja a webalkalmazás fokozatos fejlesztéséhez.
/**
* Retrieve the host platform in a
* best-effort way w/ normalized output.
*/
export function getAgentSystem(){
if(!("navigator" in window)){
return "unknown";
}
// Use the modern 'web hints' provied by
// 'userAgentData' if available, else use
// the deprecated 'platform' as fallback.
const platform = (navigator.userAgentData?.platform || navigator.platform)?.toLowerCase();
if(platform.startsWith("win")) return "windows";
if(platform.startsWith("mac")) return "macos";
if(platform.startsWith("linux")) return "linux";
return "unknown";
}
// Just to give you an idea, the following properites
// are options for the legacy 'navigator.platform':
//
// HP-UX
// Linux i686
// Linux armv7l
// Mac68K
// MacPPC
// MacIntel
// SunOS
// Win16
// Win32
// WebTV OS
Amint láthatja, az alkalmazást futtató rendszer logikája nagyon egyszerű, és csak néhány sornyi kódot igényel.
Példák használati esetekre
A gazdagép operációs rendszerének meghatározására általánosan elterjedt eset az, hogy különböző billentyűkódokat, majd „kbd” címkéket adunk meg a kódban. Például a macOS a „Command” billentyűt használja, míg a Windows és a Linux a „Control” billentyűt használja sok gyorsbillentyűhöz.
Módosíthatja a felhasználói felület stílusát is, hogy jobban igazodjon a gazdagép rendszer natív felhasználói felületéhez, csak hogy egy másik példát említsünk.