¿Cómo actualizo una página HTML en tiempo real tan pronto como se actualiza la base de datos, sin actualizar la página y usar Ajax?

La respuesta breve, directa y práctica es utilizar la base de datos en tiempo real de Google Firebase , si se ajusta a sus otras demandas de persistencia del lado del servidor.

Firebase es sólido como una roca y funciona como un encanto. Su aplicación front-end establece conexiones de websocket (TCP) en vivo con el servidor / base de datos Firebase y cada vez que cambia el estado de la base de datos, se envía un mensaje inmediatamente a su aplicación para actualizar el valor correspondiente en una variable de JavaScript.

Puede conectar sus valores JS al DOM del navegador (para que estos cambios se reflejen automáticamente en la pantalla del usuario) de todo tipo de formas. Pero aquí es donde las soluciones marco como Angular y React son el ajuste obvio. Debido a que Angular y Firebase son productos de Google, el ajuste allí es especialmente ideal. Hay una biblioteca llamada AngularFire que realmente hace que la configuración sea fácil y poderosa.

Sin embargo, es posible que Firebase no sea apropiado para su proyecto por otras razones, principalmente porque Firebase utiliza un enfoque novedoso de “árbol JSON” para la estructura de base de datos , en comparación con el enfoque clásico de registros y tablas SQL, o el análogo Mongo estilo documentos y colecciones. El enfoque de árbol JSON es súper efectivo cuando no necesita poderes de consulta sofisticados (que es mucho más frecuente de lo que la mayoría de la gente piensa), pero no es el adecuado si su aplicación requiere poderes de consulta sofisticados. Esto es algo que debes decidir por ti mismo. En cualquier caso, Firebase es gratuito hasta que, a menos que su aplicación realmente despegue y exija serias demandas sobre la infraestructura, es muy atractivo. Personalmente, me encanta, y mejora constantemente y se vuelve más poderoso. Las actualizaciones llegan en un instante. Incluso han introducido una forma de inyectar funcionalidades personalizadas que puede escribir en JS para darle algo mucho más cercano a un back-end completo. Y hay toneladas de excelente orientación gratuita tanto en video como en documento.

Meteor, para su crédito, estaba ofreciendo los mismos servicios de base de datos en tiempo real durante años antes de Firebase. Todavía está disponible, pero Metoer, una empresa muy innovadora y vanguardista, se ha movido más hacia cosas más nuevas. Pero es una alternativa a Firebase para considerar, y utiliza (al menos la última vez que vi) Mongo como el DB subyacente. Esto le daría mucho más poder de consulta si lo necesita y evita el concepto JSON Tree.

En cualquier caso, es posible implementar su propia solución websocket para impulsar los cambios de db del servidor al cliente si tiene las habilidades. Pero Firebase (y Meteor) ya han hecho el trabajo pesado y son soluciones sólidas y probadas.

Base de datos AJAX

Puede seguir el enlace anterior para saber cómo actualizar una sección de acuerdo con los cambios de la base de datos.

Sugerí este enlace porque, como este sitio me ayudó en mi tiempo inicial cuando soy novato en JS.

Si estrictamente desea usar AJAX solo, entonces la mejor opción sería hacer una llamada AJAX con setinterval () junto con esto para que estas llamadas se aseguren de enviar la solicitud del servidor sin volver a cargar toda la página pero solo los datos, pero tiene un encabezado http que haría que el archivo se envíe más pesado.

Si desea un mejor rendimiento, debe usar websockets, ya que proporciona la comunicación dúplex entre el servidor y el cliente y usted, como desarrollador, no tiene las manos atadas solo a la arquitectura de solicitud y respuesta http, pero el servidor puede enviar los datos al cliente sin que el cliente tenga que preguntar para. solo necesita una biblioteca js en la web para vincular. E intente hacerlo con js, ya que podría complicarse con otros. Pero dado que está utilizando AJAX, supongo que está bastante familiarizado con el idioma.

salud.