Como vejo a fonte no navegador Android?

156

Existe uma maneira de visualizar o HTML de origem no navegador da Web Android?

browser html Vijay
fonte

Respostas:

69

Você pode usar o alertmétodo Javascript para retornar o código fonte, digite isto na barra de endereço:

javascript: alert(document.getElementsByTagName('html')[0].innerHTML);

Lie Ryan
fonte
3
inicialmente, eu tinha dúvidas de que o esquema javascript: URI funcionaria no navegador do Android, mas parecia funcionar no meu navegador 2.1. No entanto, você não recebe destaque de sintaxe e não pode copiar o texto, portanto, não é muito útil para páginas HTML longas.
Lie Ryan
1
Não funciona para mim! O emulador sempre adiciona o prefixo http: // e recebo um site não encontrado pelo Google.
1
O Chrome para Android mostra apenas cerca de 50 linhas.
Não funciona no Firefox para Android.
Aaron Franke
256

No Firefox ou Chrome no Android, é possível visualizar a fonte prefixando o URL na barra de endereços com " view-source:", ou seja, " view-source:http://google.com".

Ludder
fonte
4
Ótima solução. Ele até gera cores de sintaxe (pelo menos no Chrome) e permite copiar o código-fonte na área de transferência.
Jpsy # 15/13
2
Para o Firefox para Android, há um complemento que permite visualizar o código-fonte sem prefixar URLs a cada vez, basta clicar na entrada "Visualizar código-fonte" no menu do aplicativo e você verá o código-fonte da página da Web aberta no momento. O complemento é View Source Mobile
Francisco Alvarado
6
Como um bookmarklet:javascript:document.location='view-source:'+document.location;
Benjamin Oakes
3
Esta resposta deve ser votada mais e selecionada como a correta.
115515 Fred Thomsen
1
Isso também funciona no Firefox e Chrome no Linux e Windows, provavelmente no MacOS
Motte001
29

Procure um aplicativo chamado View Web Source no mercado e instale-o.

Em seguida, ao navegar, abra o menu e toque em "compartilhar", na lista exibida, escolha Exibir fonte da Web.

Keith Twombley
fonte
Keith - seu cara do ROCK .. salvou meu @ss .. não conseguia descobrir por que meu vídeo não estava incorporado, mas com a ajuda dessa ferramenta, pude ver pela fonte que o código não estava sendo incluído pelo servidor .net
2
Link para o aplicativo: market.android.com/details?id=com.jamesob.vwsource acabou de experimentar, parece ser bom. Nenhuma sintaxe destacada, mas faz o trabalho. Coloca a fonte em uma caixa de texto normal, o que significa que você pode copiar facilmente o texto.
GAThrawn
7

O aplicativo mencionado nesta resposta não é atualizado desde 2009.

Você pode tentar o VT View Source .

Rebelde
fonte
1
Isso tem destaque de sintaxe e é muito fácil de usar. Funciona com o navegador Android padrão e o Chrome. O Firefox mais recente para Android tem sua própria fonte de exibição, portanto não precisa disso.
Ezward
6

Outra ferramenta que é útil para visualizar a fonte e modificá-la ao vivo, de maneira semelhante ao Firebug / Web Inspector, é o depurador remoto mais remoto.

Lie Ryan
fonte
essa resposta é demais.
IAmDeveloper
5

Crie um novo favorito (bookmarklet) no Mobile Chrome com:

Nome: Visualizar fonte (vs)

URL: javascript:document.location='view-source:'+document.location; void(0);

Agora, quando estiver em uma página, toque no campo de endereço e comece a digitar: vs. O bookmarklet deve aparecer, clique nele e você estará pronto.

Milen Boev
fonte
3

Se isso é para depuração (a partir do seu comentário, parece que é), algo ainda melhor é instalar uma extensão de alternador de agente de usuário para Firefox ou Chrome na área de trabalho. Altere o agente do usuário para Android e você obterá a versão móvel do site, mas com todas as ferramentas de origem e depuração às quais está acostumado.

Ken Fehling
fonte
2

você pode capturar a fonte no seu shell ou em um arquivo de texto se estiver usando um emulador, o que é muito útil para o desenvolvimento. Para fazer isso, você precisará instalar o Android Developer Tools, que acompanha o adb. Inicie o seu emulador e, a partir do shell do sistema operacional, execute o comando:

adb logcat browser:V *:S

Isso produzirá qualquer coisa do aplicativo do navegador no seu emulador e suprimirá outras mensagens de log. A partir daí, qualquer comando javascript console.log será capturado por adb e output para você visualizar. Portanto, se você estiver usando o JQuery, poderá adicioná-lo à sua página e ele produzirá o html da página inteira no log:

$(document).ready(function(){console.log($('html').html())});

Isso produzirá tudo o que estiver dentro da sua tag html na página para o log.

Você pode capturar a saída do seu log (usando o BASH, pelo menos, não posso falar com outros shells) com:

adb logcat browser:V *:S > log.txt

agora, qualquer saída do log é despejada no seu arquivo log.txt. Isso é realmente útil para o valor de HTML de uma página inteira, pois você pode pesquisá-lo como faria com qualquer outro documento de texto.

Se você quiser pegar um pedaço específico da página e não a coisa toda, poderá especificar essa parte da página em vez da tag html no seu JQuery, portanto, se você precisar olhar para uma única div que tenha um ID / classe associado a ele (neste exemplo, ele tem uma classe chamada 'inspecione-me'), você pode alterar seu JQuery para:

$(document).ready(function(){console.log($('div.inspect-me').html())});
Wendallsan
fonte
1
Embora isso possa funcionar bem, a pergunta foi feita no navegador Android - e não a partir de . Obtendo a fonte usando um PC tem maneiras muito mais fáceis - como por exemplo, pressionando Ctrl-U no Firefox;)
Izzy
2

Se você estiver usando um navegador Opera, digite-o na barra de endereço, apague o http e outros itens e digite:

server:source

no endereço da página que você abriu.

Akhi Hosad
fonte