Javascript / Chrome - Como copiar um objeto do inspetor da webkit como código

493

Estou fazendo uma instrução console.log no meu javascript para registrar um objeto javascript. Gostaria de saber se existe uma maneira, uma vez feito isso - copiar esse objeto como código javascript. O que estou tentando fazer é converter um objeto que foi criado usando o ajax para analisar um feed xml em um objeto javascript estático para que um arquivo possa ser executado localmente, sem um servidor. Incluí uma captura de tela do objeto na janela do inspetor chrome para que você possa ver o que estou tentando fazer.insira a descrição da imagem aqui

mheavers
fonte
1
Tente usar o firefox e a opção .toSource (). É mais fácil
chepe263

Respostas:

1249
  1. Clique com o botão direito do mouse em um objeto no console do Chrome e selecione Store as Global Variableno menu de contexto. Ele retornará algo como temp1o nome da variável.

  2. O Chrome também possui um copy()método, portanto, copy(temp1)no console, copie esse objeto para sua área de transferência.

Copiar objeto Javascript no Chrome DevTools

Nota sobre objetos recursivos: Se você estiver tentando copiar um objeto recursivo, receberá [object Object]. A saída é copy(JSON.stringify(temp1)): o objeto será totalmente copiado para sua área de transferência como um JSON válido, para que você possa formatá-lo como desejar, usando um dos muitos recursos.

kevnk
fonte
3
retornar indefinido no chrome Versão 49.0.2623.87 (64 bits)? porque>?
precisa saber é o seguinte
10
@PardeepJain - isso é esperado do método copy () porque não há nada para retornar. Os dados devem estar na sua área de transferência.
Carl
35
Isso só [object Object]me dá .
Ullallulloo
1
@Ullallulloo tente sair com JSON.stringify assim: stackoverflow.com/a/4293047/622287
kevnk
3
ele só funciona se você tiver um JS objeto rasa, se você tem objeto profundamente recursiva então você vai ter [Object Object] - que se espera
Marwen Trabelsi
62

Tente JSON.stringify(). Copie a sequência resultante. Não funciona com objetos que contêm referências circulares.

Salman A
fonte
7
Não vejo como isso funcionaria, a menos que você modifique o código que o registra.
IConnor
16
Eu receboTypeError: Converting circular structure to JSON
Tony Brasunas
40

Você pode copiar um objeto para sua área de transferência usando copy (JSON.stringify (Object_Name)); no console.

Por exemplo: - Copie e cole o código abaixo no seu console e pressione ENTER. Agora, tente colar (CTRL + V para Windows ou CMD + V para mac) em algum outro lugar e você obterá {"name": "Daniel", "age": 25}

var profile = {
    name: "Daniel",
    age: 25
};

copy(JSON.stringify(profile));
Sudharshan
fonte
14
Não funciona com nós DOM, janelas ou qualquer outro objeto circular
Carles Alcolea
De longe, a solução mais fácil para um objeto grande, mas simples.
Hersheezy 18/01/19
solução mais fácil
Anandhukrishna VR 15/05/19
26

Agora você pode fazer isso no Chrome clicando com o botão direito do mouse no objeto e selecionando "Armazenar como variável global": http://www.youtube.com/watch?v=qALFiTlVWdg

insira a descrição da imagem aqui

David Calhoun
fonte
2
Na versão 39.0.2171.95, a opção "Armazenar como variável global" não está disponível ao inspecionar dispositivos Android com o Chrome.
Walter Roman
1
@ David Calhoun, votei na sua resposta. Parece que sua resposta foi postada em 12 de junho de 2014 e a aceita em 5 de agosto de 2014, levando em grande parte exatamente o que você tinha. Devo admitir que ele menciona o temp1, onde sua resposta só aparece no seu vídeo, talvez seja por isso que a outra resposta foi aceita. Muitas felicidades.
PatS
13

Siga os seguintes passos:

  1. Produza o objeto com console.log a partir do seu código, assim: console.log (myObject)
  2. Clique com o botão direito do mouse no objeto e clique em "Armazenar como Objeto Global". O Chrome imprimiria o nome da variável neste momento. Vamos assumir que é chamado "temp1".
  3. No console, digite: JSON.stringify(temp1).
  4. Nesse ponto, você verá o objeto JSON inteiro como uma sequência que você pode copiar / colar.
  5. Você pode usar ferramentas on-line como http://www.jsoneditoronline.org/ para pretender sua string neste momento.
sufinawaz
fonte
A etapa com JSON.stringify (temp1) pode afetar muito a execução se o objeto for grande.
heroína
@JoeTidee Eu tive o mesmo problema, mas configurei uma debuggerdeclaração e recuperei meu var diretamente do console no ponto de interrupção.
Tony Brasunas
11

Se você enviou o objeto por uma solicitação, pode copiá-lo na guia Chrome -> Rede.

Solicitar carga útil -> Exibir fonte

insira a descrição da imagem aqui

insira a descrição da imagem aqui

Christopher Marshall
fonte
2
Após copiar a carga útil analisada, você pode formatar o json em jsonformatter.curiousconcept.com .
Muhammad Hassan
0

O uso de "Armazenar como variável global" funciona, mas ele apenas obtém a instância final do objeto, e não o momento em que o objeto está sendo registrado (já que você provavelmente deseja comparar as alterações no objeto à medida que elas acontecem). Para obter o objeto no momento exato de sua modificação, eu uso este ...

function logObject(object) {
    console.info(JSON.stringify(object).replace(/,/g, ",\n"));
}

Chame assim ...

logObject(puzzle);

Convém remover a regex .replace (/./ g, ", \ n") se houver dados de vírgula.

HoldOffHunger
fonte
0

Assim,. Eu tive esse problema. exceto que eu tenho [objeto objeto]

Tenho certeza que você poderia fazer isso com recursão, mas funcionou para mim:

Aqui está o que eu fiz no meu console:

var object_that_is_not_shallow = $("all_obects_with_this_class_name");
var str = '';
object_that_is_not_shallow.map(function(_,e){
    str += $(e).html();
});
copy(str);

Em seguida, cole no seu editor.

twalow
fonte
0

Isso deve ajudar a restringir objetos profundos, deixando de fora objetos recursivos Windowe Node.

function stringifyObject(e) {
  const obj = {};
  for (let k in e) {
    obj[k] = e[k];
  }

  return JSON.stringify(obj, (k, v) => {
    if (v instanceof Node) return 'Node';
    if (v instanceof Window) return 'Window';
    return v;
  }, ' ');
}
dummker
fonte
0

Clique com o botão direito do mouse nos dados que deseja armazenar

  • Em primeiro lugar, clique com o botão direito do mouse nos dados que deseja armazenar -> selecione "Armazenar como variável global". E a nova variável temp aparecerá como abaixo: (variável temp3): a nova variável temp aparecerá no console
  • Segundo comando use copy (temp_variable_name) como imagem: insira a descrição da imagem aqui Depois disso, você pode colar os dados em qualquer lugar que desejar. espero que seja útil /
Neo_
fonte
0

Adicione isso ao seu console e execute

copy(JSON.stringify(foo));

Isso copia seu JSON para a área de transferência

user3294854
fonte