# Web Exploitation - 0 to 1
## Syllabus
* Web Architecture
* How it works
* Client side and Server side
* The difference
* Languages used
* HTTP Requests and Responses
* The syntax
* Understanding the differnent methods and headers
* DevTools in Browsers
* Inspect Element
* Javascript
* Understanding and Reversing client side logic
* Cookies
* The what and why
* Finding and modifying cookies from client-side
* Robots.txt
* The what and why
* Hidden Endpoints
## Web architecture
* Resource: https://app.traboda.com/academy/web-exploitation-basics/web-architecture?slide=1
* Chapter Outcome:
* The reader will understand what happens when they visit a site and will have an idea of how the world wide web works.
## Client and Server Side
* Resource: https://app.traboda.com/academy/web-exploitation-basics/client-and-server-side-languages
* Chapter Outcome:
* The reader can now differentiate between the two different parts of web and understand the importance and working of each.
## HTTP Requests and Responses
* Resource: https://app.traboda.com/academy/web-exploitation-basics/hypertext-transfer-protocol
* Chapter Outcome:
* The reader will understand the working of HyperText Transfer Protocol and how we communicate to the backend. The reader will also have knowledge to craft their own HTTP requests and responses.
## Inspect Element in DevTools:
* Resource: https://app.traboda.com/academy/web-exploitation-basics/developer-tools?slide=2
* Chall link: [keep-away](https://app.traboda.com/challenge/119)
* Steps to Solve:
* The page on opening has 2 buttons, one says `Click-Me` and the other says `Call me back`
* When we try to reach `Click-Me` the box disappears, and `Call me back` returns it to the original place.
* Our aim is to find what `Click-Me` button does.
* Now that we are not able to click it for sure, we can check the source to see what is happening.
* Right Click and click on Inspect Element or Press F12 or Ctrl+Shift+I to open DevTools.
* Go to the Elements tab if you're already not there.
* As you hover over different parts of the code shown, respective part of the page is highlighted.
* Find the code for the button.
* We can find the button under the div with id `runaway-container`
* The button has an attribute called `onclick="do_something()"` - this means that the javascript function `do_something()` is called when the button is clicked.
* Now that we know what happens when we click it, we can directly try calling the function.
* In the DevTools, go to the console tab and type `do_something()` and hit enter to call it.
* `_4nd_b4s1c_j4va5cr1p7} 2/2 of flag :(` is returned. We still need to find the first half of the flag.
* We can again go to the `Elements` tab and check.
* There is a paragraph tag with the id *flag*
* There we can find the first part of the flag - `inctfj{fUn_l34rn1ng_h7ml`
* Similar Chall: [No-Rclick](https://app.traboda.com/challenge/500), [River-Source](https://app.traboda.com/challenge/494)
* Chapter Outcome:
* The reader will know how to check the client side code. The reader is also introduced to the various developer tools that browsers offer.
## Javascript
* Resource: https://app.traboda.com/academy/web-exploitation-basics/developer-tools?slide=2
* Chall link: [Client Auth](https://app.traboda.com/challenge/482)
* Steps to Solve:
* The page has a login form. Since the title says "Client Auth", we can assume that the authentication part happens on the client-side.
* So, we need to check the source to know what's happening.
* Press Ctrl+U to view the source for the current page.
* There is a "/script.js" file being used. Click on the link to open that page. Now, the logic for login can be understood.
* From this file, we can see that the username and password are being compared to a value and once that is correct we are taken to the path the-correct-password/the-correct-username.html
* The username and password are compared to a value using a function called `String.fromCodePoint()`.
* This function is used to convert values into a string. That is, String.fromCodePoint(97) will return "a".
* Now that we know how the authentication is being done, we can directly check what username and password the code is expecting.
* `"us == String.fromCodePoint(0x61,0x64,0x6D,0x69,0x6E,0x33,0x32,0x31) && pp == String.fromCharCode(105,95,97,109,95,99,48,48,76,95,95)"`.
* We can get the values using the "Console" tab of "DevTools". You can access this by pressing "Ctrl + Shift + I" or "F12".
* Then paste `String.fromCodePoint(0x61,0x64,0x6D,0x69,0x6E,0x33,0x32,0x31)` and hit enter.
* Do the same for pp comparison and you'll get the password.
* After this, you'll get *admin321* and *i_am_c00L__* as username and password respectively.
* When we use this to log in, we are taken to a page that says "Debug".
* This means the Console tab of DevTools. If we access that again, we can get the flag.
* Similar Chall: [JS_r3v](https://app.traboda.com/challenge/636)
* Chapter Outcome:
* The reader is introduced to Javascript and how to debug it. The reader can now understand how to reverse JS and understand the logic behind the frontend code.
## Intro to Cookies
* Resource: https://app.traboda.com/academy/web-exploitation-basics/cookies-and-sessions
* Resource: https://app.traboda.com/academy/web-exploitation-basics/developer-tools
* Chall link: [C00ki3_magic](https://app.traboda.com/challenge/720)
* Steps to Solve:
* This challenge requires us to view cookies.
* To do that, open DevTools.
* You can do that by pressing F12 or Ctrl+Shift+I or Right-Click and then click on inspect element.
* Now, you will see a new pane open up on your browser and towards the top of it, you will see options like `Elements, Console, Source, Network, ..`
* Click on the `Application` tab.
* Under the area marked as `Storage`, click on `Cookies`
* Here, you will see the different domains using cookies in that site.
* Click on chall.eng.run(as that is the domain we are on)
* In that we see a cookie with the name `expired` with a value that looks like a flag.
* The string is something like `inctfj%7Bbr4v0_y0u_f0und_7h3_c00k13%7D`. But our flag format is `inctfj{somthing-here}`
* Instead of `{` and `}`, we have `%7B` and `%7D`, we can URL Decode these. [Site that can be used for decoding](https://meyerweb.com/eric/tools/dencoder/)
* After we do that, we can get the flag as `inctfj{br4v0_y0u_f0und_7h3_c00k13}`
* Similar Chall: [c00kie-l0v3](https://app.traboda.com/challenge/117), [Favourite cookie](https://app.traboda.com/challenge/483)
* Chapter Outcome:
* The reader will now understand how the server and browser store data even though HTTP is a stateless protocol. Reader will also know how to modify and read cookies using DevTools.
## Robots.txt
* About:
* Sites like Google use crawlers(or robots) that visit all the sites and note what it contains. All major search companies would use a crawler. That's how they find the websites when we give a piece of text from it.
* Alright, what if the website has a sensitive page that it does not wish to share with the crawler? So, the developers decided that there should be a page that gives this information to the crawler. And to this cause, **/robots.txt** endpoint was created. This page follows a syntax the crawler understands to mark the pages that can be or cannot be read by the crawler.
* Chall link: [r0b0c0rp](https://app.traboda.com/challenge/120)
* Steps to Solve:
* Visit `/robots.txt`
* We can see the following the page
* ```
User-agent: *
Disallow: /1w4ntn0r0b0tsh3r3.html
```
* User-Agent is, simply put, your browser. If you're using chrome, it'll have something like `Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/92.0.4515.131 Safari/537.36`, if a google crawler is visiting the page, it's User-Agent would have the word `Google Bot`. The `*` denotes that the rule applies to all User-Agents.
* The next line, `Disallow` notifies the pages that the crawler should not visit, denoting that there might be some sensitive information in those.
* We can now visit the page `/1w4ntn0r0b0tsh3r3.html` to get the flag.
* Similar Chall: [B0t](https://app.traboda.com/challenge/478)
* Chapter Outcome:
* The reader is introduced to Crawlers and how Search Engines gather their information.