WebFund 2015W: Tutorial 4: Difference between revisions
No edit summary |
No edit summary |
||
Line 1: | Line 1: | ||
'''This tutorial is not yet finalized (and in fact is likely to change radically).''' | '''This tutorial is not yet finalized (and in fact is likely to change radically).''' | ||
In this tutorial you will examine [http://homeostasis.scs.carleton.ca/~soma/webfund-2015w/code/ | In this tutorial you will examine [http://homeostasis.scs.carleton.ca/~soma/webfund-2015w/code/notes-demo.zip notes-demo], a simple node express application that demonstrates session support and basic form interaction. You will need to use the browser and node debugging tools described in the [[WebFund 2015W: Tutorial 2|Tutorial 2]]. | ||
In this tutorial you should do the following | In this tutorial you should do the following after getting [http://homeostasis.scs.carleton.ca/~soma/webfund-2015w/code/notes-demo.zip notes-demo] running. | ||
===Understanding Sessions=== | |||
* Try logging in to the app using two different browsers (e.g., Firefox and Chrome). What happens when you logout from one browser - how does it affect the other? | * Try logging in to the app using two different browsers (e.g., Firefox and Chrome). What happens when you logout from one browser - how does it affect the other? | ||
* Observe the request and response for the app's home page (http://localhost:3000). Look at both the network panel (load the page ''after'' selecting the network panel) and the HTML DOM view (Inspector/Elements) | * Observe the request and response for the app's home page (http://localhost:3000). Look at both the network panel (load the page ''after'' selecting the network panel) and the HTML DOM view (Inspector/Elements) | ||
Line 11: | Line 12: | ||
* What does the req.body and req.session look like just before a page gets rendered? | * What does the req.body and req.session look like just before a page gets rendered? | ||
===Understanding User input=== | |||
* What happens to HTML tags embedded in a note title? What about the content? | |||
* What code is responsible for this difference? Specifically, what is the difference in how user data is stored or displayed? | |||
To get checked off, show a TA the following: | To get checked off, show a TA the following: | ||
* A session cookie sent by the browser | * A session cookie sent by the browser | ||
* A session cookie stored on the server | * A session cookie stored on the server | ||
* A modified /notes page that shows an error after attempting to edit a non-existent note | |||
Questions to ponder: | Questions to ponder: | ||
Line 21: | Line 25: | ||
* How "persistent" are sessions on the server? The client? | * How "persistent" are sessions on the server? The client? | ||
* How could you "hijack" a session? Does the difficulty of session hijacking relate to whether a login is password protected or not? | * How could you "hijack" a session? Does the difficulty of session hijacking relate to whether a login is password protected or not? | ||
* How much code would you have to add to [[WebFund 2015W: Tutorial 3|tinywebserver]] in order to get it to duplicate the functionality of | * How much code would you have to add to [[WebFund 2015W: Tutorial 3|tinywebserver]] in order to get it to duplicate the functionality of notes-demo? | ||
* Why does this application have so many screens to implement so little functionality? |
Revision as of 04:18, 2 February 2015
This tutorial is not yet finalized (and in fact is likely to change radically).
In this tutorial you will examine notes-demo, a simple node express application that demonstrates session support and basic form interaction. You will need to use the browser and node debugging tools described in the Tutorial 2.
In this tutorial you should do the following after getting notes-demo running.
Understanding Sessions
- Try logging in to the app using two different browsers (e.g., Firefox and Chrome). What happens when you logout from one browser - how does it affect the other?
- Observe the request and response for the app's home page (http://localhost:3000). Look at both the network panel (load the page after selecting the network panel) and the HTML DOM view (Inspector/Elements)
- Observe the contents of the form submit POST request: how much data is sent to the server? Observe it both from the browser side (to see what is sent) and inside of node, particularly where the POST results are returned.
- The session state is stored in the browser. Can you figure out the user's username from this information?
- What does the req.body and req.session look like just before a page gets rendered?
Understanding User input
- What happens to HTML tags embedded in a note title? What about the content?
- What code is responsible for this difference? Specifically, what is the difference in how user data is stored or displayed?
To get checked off, show a TA the following:
- A session cookie sent by the browser
- A session cookie stored on the server
- A modified /notes page that shows an error after attempting to edit a non-existent note
Questions to ponder:
- Who can observe the cookie? Modify it?
- How "persistent" are sessions on the server? The client?
- How could you "hijack" a session? Does the difficulty of session hijacking relate to whether a login is password protected or not?
- How much code would you have to add to tinywebserver in order to get it to duplicate the functionality of notes-demo?
- Why does this application have so many screens to implement so little functionality?