 Hey, what's going on everybody? My name is John Hammond and we're back to some Pico CTF 2019. In this video, we're going to take a look at the Inspector Challenge, it's just 50 points in the web exploitation category. At the time of recording, it has 11,217 solves, so it will hopefully be a pretty easy and simple challenge for us to work through. The challenge prompt is this person, not going to butcher that name, he tipped us off that the following code may need inspection. We're given a URL to go to with a link here or we could just go to visit this on specific ports. Oh, that's nice. They give you a little relative port or not really a port but just an address to get to it if you can't get out on that unique one, if you might be playing at work or some university that kind of filters those ports you work with. So that's handy, whatever. Let's just go to it. I'll open up that link in a new tab and here we have Inspect Me. This is the website. It says what as the first page and there's a how page apparently at that navigation. I'm going to use these to make the site HTML, CSS, and JS or JavaScript. So HTML is the hypertext markup language. Let's go look that up real quick because this challenge is supposed to expose you to some new things that you may not have seen or heard before. HTML is that source code that makes up web pages with static text, just the content and information that's actually going to be on that page. CSS, that is cascading style sheets if we go ahead and look at that. That is the language that will allow you to kind of allow some pretty decorations for your website, add color, add fonts, kind of position images and supply the layout for what that web page will actually look like. Again, that's just static and not dynamic. It's not particularly code, just declarations as to how the page will look and how it's set up and actually manifested. JavaScript, that JS acronym there, that is actually for dynamic code, but it's for a client-side code. It's all within your browser. It's actually happening within Firefox or within Chrome or within Internet Explorer or Edge or whatever you happen to be using. But it's all about client-side code. It's really just happening on the end-users browser, not happening on the remote server that's hosting this web page. So that's a pretty important distinction. You can do some stuff with it like cross-site scripting or sometimes you could abuse this depending on how it's set up to maybe leverage some of the server-side stuff like local file inclusion, et cetera, et cetera. But in this case, it's just kind of showcasing this is the language and we'll get to explore it and see how it really looks. So let me now view the source of this web page and take a look at that HTML or that hypertext markup language that it's made of. I'm gonna right-click and hit View Page Source and it says my first web page, my website here. This is all of that HTML syntax and structure. It's kind of done with these greater than, less than symbols, walk-a-walkas, whatever you wanna call them. And there are elements that are inside of those or HTML tags. And you could scroll through this. HTML has support for comments or just kind of note, notations, remarks that the programmer might wanna leave in the code so that it's visible for others or to help themselves remember what they were developing. In this case, it says here, HTML is neat. Anyways, I have one third of the flag and we have only a fragment or a section of it. So we have to go hunt and track down the other segments of this flag here. I am gonna actually just take note of this. I'll fire it up internal here. Let's make a directory for Inspector, this challenge that we're working with. And I'll just go ahead and create a flag.text that I will copy and paste this in so we can keep building through it. Now let's go look around and see what else we have on this web page. It's, again, pretty static. There's not a whole lot here. But you can notice that they're actually referring to other external files. These links here, kind of denoted with that underscore, will clue us in that there's something else that we could look at. Up top, they actually href or reference out to a remote location. This is just Google, Google APIs for the font that they're grabbing. Since that's external and not inside of the challenge scope, that's not particularly gonna help us. But we can see they are using some other local files, mycss.css. Those cascading style sheets and myjs.js are my JavaScript. So let's go take a look at those, explore, numerate. And this is the CSS syntax, right? This is the cascading style sheets where they specify, here's an HTML tag or element. And then within here, you have these specific properties that are set to some values as to how they will look and what they'll actually be modifying. Again, you can include comments in CSS. Their style and syntax is with a forward slash and a star. And you have to end these just as you kind of seen in HTML. Looks like my face is in the way, so you can't see it all that well. But I guess I also can't scroll down very much. So this is that two thirds or that second part of the flag. Again, I'll copy that and just paste it in here. Looks like our flag is trying to build out in leapspeak true detective or just. And we still need that third part of the flag. We can assume though, kind of with what we know thus far, that it's probably going to be in that myjs.js JavaScript file. Let's go ahead on to that. And here is our JavaScript code. You can see this looks more like code. We're defining a function here, and it has some variables that are being used. And you could actually grab elements of that web page or the DOM, the document object model, and actually work with them. Do some for loops, some if statements, et cetera, et cetera. Even supply bindings or hooks for certain events or things that happen on the page. Here's another comment. JavaScript sure is neat. Here is the third part of the flag. And you can tell that's the end of the flag because we have our ending curly brace. So that's a pretty good thing to just keep in mind knowing the flag format. Let's copy and paste that in, and that is our full flag. We could go ahead, grab all of this, slap it into this submission here, and it says great, flag correct, awesome. That's how you solve that challenge. It's just meant to be exposure for some of those web languages. If I were to try and solve this with Katana, admittedly Katana would not be able to track this one down because that flag is separated and segmented and fragmented into those three sections. Since Katana works finding a flag with a regular expression, it's not going to be able to know where it ends and picks up somewhere else and track that all down and really even determine what the flag could be in that case. So I'm not able to showcase that, but to sprinkle in a little bit more to this video, we can automate our process for actually noting that we've solved this challenge. That's kind of a practice I like to do. I'll just move out of that directory, make that mark this kind of challenge or that folder directory I worked in as complete, and that's a nice little move command trick, so you don't have to type it all out again. But let's automate that so we don't have to do that each time. And then later, when we actually get back to another challenge, if we just have a single line, little simple get flag command or get flag script, that's just one line in bash. We'll automate how we can note that within our terminal. That should be nice and easy for us as well. So I'm just going to create a script in my opt directory. I'll call it finish, and I actually have opt writable. Let me close out of some of these things I have actually open within sublime text. Sorry, I'll drag that down so you can see it. And we'll start with a simple shebang line. We're not gonna have syntax highlighting here because we didn't supply a file extension, but we'll trust what we're writing. And let's say, let's have a variable dir. We'll just call that dir here, and we'll take the actual output. That's what I'm doing with some command substitution here with that dollar sign and then our parentheses to get the evaluation of that PWD command. And that's the present working directory. See what we're currently working in. Good. And then we can go ahead and move our dir variable to dir underscore completes, kind of just like we did, but more in the actual source destination verbose method. And let's actually move out of the current directory that we were in just back up to our parent directory as I kind of did manually just a moment ago. So now we can save this. Let's mark that script as executable opt finish in my case. And we want to actually supply that as an alias for us because the way we would actually try and run opt finish, if I were to run this, just execute it just now, you can see my prompt hasn't changed and I haven't moved out of that current directory. It didn't even do what I wanted it to do. So I'll move actually to the parent directory. And it did, in fact, rename the folder, but we didn't CD parent parent because we actually are not running bash or running that shell script within the current scope that we're running it right now. Just fork the process and start its own bash session for us. So we would have to actually source that. We'd have to source that script that we're running. Let me do that with a simple alias. I'll just say alias finish can equal source of that script that we just wrote. And now if I were to kind of reset the stage, let's move inspector to complete to just straight inspector. Let's move back to inspector, let's run finish. And you can see now I've moved my directory and we have automatically renamed that just fine. So that's that. If you wanted to make that alias persistent, you can add it into your bash RC file or your ZSH RC file, whatever shell you're running. And at the very, very bottom here where we have some aliases, you can just say alias finish source and then where you actually put your script. I put mine in opt because I like to put my tools in nice little convenience things in there. So that's that. I hope you enjoyed this video. I hope you got the flag. Hope you got a little bit more exposure with HTML, CSS and JavaScript. If you haven't seen it before, maybe you're new to this. That's the whole point of pico. We're getting excited. We're getting educated and we're learning a little bit about cybersecurity. So if you did like this video, please do like, comment and subscribe, all the YouTube things. Love to see you on Discord. There's a link in the description. I love to see you on Patreon, PayPal, all those stuff. Thanks for watching guys. I love you, I'll see you in the next video.