¿Cómo guardar la salida de un console.log (objeto) en un archivo?

240

Intenté usarlo JSON.stringify(object), pero no se reduce en toda la estructura y jerarquía.

Por otro lado console.log(object)hace eso pero no puedo guardarlo.

En el console.logresultado, puedo expandir uno por uno todos los elementos secundarios y seleccionar y copiar / pegar, pero la estructura es demasiado grande para eso.

Eduard Florinescu
fuente
¿Está tratando de guardar el archivo console.log del navegador para fines de desarrollo? Podría ayudar si explicase cuál es su objetivo final.
travis
1
@MichaelS No encontré el objeto en el archivo de registro.
Eduard Florinescu
@travis Quiero exportar un objeto a JSON, pero toda la jerarquía, también sus propiedades y las propiedades de sus propiedades. Quiero prácticamente obtener la "interfaz" de un objeto, excepto la implementación de las funciones.
Eduard Florinescu
2
@MichaelS, esas preguntas son sobre guardar todo el registro, esta pregunta es sobre guardar un solo objeto. Son distintos desde mi punto de vista.
James McMahon

Respuestas:

307

Actualización: ahora puedes hacer clic derecho

Haga clic derecho> Guardar como en el panel Consola para guardar los mensajes registrados en un archivo.

Respuesta original

Puede usar este fragmento de devtools que se muestra a continuación para crear un método console.save. Crea un FileBlob a partir de la entrada y luego lo descarga automáticamente.

(function(console){

console.save = function(data, filename){

    if(!data) {
        console.error('Console.save: No data')
        return;
    }

    if(!filename) filename = 'console.json'

    if(typeof data === "object"){
        data = JSON.stringify(data, undefined, 4)
    }

    var blob = new Blob([data], {type: 'text/json'}),
        e    = document.createEvent('MouseEvents'),
        a    = document.createElement('a')

    a.download = filename
    a.href = window.URL.createObjectURL(blob)
    a.dataset.downloadurl =  ['text/json', a.download, a.href].join(':')
    e.initMouseEvent('click', true, false, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null)
    a.dispatchEvent(e)
 }
})(console)

Fuente: http://bgrins.github.io/devtools-snippets/#console-save

Patricio
fuente
2
No soy de los que dicen "Gracias" en todas partes hasta que se bloquea la respuesta para evitar "gracias". Pero gracias. Voy a construir una extensión.
Léon Pelletier
14
La función Guardar como ... en realidad no ayudó. No guarda el objeto JSON completo (en mi caso, tenía una matriz de objetos, las propiedades de los objetos no se exportaron en el archivo de salida). Pero con suerte, el buen fragmento de devtool que pegaste funcionó a las mil maravillas. Gracias
M. Kejji
1
si guardar como no funcionó, entonces es una regresión. debe presentar un error en crbug.com
Patrick
1
@ ishandutta2007 no deberías descargar ningún fragmento, ahora está integrado en la consola.
Patrick
10
El clic derecho no realizará un guardado profundo del objeto.
user1032531
246

En caso de que tenga un objeto registrado:

  • Haga clic derecho sobre el objeto en la consola y haga clic Store as a global variable
  • la salida será algo así como temp1
  • escriba en la consola copy(temp1)
  • pegar en tu editor de texto favorito
artemdev
fuente
1
También descubrí que pegando esto en konklone.io/json , puede obtener rápidamente esto en un archivo CSV y de allí a Excel.
PeteW
99
Solo obtengo [objeto Objeto]
norbidrak
1
La consola dice "indefinido", pero eso no significa que haya fallado. Todavía lo copia al portapapeles :)
Dean
1
Impresionante solución. ¡Muchas gracias!
Ben Rondeau
1
¡Con mucho, la solución más simple y confiable!
Chris B.
130

Puede usar el comando de la API de Chrome DevTools Utilitiescopy() para copiar la representación de cadena del objeto especificado en el portapapeles.

Si tiene muchos objetos, entonces puede JSON.stringify () todos sus objetos y seguir agregándolos a una cadena. Ahora use el copy()método para copiar la cadena completa al portapapeles.

bthota
fuente
13
Uso: copia (objeto)
antoine
Nota: puede usar enrequire("util").format(...) lugar de aplicar JSON.stringify()uno por uno. El utilmódulo en NPM funciona tanto en Node.js como en navegadores web.
Константин Ван
2
Si escribe copy (object) y devuelve 'undefined', eso es realmente exitoso. El objeto ahora está en su portapapeles y se puede pegar.
Dean
7

Hay un complemento de JavaScript de código abierto que hace exactamente eso: debugout.js

Debugout.js registra y guarda console.logs para que su aplicación pueda acceder a ellos. Revelación completa, lo escribí. Formatea diferentes tipos de manera apropiada, puede manejar objetos anidados y matrices, y opcionalmente puede colocar una marca de tiempo al lado de cada registro. También alterna el registro en vivo en un solo lugar.

inorganik
fuente
Recibo un error.SyntaxError: export declarations may only appear at top level of a module --> debugout.js:9
Senura Dissanayake
@SenuraDissanayake intente ahora: tuve que revertir las relaciones públicas de alguien que no probé: /
inorganik
3

haga clic derecho en la consola ... haga clic en guardar como ... es así de simple ... obtendrá un archivo de texto de salida

Akhil_S
fuente
simplemente sin ninguna indicación de lo que es error vs menguante vs log.
Paulius Liekis
2

Hay otra herramienta de código abierto que le permite guardar todos los console.logresultados en un archivo en su servidor: JS LogFlush (plug!).

JS LogFlush es una solución integrada de registro de JavaScript que incluye:

  • reemplazo de la interfaz de usuario sin navegador cruzado de console.log - en el lado del cliente.
  • sistema de almacenamiento de registros: en el lado del servidor.

Manifestación

postrero
fuente
2

Esto es realmente tarde para la fiesta, pero tal vez ayude a alguien. Mi solución parece similar a lo que el OP describió como problemático, pero tal vez es una característica que Chrome ofrece ahora, pero no entonces. Intenté hacer clic derecho y guardar el archivo .log después de que el objeto fue escrito en la consola, pero todo lo que me dio fue un archivo de texto con esto:

console.js: 230 Hecho: Array (50000) [0… 9999] [10000… 19999] [20000… 29999] [30000… 39999] [40000… 49999] longitud: 50000__proto__: Array (0)

lo cual no le sirvió a nadie.

Lo que terminé haciendo fue encontrar el console.log(data)código, soltar un punto de interrupción y luego escribir JSON.Stringify(data)en la consola que mostraba todo el objeto como una cadena JSON y la consola de Chrome realmente le da un botón para copiarlo . Luego pegue en un editor de texto y ahí está su JSON

ingrese la descripción de la imagen aquí

Adam Hey
fuente
dice que al final el texto largo se truncó , si presiona Copiar, ¿copia todo el 20.6MB?
Eduard Florinescu
1
@EduardFlorinescu sí, todo
Adam Hey