TryHackMe: Walking an Application Walkthrough | by Subhadip Nag(MrL0s3r)

8 min readOct 6, 2021

Hey Buddies,

Subhadip Nag this side, this is my first writeup in TryHackMe’s room, in this module i will try to explain Indroduction to WebHacking : Walking an Application. Forgive me if there is any mistake in my writing.🙂

So Lets start the writeup.🤩🤩

Room link: https://tryhackme.com/room/walkinganapplication

Here i’m starts counting from 0, because you know that we always start everything from 0😁😁.We are not a normal humans😎.

0. Walking an application:

First we need to start the machine to get the IP address:

Now it takes time maximum 2minutes to deploy when appears the IP in the URL : https://x.x.x.x.p.thmlabs.com

Here is look like:

1. Exploring the Website:

Here we see that some pages/areas/features to review the above shown website.

As a penetration tester, Our role when reviewing a website or web application is to discover features that could potentially be vulnerable and attempt to exploit them to assess whether or not they are. These features are usually parts of the website that require some interactivity with the user.

Finding interactive portions of the website can be as easy as spotting a login form to manually reviewing the website’s JavaScript. An excellent place to start is just with your browser exploring the website and noting down the individual pages/areas/features with a summary for each one.

An example site review for the Acme IT Support website would look something like this:

Follow all the areas and try to find all of them.

# Here is no answer needed, so we will go ahead to solve next challenges.

2. Viewing The Page Source:

The page source is the human-readable code returned to our browser/client from the web server each time we make a request.

The returned code is made up of HTML ( HyperText Markup Language), CSS ( Cascading Style Sheets ) and JavaScript, and it’s what tells our browser what content to display, how to show it and adds an element of interactivity with JavaScript.

For our purposes, viewing the page source can help us discover more information about the web application.

How do I view the Page Source?

While viewing a website, you can right-click on the page, and you’ll see an option on the menu that says View Page Source.
Most browsers support putting view-source: in front of the URL for example, view-source:https://www.google.com/
In your browser menu, you’ll find an option to view the page source. This option can sometimes be in submenus such as developer tools or more tools.

Let’s view some Page Source!

Try viewing the page source of the home page of the Acme IT Support website.

Right click on the website’s home page and follow the image.

a. At the top of the page, you’ll notice some code starting with  these are comments.These comments don't get displayed on the actual webpage. This comment describes how the homepage is temporary while a new one is in development.

Here we see in the comment there assign a new page **/new-home-beta**, we need to go through in the browser to get the 1st flag.

Links to different pages in HTML are written in anchor tags ( these are HTML elements that looks like<a href="#"></a> ), and the link that you'll be directed to is stored in the href attribute.

b. If you view further down the page source, there is a hidden link to a page starting with “secr”, view this link to get another flag. You obviously wouldn’t get a flag in a real-world situation, but you may discover some private area used by the business for storing company/staff/customer information.

Click the highlighted area and you get the 2nd Flag.

c. External files such as CSS, JavaScript and Images can be included using the HTML code. In this example, you’ll notice that these files are all stored in the same directory. All the files in the directory are safe to be viewed by the public, but in some instances, backup files, source code or other confidential information could be stored here. In this instance, we get a flag in the flag.txt file.

In the above image we see that all external files like CSS, JavaScript and Images are in assets directory.

Here we go😁. We got the flag, now we need to click the flag.txt file and we will see the flag.

d. Many websites these days aren’t made from scratch and use what’s called a Framework. A framework is a collection of premade code that easily allows a developer to include common features that a website would require, such as blogs, user management, form processing, and much more, saving the developers hours or days of development.

Now at the bottom of the page, you’ll find a comment about the framework and version in use and a link to the framework’s website. Viewing the framework’s website, you’ll see that our website is, in fact, out of date. Read the update notice and use the information that you find to discover another flag.

Goto the above link,paste in browser then we need to go **changelog** page theres an another file we found. Hint : **https://10-10-x-x.p.thmlabs.com/<file.zip>**

When we put the above the given hint we see in that time a popup appears in a zip file and this contain our 4th flag.

Answer:

3. Developer Tools — Inspecter

Opening Developer Tools

The way to access developer tools is different for every browser. If you’re not sure how to access it, click the “View Site” button on the top right of this task to get instructions to how to access the tools for your browser.

Now we start to know what actually Inspector is. right!!

Inspector

The page source doesn’t always represent what’s shown on a webpage; this is because CSS, JavaScript and user interaction can change the content and style of the page, which means we need a way to view what’s been displayed in the browser window at this exact time. Element inspector assists us with this by providing us with a live representation of what is currently on the website.

On the Acme IT Support website, click into the news section, where you’ll see three news articles.

The first two articles are readable, but the third has been blocked with a floating notice above the content stating you have to be a premium customer to view the article.

Right-clicking on the premium notice, you should be able to select the Inspect option from the menu, which opens the developer tools. You’ll now see the elements/HTML that make up the website ( similar to the screenshot below ).

There you will see (in the highlighted area) that we change the display: block to “none”. (Note: after changes the value of **“display: block to none”,** don’t refresh the page.)

Locate the div element with the class premium-customer-blockerand click on it. The style we're interested in is the display: block. If you click on the word block, you can type a value of your own choice. Try typing none, and this will make the box disappear, revealing the content underneath it and a flag.(similar to the screenshot below)

Here we are see our left side the flag appears when we change the value of the display : block to none. If you dont understand this, follow : “https://assets.tryhackme.com/additional/walkinganapplication/updating-html-css.gif"

4. Developer Tools — Debugger

In the developer tools is intended for debugging JavaScript, and again is an excellent feature for web developers wanting to work out why something might not be working. But as penetration testers, it gives us the option of digging deep into the JavaScript code.

Now on the Acme IT Support website, click on the contact page, each time the page is loaded(refresh), you might notice a rapid flash of red on the screen. We’re going to use the Debugger to work out what this red flash is and if it contains anything interesting.

In both browsers, on the left-hand side, you see a list of all the resources the current webpage is using. If you click into the assets folder, you’ll see a file named flash.min.js. Clicking on this file displays the contents of the JavaScript file.(follow the right browser)

We click on that option “Pretty Print” , which looks like two braces { } to make it a little more readable, although due to the obfustication, it’s still difficult to comprehend what is going on with the file. If you scroll to the bottom of the flash.min.js file, you’ll see the line: flash['remove']();.

If you click the line number that contains the above code, you’ll notice it turns blue; you’ve now inserted a breakpoint on this line. we will refresh the page (note : debugger window will be open when you refresh the page.), and you’ll notice the red box stays on the page instead of disappearing, and it contains a flag.

Now the question is what is breakpoints : Breakpoints are points in the code that we can force the browser to stop processing the JavaScript and pause the current execution.

5. Developer Tools — Network

The network tab on the developer tools can be used to keep track of every external request a webpage makes. If you click on the Network tab and then refresh the page, you’ll see all the files the page is requesting.

Try doing this on the contact page.With the network tab open, try filling in the contact form and pressing the Send Message button. You’ll notice an event in the network tab, and this is the form being submitted in the background using a method called AJAX. AJAX is a method for sending and receiving network data in a web application background without interfering by changing the current web page.