How do I view source code in an Android web browser?

Question

Is there a way to view the source HTML in an Android web browser?

score 291 · Answer 1 · edited Feb 19 '13 at 23:23

291

In Firefox or Chrome on Android it's possible to view source by prefixing the URL in the address bar with "view-source:", i.e. "view-source:http://google.com".

edited Feb 19 '13 at 23:23

Matthew Read

50,567
30
145
273

answered Dec 04 '12 at 07:29

Ludder

3,019
2
13
3

4

Great solution. It even generates syntax coloring (at least on Chrome) and allows to copy source code to the clipboard. – Jpsy Oct 15 '13 at 07:50
2

For Firefox for Android there is an add-on which lets you view source code without prefixing URLs each time, just click the "View Source" entry from the app menu and you'll see source code for currently open webpage. The add-on is View Source Mobile – Francisco Alvarado Dec 23 '13 at 06:40
7

As a bookmarklet: javascript:document.location='view-source:'+document.location; – Benjamin Oakes Jan 30 '15 at 05:22
FYI, This does not work on iOS, I don't know if has it been nerfed on Android too or not. – Bardi Harborow Sep 12 '15 at 15:42
This also works on Android's Anblock plus browser – Matthew Moisen Apr 23 '16 at 18:52
1

This also works on Firefox and Chrome on Linux and Windows, probably on macOS – Motte001 Jun 30 '16 at 10:41
1

This does not work for modified pages, because it gets the source from the server, not the browser. So if you have for example JavaScript that has modified an element, you will not get the updated HTML, but the old/updated HTML from the server. – Chiwda Jan 15 '17 at 15:05
This isn't going to work when I need to see the source of a page which is the result of a form POST request. Changing the content of the address bar is going to result in a fresh GET request which'll just show the source of the original form (in my case, depends if the GET/POST endpoints are the same for other forms). – Ceisc May 26 '18 at 14:16
This is more of an inconvenient hack, since Chrome doesn't let you edit URLs anymore. Now you have to re-type in the entire URL prefixed with "view-source:". – Cerin Mar 29 '21 at 04:02

score 75 · Accepted Answer · edited Jan 22 '11 at 01:42

75

You can use Javascript's alert method to return the source code, type this in the address bar:

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

edited Jan 22 '11 at 01:42

Lie Ryan

19,073
6
65
83

answered Jan 21 '11 at 17:28

3

initially, I had doubt that javascript: URI scheme would work on Android's browser, but it seemed to work on my 2.1 browser. However, you don't get syntax highlighting and you cannot copy the text, so it's not very usable for long HTML pages. – Lie Ryan Jan 22 '11 at 01:45
1

Doesn't work for me! The emulator always adds the http:// prefix and I get a site not found by Google. – Feb 07 '11 at 17:13
1

Chrome for Android only shows around 50 or so lines. – May 18 '15 at 19:07
Doesn't work on Firefox for Android. – Aaron Franke Dec 23 '17 at 01:14

score 27 · Answer 3 · edited Aug 21 '13 at 12:14

27

Look for an app called View Web Source in the market and install it.

Then when browsing, open your menu and tap "share", in the list that pops up choose View Web Source.

edited Aug 21 '13 at 12:14

ale

19,723
34
110
159

answered Jan 23 '11 at 01:59

Keith Twombley

670
4
5

2

Link to app: https://market.android.com/details?id=com.jamesob.vwsource just tried it out, looks good. No syntax highlighting, but does the job. Puts the source into a normal text box which does mean you can easily copy text out of it. – GAThrawn Feb 07 '11 at 16:43

score 8 · Answer 4 · edited Apr 13 '17 at 12:18

8

The app mentioned in this answer hasn't been updated since 2009.

You might want to try VT View Source.

edited Apr 13 '17 at 12:18

Community

1

answered Aug 21 '13 at 11:24

ReBeL

81
1
1

1

This has syntax highlighting and is very easy to use. Works with the default Android browser and Chrome. Latest Firefox for Android has it's own View Source, so it does not need this. – Ezward Dec 20 '14 at 20:24

score 6 · Answer 5 · answered Jul 29 '12 at 13:12

6

Another tool that is useful for viewing source AND modifying them live, in Firebug/Web Inspector-like manner, is the weinre remote debugger.

answered Jul 29 '12 at 13:12

Lie Ryan

19,073
6
65
83

score 6 · Answer 6 · edited Mar 19 '14 at 21:15

6

Create a new bookmark (bookmarklet) on Mobile Chrome with:

Name: View Source (vs)

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

Now when on a page, tap the address field and start typing: vs. The bookmarklet should appear, click it and you are ready.

edited Mar 19 '14 at 21:15

ale

19,723
34
110
159

answered Mar 19 '14 at 20:14

Milen Boev

161
1
1

score 4 · Answer 7 · answered Jun 29 '13 at 08:21

IN chrome, there is remote debugging facility. If you install Chrone on your phone. If you connect your phone through usb to PC,you can view the Javascript modified source on your PC in a Chrome browser.

See the end of http://eclipsesource.com/blogs/2012/08/14/debugging-javascript-on-android-and-ios/

score 3 · Answer 8 · answered Jul 29 '12 at 07:30

If this is for debugging (from your comment it looks like it is) something even better is installing a user agent switcher extension for Firefox or Chrome on your desktop. Change the user agent to Android and you get the mobile version of the site, but with all the source and debugging tools you're used to.

score 2 · Answer 9 · edited Jul 28 '12 at 16:01

you can capture the source to your shell or to a text file if you're using an emulator, which is very handy for development. To do this you'll need to install Android Developer Tools, which comes with adb. Fire up your emulator then from your OS's shell run the command:

adb logcat browser:V *:S

This will output anything from the browser app on your emulator and suppress any other log messages. From there any javascript console.log commands will be captured by adb and output for you to view. So, if you're using JQuery, you can add this to your page and it'll output the whole page html to the log:

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

This will output everything within your html tag on the page to the log.

You can capture the output of your log (using BASH, at least, I can't speak to other shells) with:

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

now, any output from the log gets dumped into your log.txt file. This is really handy for a whole page's worth of HTML, as you can then search through it as you would any other text doc.

If you want to grab a specific bit of the page rather than the whole thing, you can specify that part of the page rather than the html tag in your JQuery, so if you need to look at a single div that has a class/id associated with it (for this example, it has a class named 'inspect-me'), you can change your JQuery to:

$(document).ready(function(){console.log($('div.inspect-me').html())});

While this may work fine, the question said in the Android web browser -- not from. Getting the source using a PC has much easier ways -- as e.g. pressing Ctrl-U in Firefox ;) — Izzy, Aug 25 '12 at 17:15

score 2 · Answer 10 · edited Feb 18 '13 at 18:31

2

If you are using a Opera browser type this in your address bar, make sure you erase the http and other stuff, then type:

server:source

in the address of the page which you opened.

edited Feb 18 '13 at 18:31

eldarerathis

36,787
16
144
175

answered Feb 18 '13 at 18:28

Akhi Hosad

21
1

score 1 · Answer 11 · edited Aug 29 '21 at 13:26

That feature seems to be unavailable for all major android browsers. You could try Opera　Mini instead.

Reset the console output by opening a new tab with the address debug:resetconsole
Open a tab on the page on which you want to do the inspection:
Run JavaScript code on the page by replacing the address in the address bar with the following address javascript:var%20n%3Ddocument.firstChild%3Bwhile%28n%20%26%26%20n.nodeType%21%3DNode.ELEMENT_NODE%29%20n%3Dn.nextSibling%3Bconsole.log%28n.outerHTML%29%3B
Retrieve the output by opening a new tab with the address debug:console

score 1 · Answer 12 · answered Jan 29 '22 at 22:23

Kiwi Browser as of January 2022 offers "Developer tools" feature through which one can access rendered HTML among other things. See screenshot to know where to find it. The developer tools for a given webpage are loaded in a new tab.

Since Kiwi Browser also allows installing Chrome for PC extensions you can find an extension that allows viewing HTML of a webpage and can install it in Kiwi Browser. It should also work.

score 0 · Answer 13 · answered Aug 29 '21 at 13:12

In firefox, if it is a real link to the final page (not the link we click on google), you can press and hold over the link and click on "download link", then open it in a text viewer (i suggest xplore app).

Bonus answer: to download a .mp3, from that downloaded page's text, select the .mp3 url, share it with "open with" or "better open with" app, and open it in the "NoBrowser" app that can handle .mp3 download, and is fast and tiny!

score -1 · Answer 14 · answered Oct 08 '14 at 16:34

-1

If you want to view source of Android browser page, or inspect page you can use this https://developer.chrome.com/devtools/docs/remote-debugging Its very good inspector

answered Oct 08 '14 at 16:34

Seekcougars

1

How do I view source code in an Android web browser?

14 Answers14

Linked

Related