En esta página:
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.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 |
"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.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 |
<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