Usa el panel Application para inspeccionar, modificar y depurar muchos aspectos de tu app web, incluidos su manifiesto, sus trabajadores de servicio, su almacenamiento y sus datos de caché.
Descripción general
El panel Application se divide en cuatro secciones que contienen submenús. A continuación, se incluyen estas secciones y submenús:
Aplicación: Contiene información general sobre la app, incluido su manifiesto, sus trabajadores de servicio y su almacenamiento.
- La pestaña Manifiesto presenta información de
manifest.jsonde una manera fácil de usar. También muestra errores y advertencias, si los hay, en la sección correspondiente. - La pestaña Trabajadores en primer plano te permite inspeccionar y depurar trabajadores en primer plano mediante la emulación de eventos push, la actualización de un servicio y mucho más.
- La pestaña Almacenamiento contiene un gráfico circular que muestra la distribución de la memoria que usan el almacenamiento en caché, IndexedDB y los trabajadores del servicio. También puedes borrar los datos del sitio y simular una cuota de almacenamiento personalizada.
Almacenamiento: Consulta y edita los diferentes métodos de almacenamiento que usa una app web.
- Las listas Local y Almacenamiento de sesiones te permiten seleccionar un origen y editar los pares clave-valor de los métodos de almacenamiento asociados.
- La lista IndexedDB contiene bases de datos y te permite inspeccionar almacenes de objetos desde el navegador.
- La lista Cookies te permite seleccionar un origen y editar los pares clave-valor.
- Los tokens de estado privado y los grupos de interés te permiten inspeccionar los tokens y los grupos correspondientes, si los hay.
- La lista Almacenamiento compartido te permite seleccionar un origen y, luego, inspeccionar y editar los pares clave-valor asociados.
- La lista Almacenamiento en caché contiene las cachés disponibles y te permite inspeccionar, filtrar y borrar sus recursos.
Servicios en segundo plano: Inspecciona, prueba y depura servicios en segundo plano.
- La pestaña Memoria caché atrás/adelante te permite ejecutar pruebas en la memoria caché atrás/adelante en el navegador. También informa problemas que pueden impedir la memoria caché de atrás/adelante.
- La pestaña Obtención en segundo plano te permite registrar la actividad de la API de Background Fetch durante un máximo de tres días.
- La pestaña Background sync te permite registrar la actividad de la API de Background Sync durante un máximo de tres días.
- La pestaña Mitigaciones del seguimiento por rebote te permite identificar y borrar el estado de los sitios que parecen realizar un seguimiento entre sitios con la técnica de seguimiento por rebote.
- La pestaña Notificaciones te permite registrar mensajes push durante un máximo de tres días.
- La pestaña Controlador de pagos te permite registrar eventos del controlador de pagos durante un máximo de tres días.
- La pestaña Sincronización periódica en segundo plano te permite registrar eventos clave durante un máximo de tres días en el ciclo de vida de la sincronización periódica en segundo plano, como registrarse para la sincronización, realizar una sincronización en segundo plano y anular el registro.
- La pestaña Cargas especulativas te permite depurar las cargas especulativas. Muestra el estado especulativo, los conjuntos de reglas y los intentos de carga especulativa.
- La pestaña Mensajes push te permite registrar y grabar mensajes push durante hasta tres días.
- La pestaña API de informes supervisa tu sitio y, además, informa las llamadas a la API obsoletas y los incumplimientos de seguridad.
Frames: Divide las páginas y los recursos en varias vistas y muestra información relevante, como Seguridad y aislamiento, Política de seguridad del contenido, Disponibilidad de la API y mucho más.
Abre el panel de la aplicación
Para abrir el panel Application, haz lo siguiente:
- Abre las Herramientas para desarrolladores.
- Para abrir el menú de comandos, presiona lo siguiente:
- macOS: Comando+Mayúsculas+P
- Windows, Linux y ChromeOS: Control + Mayúsculas + P
- Comienza a escribir
application, selecciona Show Application y presiona Intro. DevTools muestra el panel Application en la parte superior de la ventana de DevTools.
Como alternativa, puedes abrir el panel Application de las siguientes maneras:
- En la barra de acción de la parte superior, haz clic en Más paneles y selecciona Aplicación en la lista desplegable.
- En la esquina superior derecha, selecciona Más opciones > Más herramientas > Aplicación.