From 1109132f09d75da9a28b649c7677bb6ce07c40c0 Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Tue, 8 Dec 2020 14:41:45 -0500 Subject: initial commit --- .../tools/web_console/console_messages/index.html | 391 +++++++++++++++++++++ 1 file changed, 391 insertions(+) create mode 100644 files/es/tools/web_console/console_messages/index.html (limited to 'files/es/tools/web_console/console_messages/index.html') diff --git a/files/es/tools/web_console/console_messages/index.html b/files/es/tools/web_console/console_messages/index.html new file mode 100644 index 0000000000..102a69d2ef --- /dev/null +++ b/files/es/tools/web_console/console_messages/index.html @@ -0,0 +1,391 @@ +--- +title: Consola de mensajes +slug: Tools/Web_Console/Console_messages +tags: + - Consola + - Herramientas + - Herramientas de desarrollo +translation_of: Tools/Web_Console/Console_messages +--- +

La mayor parte de la Consola Web está ocupada por el panel de visualización de mensaje:

+ +

+ +

Cada mensaje se muestra como una fila separada

+ +

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + +
TiempoLa hora a la que se registró el mensaje. Esto no se muestra por defecto: Usted puede ver el tiempo marcado usando una configuracion en la barra de herramientas
Categoria +

Categoria: Esta indicacion nos revela de que trata el mensaje:

+ +
    +
  • Negro: Solicitud de red
    • +
  • Azul: CSS advertencia/error/registro
    • +
  • Naranja: JavaScript advertencia/error
    • +
  • Rojo: Advertencia de seguridad/error
    • +
  • Verde: Registro de servidor
    • +
  • Gris claro: Consola API mensajes
    • +
  • Gris oscuro: de entrada/salida desde el intérprete de línea de Comando
    • +
+
TipoPara todos los mensajes excepto solicitud de red y entrada interectiva/salida de un icono de un error(X), una advertencia(!) o un mensaje informativo de registro (i).
MensajeEl cuerpo del mensaje.
Número de aparicionesSi una línea que genera una advertencia o error que ha sido ejecutado por mas de una vez, sólo se registra una vez y este contador parece indicar cuántas veces se encontró.
Nombre y número de línea +

Para JavaScript, CSS y los mensajes de consola de la API el mensaje se puede rastrear a una línea de código específica. La consola proporciona un enlace con el nombre del archivo y el número de línea que generó el mensaje.

+ +

A partir de Firefox 36, esto incluye también el número de columna.

+
+ +

De forma predeterminada, la consola se borra cada vez que navega a una nueva página o vuevle a cargar la página actual. Para cambiar este comportamiento, comprueba "Activar registros persistentes" en la  Configuración.

+ +

Categorías de los mensajes

+ +

Red

+ +
+

Los mensajes de registro de la red no se muestran por defecto. Utiliza la función de filtrar para mostrarlos

+
+ +

Las solicitudes de red están conectadas con una línea que tiene este aspecto:

+ +

+ + + + + + + + + + + + + + + + + + + + + + + + +
TimeLa hora a la que se registró el mensaje.
CategoryIndica que el mensaje es una solicitud HTTP.
Method +

El método específico de la petición HTTP.

+ +

Si la petición se hizo como una XMLHttpRequest, hay una nota adicional que indica ésto:

+ +

+
URIEl URI de destino.
SummaryLa versión de HTTP, código de estado, y el tiempo que tarda en completarse.
+ +

Revisando los detalles de la petición de red

+ +

Si hace clic en el mensaje, se le redirige al Panel de Red donde se selecciona la petición y más detalles de la petición y la respuesta se muestran en el panel lateral en el lado derecho.

+ +

Puedes acceder a este detalla en linea, sin dejar la Consola Web. Las entradas de peticiones de red obtienen una flecha a su lado. Clícala par ver:

+ +

Encabezados: encabezados de petición y respuesta.

+ +

Respuesta: el cuerpo de la respuesta

+ +

Cookies: cualquier cookie que fuera enviada junto con la solicitud.

+ +

JS

+ +

Los mensajes de JavaScript tienen el siguiente aspecto:

+ +

+ +

CSS

+ +
+

CSS warnings and reflow messages are not shown by default. Use the filtering feature to show them.

+
+ +

Los mensajes CSS tienen el siguiente aspecto:

+ +

+ +

Eventos de reflujo (Reflow events)

+ +

La consola Web también registra los eventos de reflujo en la categoría de CSS. Un reflujo es el nombre que se da a la operación en la que el navegador calcula la distribución de la totalidad o parte de la página. Los reflujos se producen cuando ocurre un cambio en una página y el navegador cree que afecta al diseño. Muchos eventos pueden desencadenar reflujos,  incluso: cambiar el tamaño de la ventana del navegador, activar las pseudoclases como: hover, o manipular el DOM en JavaScript.

+ +

Debido a que los reflujos pueden ser computacionalmente costosos y afectar directamente a la interfaz de usuario, pueden tener un gran impacto en la capacidad de respuesta de un sitio web o aplicación web. Mediante el registro de eventos de reflujo la consola Web le puede dar una idea de cuando se activan los eventos de reflujo, el tiempo que tardan en ejecutarse y, si los reflujos son reflujos sínronos activados desde JavaScript, cuyo código les dispara..

+ +

Los eventos de reflujo se registran como mensajes "Reflow", a diferencia de los errores CSS o advertencias. De forma predeterminada, están deshabilitados. Puede activarlos haciendo clic en el botón "CSS" en la barra de herramientasr y seleccionar "Reflows".

+ +

Cada mensaje está marcado como "reflujo" y muestra el tiempo necesario para ejecutarse:

+ +

Si el reflujo es un reflujo síncrono accionado desde JavaScript, también muestra un enlace a la línea de código que lo provocó:

+ +

Haga clic en el enlace para abrir el archivo en el Debugger.

+ +

Reflujos síncronos y asíncronos

+ +

Si se hace un cambio que invalida el diseño actual  - por ejemplo, la ventana del navegador cambia de tamaño o desdea JavaScript se modifica el CSS de un elemento - el diseño no se vuelve a calcular inmediatamente. En cambio, el reflujo ocurre de forma asíncrona, la próxima vez que el navegador decide que hay que hacer (en general, la próxima vez que el navegador vuelve a pintar). De esta manera, el navegador puede ahorrar un conjunto de cambios que invalidan y recalcular su efecto a la vez.

+ +

Sin embargo, si algún código JavaScript lee un estilo que se ha modificado, a continuación, el navegador debe realizar una reflujo sincrónico con el fin de calcular el estilo computarizado a devolver. Por ejemplo, un código como éste provocará de inmediato un reflujo síncrono cuando se llame a window.getComputedStyle(thing).height:

+ +
var thing = document.getElementById("the-thing");
+thing.style.display = "inline-block";
+var thingHeight = window.getComputedStyle(thing).height;
+ +
+
+
Debido a esto, es una buena idea para evitar la interpolación de la escritura y leer llamadas a los estilos de un elemento al manipular el árbol DOM, porque cada vez que vuelve a leer un estilo que ha sido invalidado por una llamada de escritura anterior, se fuerza un reflujo síncrono.
+ +
+
+
+ +

Security

+ +

Security warnings and errors look like this:

+ +

The security messages shown in the Web Console help developers find potential or actual vulnerabilities in their sites. Additionally, many of these messages help educate developers because they end with a “Learn More” link that takes you to a page with background information and advice for mitigating the issue.

+ +

The complete list of security messages is as follows:

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
MessageDetails
Blocked loading mixed active contentThe page contained mixed active content: that is, the main page was served over HTTPS, but asked the browser to load "active content", such as scripts, over HTTP. The browser blocked this active content. See Mixed Content for more details.
Blocked loading mixed display contentThe page contained mixed display content: that is, the main page was served over HTTPS, but asked the browser to load "display content", such as images, over HTTP. The browser blocked this display content. See Mixed Content for more details.
Loading mixed (insecure) active content on a secure pageThe page contained mixed active content: that is, the main page was served over HTTPS, but asked the browser to load "active content", such as scripts, over HTTP. The browser loaded this active content. See Mixed Content for more details.
Loading mixed (insecure) display content on a secure pageThe page contained mixed display content: that is, the main page was served over HTTPS, but asked the browser to load "display content", such as images, over HTTP. The browser loaded this display content. See Mixed Content for more details.
This site specified both an X-Content-Security-Policy/Report-Only header and a Content-Security-Policy/Report-Only header. The X-Content-Security-Policy/Report-Only header(s) will be ignored.See Content Security Policy for more details.
The X-Content-Security-Policy and X-Content-Security-Report-Only headers will be deprecated in the future. Please use the Content-Security-Policy and Content-Security-Report-Only headers with CSP spec compliant syntax instead.See Content Security Policy for more details.
Password fields present on an insecure (http://) page. This is a security risk that allows user login credentials to be stolen.Pages containing login forms must be served over HTTPS, not HTTP.
Password fields present in a form with an insecure (http://) form action. This is a security risk that allows user login credentials to be stolen.Forms containing password fields must submit them over HTTPS, not HTTP.
Password fields present on an insecure (http://) iframe. This is a security risk that allows user login credentials to be stolen.iframes containing login forms must be served over HTTPS, not HTTP.
The site specified an invalid Strict-Transport-Security header.See HTTP Strict Transport Security for more details.
+

This site makes use of a SHA-1 Certificate; it's recommended you use certificates with signature algorithms that use hash functions stronger than SHA-1.

+ 		+

The site uses a certificate whose signature uses the SHA-1 hash algorithm.

+ +

SHA-1 is still still widely used in certificates, but it is starting to show its age. Web sites and Certification Authorities are encouraged to switch to stronger hash algorithms in future. See the Weak Signature Algorithm article for more details.

+ +

Note that the SHA-1 certificate may not be your site's own certificate, but may be the certificate belonging to a Certification Authority that was used to sign your site's certificate.

+
+ +

Bug 863874 is the meta-bug for logging relevant security messages to the Web Console. If you have more ideas for useful features like the ones discussed here, or are interested in contributing, check out the metabug and its dependencies.

+ +

Logging

+ +
+

Messages logged from Shared Workers, Service Workers, add-ons, and Chrome Workers are not shown by default. Use the filtering feature to show them.

+
+ +

The Logging category includes messages logged using the Console API.
+

+ +

The Web console supports the following Console messages:

+ + + +

The console prints a stack trace for all error messages, like this:

+ +
function foo() {
+  console.error("it explodes");
+}
+
+function bar() {
+  foo();
+}
+
+function doStuff() {
+ bar();
+}
+
+doStuff();
+ +

+ +

Server

+ +
+

New in Firefox 43

+
+ +
+

Server-side log messages are not shown by default. Use the filtering feature to show them.

+
+ +

From Firefox 43, the Web Console can display messages sent from the server. This enables you to use the Web Console to debug server-side code.

+ +

It uses the Chrome Logger protocol. Briefly, the way it works is:

+ + + +

To find a suitable library for your server code, see the Chrome Logger documentation.

+ +

Command line input/output

+ +

Commands sent to the browser using the Web Console's command line, and the corresponding responses, are logged using lines like this:

+ +

The dark gray bar indicates that these are input/output messages, while the direction of the arrow discriminates between input and output.

+ +

Filtro y búsqueda

+ +

Filtrando por categoría

+ +

You can use the toolbar along the top to constrain the results displayed.

+ +

To see only messages of particular categories, click the button labeled with that category ("Net", "CSS", and so on). Clicking the main part of the button toggles that category on or off, while clicking the arrow on the right gives you more fine-grained filter options within that category:

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
CategoryOptions
NetErrors
+ Warnings
+ XHR
+ Log
CSSErrors
+ Warnings
+ Reflows
JSErrors
+ Warnings
SecurityErrors
+ Warnings
LoggingErrors
+ Warnings
+ Info
+ Log
+ Shared Worker
+ Service Workers
+ Add-on or Chrome Workers
ServerErrors
+ Warnings
+ Info
+ Log
+ +

Filtering by text

+ +

To see only messages that contain a specific string, type in the text box labeled "Filter output".

+ +

Clearing the log

+ +

Finally, you can use this toolbar to clear the log.

-- cgit v1.2.3-54-g00ecf