Resolviendo las peticiones desde la consola de desarrollo en Google Chrome

Si eres desarrollador lo cual es altamente probable si estas leyendo esto, sabrás que una de las cosas que se pueden hacer molestas al momento de desarrollar es cuando se están creando las vistas para obtener datos con formato JSON (es decir recursos desde una URL la cual es accedida mediante JavaScript, por ejemplo) o enviando datos al servidor; no siempre es fácil detectar el o los errores desde el navegador; por suerte Google Chrome ofrece una interesante herramienta que permite monitorear las peticiones HTTP de los sitios que visitamos aunque en nuestro caso de mayor interés es desde el ámbito de desarrollo de nuestras aplicaciones web.

Consultando las peticiones HTTP en Google Chrome

Para ver las peticiones HTTP que realizamos desde nuestra aplicación o web primero debemos ir a la consola de desarrollo de Google Chrome presionando F12 o desde la opción "Más Herramientas" en el menú y veremos nuestra consola de desarrollo; por ejemplo, en la siguiente imagen vemos que ocurrió un error en una de las URL que ejecuta un JavaScript interno en la aplicación:

En este caso es un Ajax que envía una petición POST al servidor, si fuera una petición GET, el navegador compondría la URL con los parámetros y podríamos detectar el error abriendo el enlace en una pestaña del navegador, pero al ser la petición mediante un POST no ocurrirá esto.

La consola de desarrollo de Google Chrome sirve para mucho más que para revisar estatus de variables, debugging, y ver estados de las peticiones (generalmente 500, 404 y/o 200) si no que tambien podemos ver el estado perfectamente como si copiamos la URL de la petición en el navegador pero sin la necesidad de hacerlo; para esto abrimos nuestra consola de desarrolladores con F12:

Por defecto, al abrir la consola estamos sobre la opción "Console", damos un clic sobre la pestaña "Netwotk y veremos listados de todas las peticiones realizadas:

Buscamos el recurso que nos ocasionó el error 500:

Y damos un clic sobre el recurso que nos arroja el error 500:

Cómo podemos darnos cuenta, podemos ver el error 500 como si la petición se hubiera realizado en la pestaña en donde se está ejecutando la aplicación a través del hilo principal de la aplicación; de esta forma detectar fácilmente el error sin necesidad de emplear otras herramientas o colocar impresiones innecesarias.