2009-11-30 15 views
186

En Firefox, uso Firebug que me permite ver todas las solicitudes de http que hacen mis llamadas ajax. Cambié mi desarrollo a Chrome y me gusta hasta ahora. Mi única queja, sin embargo, es que las herramientas de desarrollador no parecen permitirle ver cada solicitud de Ajax. Tuve una vez que el panel de Recursos mostró varias solicitudes al mismo recurso, pero solo lo hizo una vez y nunca más.Monitoreo de solicitudes en Chrome

¿Hay alguna forma de ver de forma confiable todas las solicitudes http que realiza una página mediante javascript desde Chrome?

[Editar: 11/30/09 11:55]

la actualidad, para evitar esto, estoy corriendo violinista junto a Chrome para ver mis peticiones, pero si hay una manera de hacerlo desde dentro el navegador, preferiría eso.

+2

Tengo el mismo problema: he intentado todas las soluciones aquí. No aparece nada en la parte de respuesta de la ventana XHR en las herramientas de desarrollo. Simplemente muestra "Esta solicitud no tiene datos de respuesta disponibles". Si ejecuto el mismo código usando Firebug, aparece bien. en la configuración de las herramientas cog dev, he intentado marcar "Log XMLHttpRequest", pero esto no me ayudó (el tipo de respuesta es application/json). Tengo que hacer todas las depuraciones en firebug. Firebug también formatea el JSON muy bien, las herramientas de desarrollo de Chrome no lo hacen si puede lograr que muestre la respuesta (por ejemplo, al no usar ajax). –

Respuesta

320

Sé que esto es un hilo viejo, pero pensé que iba a meter su cuchara.

Chrome actualmente tiene una solución integrada.

  1. Uso CTRL+SHIFT+I (o navegar a Current Page Control > Developer > Developer Tools. En las versiones más recientes de Chrome, haga clic en el ícono de Llave inglesa> Herramientas> Herramientas del desarrollador) para habilitar las Herramientas del desarrollador.
  2. Desde las herramientas para desarrolladores, haga clic en el botón Network. Si aún no lo está, habilítelo para la sesión o siempre.
  3. Haga clic en el botón "XHR".
  4. Iniciar un AJAX call.
  5. Verá que los artículos comienzan a aparecer en la columna de la izquierda debajo de "Resources".
  6. Haga clic en el recurso y hay 2 pestañas que muestran los encabezados y el contenido devuelto.
+1

Gracias Phil! Había dejado esto de lado y confiaba principalmente en Fiddler. Pero ese botón XHR es lo que estaba buscando: D –

+0

ayer mismo estaba hablando que si las herramientas de Chrome pudieran hacer esto sería perfecto, gracias. – GerManson

+0

En caso de que alguien más haga esto: hice clic en la columna "Nombre" para ordenarlo antes y luego lo olvidé; luego, algunas solicitudes nuevas saltan al centro de la lista debido a la ordenación alfabética. Tuve que actualizar la página para desestresarte. –

4

Puede usar Fiddler que es una buena herramienta gratuita.

+1

Sí, tengo Fiddler, que es lo que estoy usando para hacer esto. Solo estoy buscando una forma de hacerlo desde el navegador, ya que es un poco más conveniente. –

+0

Ahh bien no puedo ayudar con eso, lamento mucha suerte – JoshBerke

52

La respuesta más actualizada a esto es: se enumeran bajo el botón "Red" en las herramientas de desarrollador, ya no en "Recursos" como solía ser.

+4

De hecho, es donde está ahora, me llevó buscando desbordamiento de pila para encontrarlo después de la actualización. – Kzqai

12

no saben partir de qué versión de cromo esto está disponible, pero he encontrado un entorno 'Consola - log XMLHttpRequests' (haciendo clic sobre el icono en la esquina inferior derecha de herramientas para desarrolladores de Chrome en Mac)

+2

Esta es la forma más fácil y la mejor manera de controlar las solicitudes de XHR. – CourtDemone

34

También puede utilizar este enlace en Chrome para obtener información más detallada que el inspector lo hizo.

chrome://net-internals/#events 

Esto muestra el registro de todas las solicitudes del navegador mientras abiertas

+0

¿Podrías exportar eso? – Pacerier

3

Gracias toda persona que tratan de ayudar en este post

tengo Ubuntu 13.10 y mi versión de Chrome es 34.0

Para mi situación esto funciona

1.open developer tools in chrome(or use right click on your page and then select inspect element) 
2.go to "Network" tab 
3.find your ajax request in "Name Path" column 
4.click on the specific ajax link 

ahora debería ver un nuevo panel frente a usted solicita

in this panel select "Response" tab 
1

En el paso 5 de Phil, "Recursos" ya no está disponible en la nueva versión de Chrome. Debe hacer clic en el ícono de página justo al lado de la página Ajax listada en el panel inferior con las columnas de Nombre, Método, Estado, ...

Luego le mostrará más paneles donde encontrará los mensajes de error.

4

Abra sus DevTools y presione F1 para acceder a la configuración. Busque la sección de la consola y marque la casilla de verificación "Log XMLHttpRequests".

Ahora todos sus ajax y otras solicitudes similares se registrarán en la consola.

Prefiero este método porque generalmente me permite ver todo lo que estoy buscando en la consola sin tener que ir a la pestaña de red.