¿Cómo detectar la versión de un navegador?

Este artículo incluye teoría básica y técnica de detección de navegador en navegadores web habilitados para JavaScript.

Descripción: aunque la mayoría de los scripts funcionan en navegadores web habilitados para JavaScript, hay ciertas cosas que no funcionarán en algunos navegadores, es decir, dependen del navegador y, en algunos casos, el navegador web antiguo no admite algunos scripts.
En algunos casos, se vuelve muy importante conocer el navegador web del cliente para entregar algún contenido o información de manera adecuada. Básicamente, le permite conocer la versión y el nombre del navegador web del cliente y aquí necesitamos escribir diferentes funciones para diferentes navegadores con el propósito de detección.

Detección del navegador: principalmente hay dos objetos que se utilizan para la detección del navegador, que son los siguientes:

  • navigator.appName
  • navigator.appVersion

El propósito del primer objeto es determinar el navegador web, mientras que el propósito del segundo es determinar la versión del navegador web.

Por ejemplo, si el navegador es Mozilla Firefox, navigator.appName devuelve la string «Mozilla Firefox». Si es Edge, navigator.appName devuelve la string «Microsoft Edge». Usando ambos objetos, podemos crear un cuadro de alerta para mostrar qué navegador web está usando el cliente y este objeto navegador contiene toda la información sobre la versión del navegador web, el nombre y más. 

Ejemplo:

Javascript

<!DOCTYPE html>
<html>
 
<head>
    <script Language="JavaScript">
        var objappVersion = navigator.appVersion;
        var browserAgent = navigator.userAgent;
        var browserName = navigator.appName;
        var browserVersion = '' + parseFloat(navigator.appVersion);
        var browserMajorVersion = parseInt(navigator.appVersion, 10);
        var Offset, OffsetVersion, ix;
 
        // For Chrome
        if ((OffsetVersion = browserAgent.indexOf("Chrome")) != -1) {
            browserName = "Chrome";
            browserVersion = browserAgent.substring(OffsetVersion + 7);
        }
 
        // For Microsoft internet explorer
        else if ((OffsetVersion = browserAgent.indexOf("MSIE")) != -1) {
            browserName = "Microsoft Internet Explorer";
            browserVersion = browserAgent.substring(OffsetVersion + 5);
        }
 
        // For Firefox
        else if ((OffsetVersion = browserAgent.indexOf("Firefox")) != -1) {
            browserName = "Firefox";
        }
 
        // For Safari
        else if ((OffsetVersion = browserAgent.indexOf("Safari")) != -1) {
            browserName = "Safari";
            browserVersion = browserAgent.substring(OffsetVersion + 7);
            if ((OffsetVersion = browserAgent.indexOf("Version")) != -1)
                browserVersion = browserAgent.substring(OffsetVersion + 8);
        }
 
        // For other browser "name/version" is at the end of userAgent
        else if ((Offset = browserAgent.lastIndexOf(' ') + 1) <
            (OffsetVersion = browserAgent.lastIndexOf('/'))) {
            browserName = browserAgent.substring(Offset, OffsetVersion);
            browserVersion = browserAgent.substring(OffsetVersion + 1);
            if (browserName.toLowerCase() == browserName.toUpperCase()) {
                browserName = navigator.appName;
            }
        }
 
        // Trimming the fullVersion string at
        // semicolon/space if present
        if ((ix = browserVersion.indexOf(";")) != -1)
            browserVersion = browserVersion.substring(0, ix);
        if ((ix = browserVersion.indexOf(" ")) != -1)
            browserVersion = browserVersion.substring(0, ix);
 
 
        browserMajorVersion = parseInt('' + browserVersion, 10);
        if (isNaN(browserMajorVersion)) {
            browserVersion = '' + parseFloat(navigator.appVersion);
            browserMajorVersion = parseInt(navigator.appVersion, 10);
        }
        document.write(''
            + 'Name of Browser = ' + browserName + '<br>'
            + 'Full version = ' + browserVersion + '<br>'
            + 'Major version = ' + browserMajorVersion + '<br>'
            + 'navigator.appName = ' + navigator.appName + '<br>'
            + 'navigator.userAgent = ' + navigator.userAgent + '<br>'
        );
    </script>
</head>
 
</html>

Producción:

  • Debajo de Salida representa la salida de la detección del navegador para «Chrome»

Nombre del navegador = Chrome Versión completa = 86.0.4240.183 Versión principal = 86 navigator.appName = Netscape navigator.userAgent = Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, como Gecko) Chrome/86.0.4240.183 Safari/537.36

  • Debajo de Salida representa la salida de la detección del navegador para «Mozilla Firefox»

Nombre del navegador = Firefox Versión completa = 5 Versión principal = 5 navigator.appName = Netscape navigator.userAgent = Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:80.0) Gecko/20100101 Firefox/80.0

Conclusión: este artículo comienza con la teoría de la detección del navegador y luego explica el esquema de detección del navegador y el script para la detección. Es muy beneficioso en el entorno actual porque todos los navegadores admiten esta aplicación. Así que detecte/encuentre el navegador y luego escriba el código correspondiente.

Publicación traducida automáticamente

Artículo escrito por pranithpashikanti786 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *