Interactuar con la Base de datos solo si hay conexión a Internet

Demo Github

Hace poco estaba viendo en una comunidad de Facebook un requerimiento quizás no muy habitual, pero bueno el cliente le pidió a un miembro de la comunidad que su articulo se publique cuando el sistema se conecte a Internet y mientras este articulo este sin publicarse, me dio curiosidad ayudarlo a resolver su problema. Entonces analizando la situación vi que es un problema de lado del cliente primero y luego de lado del servidor. El proyecto estaba con PHP y MySQL, voy a dar una idea de como se puede manejar este problema en este tutorial. Para ello voy a usar javascript/ajax, primero compruebo si hay conexión a Internet a través de la propiedad navigator.online, si esta conectado a Internet que ejecute un archivo PHP llamado leer.php mediante AJAX, esta tecnologia ajax/javascript nos permite leer el código PHP tal cual, el archivo leer.php contiene instrucciones para conectar a la base de datos y leer los registros luego mostrarlos en pantalla en formato JSON.

"use strict";

        window.onload = function status() {
            //Compruebo si esta conectado a Internet
            if (navigator.onLine) {
                //Si hay conexión que ejecute el archivo leer.php
                var xhttp = new XMLHttpRequest();
                xhttp.onreadystatechange = function () {
                    if (this.readyState == 4 && this.status == 200) {
                        document.getElementById("mensaje").innerHTML = this.responseText;
                    }
                };
                xhttp.open("GET", "php/leer.php", true);
                xhttp.send();
            } else {
                //Si no hay Internet, mostramos un mensaje indicando que no hay conexión a Internet;
                var msgfalse = "<span style='color:red;'>No hay conexión a Internet !</span>";
                document.getElementById('mensaje').innerHTML = msgfalse;
            }
        };

En mi vista HTML creo el div ‘mensaje’ para mostrar los resultados.

<div class="container">

        <div class="row">        

            <div class="col-md-12">

                <h1>Interactuar con la Base de datos solo si hay conexión a Internet</h1>

                <div id="mensaje"> </div>

            </div>

        </div>

</div>

Eso es todo, en el repositorio Github que esta al inicio del articulo puede ver todo el codigo js, php y html para que no tengas problemas. Ahora yo estoy usando PHP y MySQL, ustedes puede usar otro lenguaje de programación back-end y otra base de datos, no olvidemos que javascript siempre esta presente en todos los navegadores que usamos para conectarnos a internet, ya teniendo esta base pueden elegir con que tecnología acompañar a javascript.

Se me ocurre que tambien se puede usar Node JS y Mongo DB para hacer esta interacción, de ustedes depende todo ello.

Bueno gracias por visitarnos, Por favor Síguenos en nuestras redes sociales, Suscríbete a nuestro canal de Youtube eso nos motiva mucho a seguir adelante y darte buenos contenidos. Nos vemos hasta un próximo tutorial