Verificar Si Estás Conectado a localhost con jQuery

Nube Colectiva

hace 3 días

Verificar Si Estás Conectado a localhost con jQuery

En esta página:

En ocasiones necesitamos verificar si nuestra aplicación está conectada al localhost o servidor local.

Hacer esto con jQuery es fácil, solo debes seguir los pasos que te mostraré a continuación.

En este tutorial te enseñaré a Verificar Si Estás Conectado a localhost con jQuery, vamos con ello.

jQuery nos permite realizar tareas con menos código JavaScript

Para este ejemplo creo un archivo llamado index.html simple

Verificando la Conexión a localhost

Instanciamos jQuery y luego hacemos la verificación.

En la verificación hacemos uso de la propiedad hostname de la interfaz Location.

La interfaz Location es parte de las APIs web que vienen integradas nativamente en los navegadores:


<!-- Instanciamos jQuery -->
<script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>

<!-- Código -->
<script>
    $(document).ready(function() {

        // Este código se ejecuta cuando el documento está listo
            
        if (location.hostname === "localhost" || location.hostname === "127.0.0.1" || location.hostname === ""){

            alert("Estás en localhost !");

        } else{

            alert("Estás en un servidor remoto !");
                
        }
    });
</script>

$(document).ready(function() {

// Este código se ejecuta cuando el documento está listo

if (location.hostname === "localhost" || location.hostname === "127.0.0.1" || location.hostname === ""){

alert("Estás en localhost !");

} else{

alert("Estás en un servidor remoto !");

}

});

</script>

A continuación el código completo del archivo index.html:


<!DOCTYPE html>
<html lang="es">
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Mi Proyecto</title>
  </head>
  <body>

    <h1>Bienvenido a mi página con jQuery</h1>

    <div id="contenido">
      <p>Este es un párrafo de ejemplo</p>
    </div>

    <!-- jQuery -->
    <script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>

    <!-- Instanciamos jQuery -->
    <script>

      $(document).ready(function() {

        // Este código se ejecuta cuando el documento está listo
        if (location.hostname === "localhost" || location.hostname === "127.0.0.1" || location.hostname === "") {

          alert("Estás en localhost !");

        } else {

          alert("Estás en un servidor remoto !");

        }
      });

    </script>

  </body>
</html>

<!DOCTYPE html>

<head>

<title>Mi Proyecto</title>

</head>

<body>

<h1>Bienvenido a mi página con jQuery</h1>

<p>Este es un párrafo de ejemplo</p>

</div>

$(document).ready(function() {

// Este código se ejecuta cuando el documento está listo

if (location.hostname === "localhost" || location.hostname === "127.0.0.1" || location.hostname === "") {

alert("Estás en localhost !");

} else {

alert("Estás en un servidor remoto !");

}

});

</script>

</body>

</html>

Ahora veamos una explicación del código.

Resultado Final

Entonces si abrimos nuestra página HTML con el código jQuery.

Podemos verificar si estamos conectados al localhost y también a un servidor remoto.

También lo puedes hacer en un archivo PHP que tenga contenido HTML

Así de fácil puedes Verificar Si Estás Conectado a localhost con jQuery.

Conclusión

En este tutorial has aprendido a Verificar Si Estás Conectado a localhost con jQuery.

Te servirá de guía para que verifiques si tus proyectos están conectados al localhost.

Practica mucho, solo así serás un mejor programador en jQuery.

Nota (s)

No olvides que debemos usar la Tecnología para hacer cosas Buenas por el Mundo.

Síguenos en nuestras Redes Sociales para que no te pierdas nuestros próximos contenidos.