I'm trying to get past this CTF challenge. Here is the clue:
The challenge here to steal someone else's cookies from a different website. The value of that cookie is your password. You are using a chat application with Bob wherein you send and receive messages from each other. You know Bob uses BookFace.com to read your messages and type out his replies. You go to BookFace.com and find that its client-side code is [see below for client-side code]. When you try to send a message to Bob, you will see the non-HTML text content of the "p" tags with ids "you-said" and 'bob-said'. Your job is to retrieve the secret cookie in one of these tags, so that you can read them.
Client-side Code
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<script type="text/javascript">
document.cookie = <some password>;
</script>
</head>
<body>
<p id='you-said'>You said: <some message></p>
<p id='bob-said'>Bob said: Hi! I am Bob</p>
</body>
</html>
Here is how the chat app looks like after I've sent the message "hello" to Bob: Chat app
Here is the a fragment of the HTML code I got from the dev tools (clicking F12 on chrome): HTML snippet of chat app
I am new to HTML and DOM. I understand that in order to retrieve the password, I have to manipulate the DOM of Bob? and somehow use java script to print document.cookie.
What I've tried so far is update one the p tags and changed it to
<script type="text/javascript">
window.alert(document.cookie);
</script>
but this just prints out my cookies I think. I think what I need to do is indeed use javascript to manipulate the content of the page by using existing elements. But how do I access Bob's DOM. I've tried using console.log(document.cookie) and placed that in one of the existing elements in the html, but it did not print anything.
Please help me figure out how to access Bob's DOM and print his secret cookies. Thank you!