Hace tiempo el hash de la url era el único método para que las aplicaciones AJAX y Flash soportaran la interacción de historial, tu sabes, el botón "Atras" y "Adelante" del navegador. Personalmente utilizo mucho el hash en mis aplicaciones, por eso hace tiempo cree un tip sobre el uso del hash aquí en cristalab. Es tiempo de actualizar..
El hash es historia. ¡Hola pushState!
HTML5 incluyó pushState(); un método del objecto window.history de javascript que se encarga de cambiar directamente la url actual del navegador sin necesidad de refrescar la página. Por razones de seguridad sólo podrás cambiar el PATH del dominio y no la URL completa. La manera de usar este método es el siguiente..
Código :
window.history.pushState(data, "Titulo", "nueva_url.html");
- Primer argumento (Object o String): Datos almacenados que podrán ser recogidos con el evento window.onpopstate; activado cuando se usa un pushState() o replaceState().
- Segundo argumento (String): Asigna un título a la nueva URL. El título (ó <title>) del documento no cambiará. Es más una descripción para el manejo de historial que otra cosa.
- Tercer argumento (String): La nueva ruta a mostrár en el documento.
Usos, ventajas e información
Con este método se puede mejorar la usabilidad, seo y entre otras cosas el manejo de historial en las aplicaciones web. Ese famoso problema de la URL al utilizar ajax, ese que te impedía compartir la página ó agregar a favoritos puede términar.
Por otro lado, este método aún no es soportado por todos los navegadores. Actualmente es soportado por la última versión de Chrome y Safari. En la versión 4 de Firefox ya vendrá implementado.
¿Entonces aún no lo puedo útilizar? Tú decides. Actualmente Facebook y Flickr ya utilizan esta característica, aunque en los navegadores no soportados utilizan una versión alternativa con Hash.
Muy pronto dejaremos de necesitar librerías alternativas para lograr este detalle.
Recuerda probarlo con un navegador que soporte la característica. Si no, simplemente verás un hash aparecer.
¿Sabes SQL? ¿No-SQL? Aprende MySQL, PostgreSQL, MongoDB, Redis y más con el Curso Profesional de Bases de Datos que empieza el martes, en vivo.
Por otro lado, tu tutorial lo mandaste con una edición gloriosa, no tuve que editarle casi nada. Gracias por algo tan hermosamente escrito
Saludos.
Saludos.
NeoCesar-blog :
El problema es que en el href del enlace tiene un hash (#) y al finál lo termina interpretando. Lo mejor para correjir esto es que lanzes el pushState(); en el success de la llamada ajax que hagas.
O directamente no poner un href (Aunque no sé que tan válido sea esto en html5).
Freddie :
Por otro lado, tu tutorial lo mandaste con una edición gloriosa, no tuve que editarle casi nada. Gracias por algo tan hermosamente escrito
Gracias freddie! Oye, por qué no subió mi ClabLevel?
ivanfc0o :
El clabLevel se calcula cada 24 horas.
Por teskostudio el 04 de Febrero de 2011
Gracias!.
Por Jose Javier Oportuno el 23 de Diciembre de 2012
Por SliferxD el 11 de Noviembre de 2013
Por Harvey el 09 de Agosto de 2016