Referencia de características de red

Este artículo es un inventario basado en características de la herramienta Red . Use la herramienta Red para inspeccionar la actividad de red de una página web. Para ver un tutorial paso a paso e introducción a la herramienta Red , consulte Inspección de la actividad de red.

Contenido detallado:

Registro de solicitudes de red

De forma predeterminada, DevTools registra todas las solicitudes de red en la herramienta Red , siempre y cuando DevTools esté abierto.

Panel Red

Detener la grabación de solicitudes de red

Para detener la grabación de solicitudes:

  1. En la herramienta Red , haga clic en Detener grabación del registro de red (Detener registro de red de grabación). Se vuelve gris para indicar que DevTools ya no está grabando solicitudes.

  2. Presione Ctrl+E (Windows, Linux) o Comando+E (macOS) mientras la herramienta Red está en el foco.

Borrar solicitudes

Para borrar todas las solicitudes de la tabla Solicitudes, en la herramienta Red , haga clic en el botón Borrar registro de red (Borrar):

Botón

O bien, presione Ctrl+L (Windows, Linux, macOS) o Comando+K (macOS) mientras la herramienta Red tiene el foco.

Guardar solicitudes entre cargas de página

Para guardar las solicitudes en las cargas de página, en la herramienta Red , active la casilla Conservar registro :

Casilla Conservar registro

DevTools guarda todas las solicitudes hasta que deshabilita Conservar registro.

Captura de pantalla de capturas de pantalla durante la carga de la página

Puede capturar capturas de pantalla para analizar lo que se muestra para los usuarios mientras espera a que se cargue la página.

Para habilitar capturas de pantalla:

  1. En DevTools, abra la herramienta Red .

  2. En la esquina superior derecha de la herramienta Red , haga clic en el icono Configuración de red (engranaje). Aparece una fila de casillas.

  3. Active la casilla Capturar capturas de pantalla :

    Habilitación de

Para capturar una captura de pantalla:

  1. Mientras la herramienta Red tiene el foco, presione Ctrl+F5 para actualizar la página. Las capturas de pantalla se capturan durante la carga de la página y las miniaturas se muestran debajo de la fila de casillas.

    Puede interactuar con las capturas de pantalla de la siguiente manera.

  2. Mantenga el puntero sobre una captura de pantalla para mostrar el punto en el que se capturó esa captura de pantalla. En el panel Gráfico de información general se muestra una línea vertical amarilla.

    Mantener el puntero en una captura de pantalla

  3. Haga clic en la miniatura de una captura de pantalla para filtrar las solicitudes que se produjeron después de capturar la captura de pantalla.

  4. Haga doble clic en una miniatura de captura de pantalla para acercar y ver la captura de pantalla.

  5. Presione Esc para cerrar el visor de captura de pantalla.

Cambiar el comportamiento de carga

Emular un visitante por primera vez deshabilitando la caché del explorador

Para emular cómo experimenta el sitio un usuario por primera vez, active la casilla Deshabilitar caché . DevTools deshabilita la caché del explorador. Esta característica emula con mayor precisión la experiencia de un usuario por primera vez, ya que las solicitudes se atienden desde la memoria caché del explorador en las visitas repetidas.

Casilla Deshabilitar caché :

Casilla Deshabilitar caché

Deshabilitación de la caché del explorador desde la herramienta Condiciones de red

Desde la herramienta Red , puede abrir la herramienta Condiciones de red en el panel Vista rápida y, a continuación, deshabilitar la caché del explorador desde allí:

  1. En la herramienta Red, haga clic en el botón Más condiciones de red (Más condiciones de red). La herramienta Condiciones de red se abre en el panel Vista rápida .

  2. En la herramienta Condiciones de red , active la casilla Deshabilitar caché :

    La herramienta Condiciones de red del panel Vista rápida, con la casilla

Vea también:

Borrar manualmente la memoria caché del explorador

Para borrar manualmente la caché del explorador en cualquier momento, haga clic con el botón derecho en cualquier lugar de la tabla Solicitudes y, a continuación, seleccione Borrar caché del explorador:

Comando

Emular sin conexión

Una clase de aplicaciones web, denominada Web Apps progresiva (PWA), puede funcionar sin conexión con la ayuda de los trabajadores del servicio. Es posible que le resulte útil simular rápidamente un dispositivo que no tiene conexión de datos al compilar este tipo de aplicación.

Para simular una experiencia de red sin conexión, seleccione el menú > desplegable Sin limitaciónValores preestablecidos>sin conexión.

Menú desplegable Sin conexión :

Menú desplegable Sin conexión

Emulación de conexiones de red lentas

Emula slow 3G, fast 3G y otras velocidades de conexión en el menú desplegable Sin limitación .

El menú desplegable Limitación :

Menú desplegable Limitación

Puede elegir entre diferentes valores preestablecidos, como Slow 3G o Fast 3G. Para agregar sus propios valores preestablecidos personalizados, abra el menú Limitación y seleccioneAgregarpersonalizado>.

DevTools muestra un icono de advertencia junto a la herramienta Red para recordarle que la limitación está habilitada.

Consulte también Simulación de una conexión de red más lenta en Inspeccionar actividad de red.

Emulación de conexiones de red lentas desde la herramienta Condiciones de red

Desde la herramienta Red , puede abrir la herramienta Condiciones de red en el panel Vista rápida y, a continuación, limitar la conexión de red desde allí:

  1. En la herramienta Red , haga clic en el botón Más condiciones de red (El icono . La herramienta Condiciones de red se abre en el panel Vista rápida .

  2. En la herramienta Condiciones de red , en el menú Limitación de red, seleccione una velocidad de conexión.

Vea también:

Borrar manualmente las cookies del explorador

Para borrar manualmente las cookies del explorador en cualquier momento, haga clic con el botón derecho en cualquier lugar de la tabla Solicitudes y, a continuación, seleccione Borrar cookies del explorador.

Comando

Invalidar el agente de usuario

Para invalidar manualmente el agente de usuario:

  1. En la herramienta Red, haga clic en el icono Más condiciones de red (Más condiciones de red). La herramienta Condiciones de red se abre en el panel Vista rápida .

  2. En la herramienta Condiciones de red , desactive la casilla Usar el valor predeterminado del explorador . Los demás controles están disponibles.

  3. Seleccione una opción de agente de usuario en el menú o escriba un agente de usuario personalizado en el cuadro de texto.

Establecimiento de sugerencias de cliente del agente de usuario

Si el sitio emplea sugerencias de cliente del agente de usuario y desea probarlas, puede establecerlas en la herramienta Condiciones de red o en Emular dispositivos móviles (Emulación de dispositivo).

Para establecer sugerencias de cliente del agente de usuario en la herramienta Condiciones de red :

  1. En la herramienta Red, haga clic en el botón Más condiciones de red (Más condiciones de red). La herramienta Condiciones de red se abre en el panel Vista rápida .

  2. En la sección Agente de usuario , desactive la casilla Usar el explorador predeterminado y, a continuación, expanda Sugerencias de cliente del agente de usuario:

    Configuración de sugerencias de cliente del agente de usuario

  3. En la lista desplegable Agente de usuario, seleccione un explorador y un dispositivo predefinidos. O bien, acepte el valor predeterminado de Custom...y escriba información en el cuadro de texto Escriba un agente de usuario personalizado .

  4. Para cualquiera de las opciones (predefinidas o personalizadas), especifique las sugerencias de cliente del agente de usuario como se indica a continuación:

    • Marca y versión como Edge y 92. Para agregar varios pares de marca/versión, haga clic en + Agregar marca.
    • Versión completa del explorador , como 92.0.1111.0.
    • Plataforma y versión como Windows y 10.0.
    • Arquitectura como x86.
    • Modelo de dispositivo como Galaxy Nexus.

    Puede establecer o cambiar cualquiera de las sugerencias de cliente del agente de usuario; no hay valores necesarios.

  5. Seleccione Actualizar.

  6. Para comprobar los cambios, haga clic en Consola y escriba navigator.userAgentData. Expanda los resultados según sea necesario para ver los cambios en los datos del agente de usuario.

Vea también:

Solicitudes de filtro

Puede filtrar las solicitudes por propiedades, por tipo o por tiempo, y puede ocultar direcciones URL de datos.

Filtrar solicitudes por propiedades

Use el cuadro de texto Filtrar para filtrar las solicitudes por propiedades, como el dominio o el tamaño de la solicitud.

Si no se muestra el cuadro de texto, es probable que el panel Filtros esté oculto. Para obtener más información, vea Ocultar el panel Filtros.

El cuadro de texto Filtrar :

Cuadro de texto Filtrar

Puede usar varias propiedades simultáneamente separando cada propiedad con un espacio. Por ejemplo, mime-type:image/png larger-than:1K muestra todos los PNG que tienen más de 1 kilobyte. Los filtros de varias propiedades son equivalentes a AND las operaciones. OR actualmente no se admiten las operaciones.

Lista completa de propiedades admitidas:

Propiedad Detalles
domain Solo muestra los recursos del dominio especificado. Puede usar un carácter comodín (*) para incluir varios dominios. Por ejemplo, *.com muestra los recursos de todos los nombres de dominio que terminan en .com. DevTools rellena el menú desplegable autocompletar con todos los dominios que se encuentran.
has-response-header Muestra los recursos que contienen el encabezado de respuesta HTTP especificado. DevTools rellena el menú desplegable autocompletar con todos los encabezados de respuesta que se encuentran.
is Use is:running para buscar WebSocket recursos.
larger-than Muestra recursos que son mayores que el tamaño especificado, en bytes. Establecer un valor de 1000 es equivalente a establecer un valor de 1k.
method Muestra los recursos recuperados a través de un tipo de método HTTP especificado. DevTools rellena el menú desplegable con todos los métodos HTTP que se encuentran.
mime-type Muestra los recursos de un tipo MIME especificado. DevTools rellena el menú desplegable con todos los tipos MIME que se encuentran.
mixed-content Mostrar todos los recursos de contenido mixto (mixed-content:all) o solo los que se muestran actualmente (mixed-content:displayed).
scheme Muestra los recursos recuperados a través de HTTP no protegido (scheme:http) o HTTPS protegido (scheme:https).
set-cookie-domain Muestra los recursos que tienen un Set-Cookie encabezado con un Domain atributo que coincide con el valor especificado. DevTools rellena el autocompletar con todos los dominios de cookies que se encuentran.
set-cookie-name Muestra los recursos que tienen un Set-Cookie encabezado con un nombre que coincide con el valor especificado. DevTools rellena el autocompletar con todos los nombres de cookies que se encuentran.
set-cookie-value Muestra los recursos que tienen un Set-Cookie encabezado con un valor que coincide con el valor especificado. DevTools rellena el autocompletar con todos los valores de cookie que se encuentran.
status-code Muestra los recursos que coinciden con el código de estado HTTP específico. DevTools rellena el menú desplegable autocompletar con todos los códigos de estado que se encuentran.

Filtrar solicitudes por tipo

Para filtrar las solicitudes por tipo de solicitud, haga clic en los botones del panel Red :

  • XHR
  • JS
  • CSS
  • Img
  • Media
  • Font
  • Doc
  • WS : WebSocket.
  • Manifiesto
  • Otro : cualquier otro tipo que no aparezca aquí.

Si los botones no aparecen, es posible que el panel Filtros esté oculto. Consulte Ocultar el panel Filtros.

Para habilitar varios filtros de tipo simultáneamente, mantenga presionada la tecla Ctrl (Windows, Linux) o Comando (macOS) y, a continuación, haga clic en los filtros.

Use los filtros de tipo para mostrar los recursos JS, CSS y Document:

Uso de los filtros de tipo para mostrar los recursos JS, CSS y Document

Filtrar solicitudes por tiempo

Haga clic y arrastre a la izquierda o a la derecha en el panel Información general para mostrar solo las solicitudes que estaban activas durante ese período de tiempo. El filtro es inclusivo. Se muestra cualquier solicitud que estuviera activa durante el tiempo resaltado.

Filtrar las solicitudes que estaban inactivas alrededor de 300 ms:

Filtrado de las solicitudes que estaban inactivas alrededor de 300 ms

Ocultar direcciones URL de datos

Las direcciones URL de datos son archivos pequeños insertados en otros documentos. Cualquier solicitud que se muestra en la tabla Solicitudes que comienza por data: es una dirección URL de datos.

Para ocultar las solicitudes, desactive la casilla Ocultar direcciones URL de datos :

Casilla Ocultar direcciones URL de datos

Ordenar solicitudes

De forma predeterminada, las solicitudes de la tabla Requests se ordenan por hora de inicio, pero puede ordenar la tabla mediante otros criterios.

Ordenar por columna

Haga clic en el encabezado de cualquier columna de la columna Solicitudes para ordenar las solicitudes por esa columna.

Ordenar por fase de actividad

Para cambiar la forma en que la cascada ordena las solicitudes:

  • Haga clic con el botón derecho en el encabezado de la tabla Solicitudes, haga clic en Cascaday, a continuación, seleccione una de las siguientes opciones:

    • Hora de inicio : la primera solicitud iniciada se coloca en la parte superior.

    • Tiempo de respuesta : la primera solicitud que comenzó a descargarse se coloca en la parte superior.

    • Hora de finalización : la primera solicitud que ha finalizado se coloca en la parte superior.

    • Duración total : la solicitud con la configuración de conexión más corta y la solicitud o respuesta se coloca en la parte superior.

    • Latencia : la solicitud que esperó el menor tiempo para obtener una respuesta se coloca en la parte superior.

En estas descripciones se supone que cada opción respectiva se clasifica entre la más corta y la más larga. Haga clic en el encabezado de la columna Cascada para invertir el orden.

A continuación se muestra cómo ordenar la cascada por duración total. La parte más ligera de cada barra es el tiempo de espera y la parte más oscura es el tiempo dedicado a descargar bytes:

Ordenación de la cascada por duración total

Analizar solicitudes

Siempre que DevTools esté abierto, registra todas las solicitudes en la herramienta Red . Use la herramienta Red para analizar las solicitudes.

Mostrar un registro de solicitudes

Use la tabla Requests (Solicitudes ) para mostrar un registro de todas las solicitudes realizadas mientras DevTools está abierto. Para mostrar más información sobre cada elemento, haga clic o mantenga el puntero sobre las solicitudes.

Tabla Solicitudes

La tabla Solicitudes muestra las siguientes columnas de forma predeterminada:

  • Nombre. Nombre de archivo del recurso o identificador del recurso.
  • Estado. El código de estado HTTP.
  • Escriba. Tipo MIME del recurso solicitado.
  • Iniciador. Los siguientes objetos o procesos pueden iniciar solicitudes:
    • Analizador. Analizador HTML.
    • Redireccionamiento. Redireccionamiento HTTP.
    • Script. Una función de JavaScript.
    • Otros. Algún otro proceso o acción, como navegar a una página a través de un vínculo o escribir una dirección URL en la barra de direcciones.
  • Tamaño. Tamaño combinado de los encabezados de respuesta más el cuerpo de la respuesta, tal como lo entrega el servidor.
  • Hora. La duración total, desde el inicio de la solicitud hasta la recepción del byte final en la respuesta.
  • Cumplido por. Si la caché HTTP o el trabajador del servicio de la aplicación han cumplido la solicitud.
  • Cascada. Un desglose visual de la actividad de cada solicitud.
Agregar o quitar columnas

Haga clic con el botón derecho en el encabezado de la tabla Solicitudes y seleccione un nombre de columna para ocultarlo o mostrarlo. Las columnas mostradas actualmente tienen marcas de verificación junto a ellas.

Adición de una columna a la tabla Requests

Agregar columnas para encabezados de respuesta

Para agregar una columna personalizada a la tabla Solicitudes, haga clic con el botón derecho en el encabezado de la tabla Solicitudes y, a continuación, seleccione Encabezados> de respuestaAdministrar columnas de encabezado. Se abre la ventana emergente Administrar columnas de encabezado . Haga clic en el botón Agregar encabezado personalizado , escriba el nombre del encabezado personalizado y, a continuación, haga clic en Agregar.

Adición de una columna personalizada a la tabla Requests

Mostrar la relación de tiempo de las solicitudes

Use la cascada para mostrar las relaciones de temporización de las solicitudes. La organización predeterminada de la cascada usa la hora de inicio de las solicitudes. Por lo tanto, las solicitudes que están más a la izquierda se iniciaron antes que las solicitudes que están más a la derecha.

Para ver las distintas formas en que puede ordenar la cascada, vaya a Ordenar por fase de actividad.

Columna Cascada del panel Solicitudes :

Columna Cascada del panel Solicitudes

Mostrar una vista previa de un cuerpo de respuesta

Para obtener una vista previa del contenido de un cuerpo de respuesta HTTP:

  1. En la tabla Solicitud, haga clic en el nombre de la solicitud.

  2. En la barra lateral, seleccione la pestaña Vista previa :

    Panel Vista previa

Mostrar un cuerpo de respuesta

Para mostrar el cuerpo de la respuesta a una solicitud:

  1. En la tabla Solicitud, haga clic en el nombre de la solicitud.

  2. En la barra lateral, seleccione la pestaña Respuesta :

    Panel Respuesta

Mostrar encabezados HTTP

Para mostrar los datos de encabezado HTTP sobre una solicitud:

  1. En la tabla Solicitud, haga clic en el nombre de la solicitud.

  2. En la barra lateral, seleccione la pestaña Encabezados :

    Panel Encabezados

Mostrar parámetros de cadena de consulta

Para mostrar los parámetros de cadena de consulta de una solicitud HTTP en un formato legible para personas:

  1. En la tabla Solicitud, haga clic en el nombre de la solicitud.
  2. En la barra lateral, seleccione la pestaña Carga:

Sección Parámetros de cadena de consulta

Para mostrar el origen de los parámetros de cadena de consulta en su lugar, haga clic en Ver origen.

Mostrar parámetros de cadena de consulta con codificación URL

Para mostrar los parámetros de cadena de consulta en un formato legible, pero con codificaciones conservadas:

  1. En la tabla Solicitud, haga clic en el nombre de la solicitud.
  2. En la barra lateral, seleccione la pestaña Carga útil .
  3. Haga clic en Ver con codificación URL.

Mostrar cookies

Para mostrar las cookies enviadas en el encabezado HTTP de una solicitud:

  1. En la tabla Solicitud, haga clic en el nombre de la solicitud.

  2. En la barra lateral, seleccione la pestaña Cookies :

    Panel Cookies

Mostrar el desglose de tiempo de una solicitud

Para mostrar el desglose de tiempo de una solicitud:

  1. En la tabla Solicitud, haga clic en el nombre de la solicitud.

  2. En la barra lateral, seleccione la pestaña Temporización .

    Panel Control de tiempo

Para obtener una forma más rápida de acceder a los datos, consulte Vista previa de un desglose de tiempo.

Para obtener más información sobre cada una de las fases que se pueden mostrar en el panel De tiempo , vea Fases de desglose de tiempos explicadas.

Vista previa de un desglose de tiempo

Para mostrar una vista previa del desglose de tiempo de una solicitud, en la columna Cascada de la tabla Solicitudes, mantenga el puntero sobre la entrada de la solicitud.

Vista previa del desglose de tiempo de una solicitud:

Vista previa del desglose de tiempo de una solicitud

Para ver los datos sin mantener el puntero, vea la parte superior de la sección presente , Mostrar el desglose de tiempo de una solicitud.

Fases de desglose de tiempos explicadas

Cada una de estas fases puede aparecer en la pestaña Temporización :

  • Puesta en cola. Las colas del explorador solicitan cuando se cumple alguna de las siguientes condiciones

    • Hay solicitudes de mayor prioridad.
    • Ya hay seis conexiones TCP abiertas para este origen, que es el límite. Solo se aplica a HTTP/1.0 y HTTP/1.1.
    • El explorador asigna brevemente espacio en la memoria caché del disco.
  • Estancado. La solicitud se podría detener por cualquiera de los motivos descritos en Queueing.

  • Búsqueda dns. El explorador está resolviendo la dirección IP de la solicitud.

  • Conexión inicial. El explorador está estableciendo una conexión, incluidos los protocolos de enlace TCP y los reintentos, y negociando una capa de sockets seguros (SSL).

  • Negociación de proxy. El explorador está negociando la solicitud con un servidor proxy.

  • Solicitud enviada. Se está enviando la solicitud.

  • Preparación de ServiceWorker. El explorador está iniciando el trabajo de servicio.

  • Solicitud a ServiceWorker. La solicitud se envía al trabajador del servicio.

  • Esperando (TTFB). El explorador espera el primer byte de una respuesta. TTFB significa Tiempo para el primer byte. Este tiempo incluye un recorrido de ida y vuelta de latencia y el tiempo que el servidor tardó en preparar la respuesta.

  • Descarga de contenido. El explorador recibe la respuesta.

  • Recibir inserción. El explorador recibe datos para esta respuesta a través de la inserción de servidor HTTP/2.

  • Lectura push. El explorador lee los datos locales que se recibieron anteriormente.

Mostrar iniciadores y dependencias

Para mostrar los iniciadores y dependencias de una solicitud, mantenga presionada la tecla Mayús y mantenga el puntero sobre la solicitud en la tabla Solicitudes .

  • Las solicitudes que iniciaron la solicitud con el puntero se muestran en verde.
  • Las dependencias de las solicitudes con el puntero se muestran en rojo.

Mostrar los iniciadores y dependencias de una solicitud

Cuando la tabla Requests se ordena cronológicamente, si mantiene el puntero sobre una línea, la línea anterior muestra una solicitud verde. La solicitud verde es el iniciador de la dependencia. Si se muestra otra solicitud verde en la línea anterior, esa solicitud superior es el iniciador del iniciador. Y así sucesivamente.

Mostrar eventos de carga

DevTools muestra el tiempo de los DOMContentLoaded eventos y load en varios lugares de la herramienta Red :

  • En el panel Información general con líneas verticales.
  • En la columna Cascada de la tabla Solicitud con líneas verticales.
  • En el panel Resumen , en la parte inferior de la herramienta Red , con etiquetas de tiempo.

El DOMContentLoaded evento está coloreado en azul y el load evento es rojo.

Ubicaciones de los eventos DOMContentLoaded y load en el panel Red

Mostrar el número total de solicitudes

El número total de solicitudes se muestra en el panel Resumen , en la parte inferior de la herramienta Red .

Número total de solicitudes desde que se abrieron DevTools

Precaución

Este número solo realiza un seguimiento de las solicitudes que se han registrado desde que se abrió DevTools. Si se produjeron otras solicitudes antes de abrir DevTools, esas solicitudes no se cuentan.

Mostrar el tamaño total de descarga

El tamaño total de descarga de las solicitudes se muestra en el panel Resumen , en la parte inferior de la herramienta Red .

Tamaño total de descarga de las solicitudes

Precaución

Este número solo realiza un seguimiento de las solicitudes que se han registrado desde que se abrió DevTools. Si se produjeron otras solicitudes antes de abrir DevTools, no se cuentan las solicitudes anteriores.

Para comprobar el tamaño de los recursos después de que el explorador descomprima cada elemento, vea Mostrar el tamaño sin comprimir de un recurso.

Mostrar el seguimiento de pila que produjo una solicitud

Después de que una instrucción de JavaScript solicite un recurso, mantenga el puntero sobre la columna Iniciador para mostrar el seguimiento de pila que conduce a la solicitud.

Seguimiento de pila que conduce a una solicitud de recurso

Mostrar el tamaño sin comprimir de un recurso

Para ver el tamaño transferido y el tamaño sin comprimir de un recurso al mismo tiempo:

  1. En la esquina superior derecha de la herramienta Red , haga clic en el icono Configuración de red (engranaje). Aparece una fila de casillas.

  2. Active la casilla Filas de solicitud grande .

  3. Examine la columna Tamaño de la tabla Solicitud. El valor superior es el tamaño transferido y el valor inferior es el tamaño del recurso después de que el explorador lo descomprima:

    Un ejemplo de recursos sin comprimir

Exportar datos de solicitudes

Guardar todas las solicitudes de red en un archivo HAR

Para guardar todas las solicitudes de red en un archivo HAR:

  1. En la tabla Solicitudes , haga clic con el botón derecho en una solicitud y, a continuación, seleccione Guardar todo como HAR con contenido.

    Seleccionar

  2. DevTools guarda todas las solicitudes que se han producido desde que abrió DevTools en el archivo HAR. No se pueden filtrar las solicitudes y no se puede guardar una sola solicitud.

Una vez guardado un archivo HAR, puede volver a importarlo en DevTools para su análisis arrastrando y colocando el archivo HAR en la tabla Solicitudes .

Copia de una o varias solicitudes en el Portapapeles

En la columna Nombre de la tabla Solicitudes, haga clic con el botón derecho en una solicitud, haga clic en Copiary, a continuación, seleccione una de las siguientes opciones:

Nombre Detalles
Copiar dirección de vínculo Copie la dirección URL de la solicitud en el Portapapeles.
Copiar respuesta Copie el cuerpo de la respuesta en el Portapapeles.
Copiar como captura  
Copiar como cURL Copie la solicitud como un comando cURL.
Copiar todo como captura  
Copiar todo como cURL Copie todas las solicitudes como una cadena de comandos cURL.
Copiar todo como HAR Copie todas las solicitudes como datos HAR.

Seleccionar

Copia de JSON de respuesta con formato en el Portapapeles

Para copiar los datos JSON con formato de una respuesta JSON:

  1. En la tabla Request (Solicitud), haga clic en el nombre de la solicitud que condujo a una respuesta JSON.

  2. En la barra lateral, seleccione la pestaña Vista previa .

  3. Haga clic con el botón derecho en la primera línea de la vista previa de la respuesta JSON con formato y, a continuación, seleccione Copiar valor.

    Comando copiar valor con el botón derecho

    Ahora puede pegar el valor en cualquier editor para revisarlo.

Copia de valores de propiedad de solicitudes de red al Portapapeles

Para copiar los valores de propiedad de las solicitudes de red al Portapapeles:

  1. En la tabla Solicitud, haga clic en el nombre de la solicitud.
  2. En la barra lateral, seleccione la pestaña Carga:
  3. Expanda una de las secciones siguientes.
    • Carga de solicitud (JSON)
    • Datos del formulario
    • Parámetros de cadena de consulta
    • Encabezados de solicitud
    • Encabezados de respuesta
  4. Haga clic con el botón derecho en un valor y, a continuación, seleccione Copiar valor. Ahora puede pegar el valor en cualquier editor para revisarlo.

Cambiar el diseño del panel Red

Puede expandir o contraer secciones de la interfaz de usuario de la herramienta de red para centrar información importante.

Ocultar el panel Filtros

De forma predeterminada, DevTools muestra el panel Filtros . Para ocultar el panel Filtros , seleccione Filtro (Filtro).

Botón Ocultar filtros

Filas de solicitudes grandes

Use filas de solicitudes grandes cuando desee más espacios en blanco en la tabla de solicitudes de red. Algunas columnas también proporcionan un poco más de información al usar filas grandes. Por ejemplo, el valor inferior de la columna Tamaño es el tamaño sin comprimir de una solicitud.

Para habilitar filas grandes, active la casilla Filas de solicitud grande. Ejemplo de filas de solicitudes grandes en el panel Solicitudes :

Ejemplo de filas de solicitudes grandes en el panel Solicitudes

Ocultar el panel Información general

De forma predeterminada, DevTools muestra el panel Información general . Para ocultar el panel Información general , desactive la casilla Mostrar información general .

Casilla Mostrar información general

Vea también

Nota:

Las partes de esta página son modificaciones basadas en el trabajo creado y compartido por Google y usadas según los términos descritos en la licencia internacional creative Commons Attribution 4.0. La página original se encuentra aquí y está creada por Kayce Basques (Technical Writer, Chrome DevTools & Lighthouse).

Licencia de Creative Commons Esta obra está licenciada bajo una Licencia Internacional Creative Commons Attribution 4.0.