Detectar el sistema host en el navegador
Si está escribiendo una aplicación web progresiva y desea determinar qué tipo de sistema aloja al agente, una API simple puede ayudarlo.
Solo me dirijo explícitamente a las aplicaciones web modernas con el código de este artículo. La detección de la versión del sistema operativo o del navegador era notoriamente frágil en el pasado, por lo que las nuevas API que están disponibles en el "navegador" brindan una solución robusta para tales tareas, pero solo están disponibles en los navegadores modernos.
Comprobando la plataforma
El siguiente código le muestra cómo determinar de manera confiable el entorno a través de Javascript. Accede al "navegador", un objeto disponible en la ventana que proporciona un conjunto completo de API para mejorar progresivamente su aplicación web.
/**
* 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
Como puede ver, la lógica para determinar qué tipo de sistema aloja su aplicación es muy sencilla y solo requiere unas pocas líneas de código.
Ejemplos de casos de uso
Un caso de uso común para determinar el sistema operativo del host es proporcionar diferentes atajos de teclado y, posteriormente, etiquetas "kbd" en su código. Por ejemplo, macOS usa la tecla "Comando", mientras que Windows y Linux usan la tecla "Control" para muchos accesos directos.
También puede modificar el estilo de su interfaz de usuario para alinearse mejor con la interfaz de usuario nativa del sistema host, solo por nombrar otro ejemplo.
