WebFund 2014W Lecture 5: Difference between revisions
Created page with "Video from the lecture given on Jan 22, 2014 is now available from multiple sources: * [http://www.screencast.com/t/Aypl5x4M small at screencast.com] (flash/mp4) * [http://www..." |
No edit summary |
||
Line 4: | Line 4: | ||
* [http://dl.cuol.ca/capture/Anil.Somayaji/COMP_2406_2014W_Lecture_5_-_20140122_151202_27.mp4 original at CUOL] (mp4) | * [http://dl.cuol.ca/capture/Anil.Somayaji/COMP_2406_2014W_Lecture_5_-_20140122_151202_27.mp4 original at CUOL] (mp4) | ||
* [http://homeostasis.scs.carleton.ca/~soma/webfund-2014w/lectures/comp2406-2013f-lec05-22Jan2014.mp4 original at homeostasis] (mp4) | * [http://homeostasis.scs.carleton.ca/~soma/webfund-2014w/lectures/comp2406-2013f-lec05-22Jan2014.mp4 original at homeostasis] (mp4) | ||
• To create an empty object we use: | |||
o Var car = { speed: “slow”}; | |||
o Var tesla = object.create(car); | |||
• To check the properties of the object: | |||
o Tesla.speed | |||
o ‘slow’ | |||
• To assign a different value to the speed property: | |||
o Tesla.speed = “fast”; | |||
o ‘fast’ | |||
• To assign a default value to a prototype object property: | |||
o Car.colour = “white”; | |||
o ‘white’ | |||
• To check: | |||
o Car | |||
o { speed: ‘slow’, colour: ‘white’ } | |||
o Tesla | |||
o { speed: ‘fast’ } | |||
• Note that the object “tesla” does not have the property colour but its prototype has it. | |||
o Object.getPrototypeOf(tesla); | |||
o { speed: ‘slow’, | |||
o colour: ‘white’ | |||
o wheels: 4 } | |||
• Every object in JavaScript has a prototype that can be accessed by: | |||
o Object.prototype | |||
• Session-demo: | |||
• Different users have different sessions and the server knows about the different sessions. The server is keeping track of state per user that is logged in. | |||
• The state is representation of what is on the server but it is also a reflection of which session has been identified to the server. | |||
• HTTP is a stateless protocol. Stateless means that each request that goes to the browser is independent of every other request. | |||
• When you make a request, your browser does not only send URL. It also sends a request with a lot of other properties. This is also a part of the HTTP protocol.(Look under the “Header” tab of the “Network” section in the Firefox console). | |||
• A User-Agent string is a part of the HTTP request. It is supposed to tell the server what kind of browser you are using. | |||
• A cookie is some bit of data that is sent somewhere and is expect to be returned later and is not to be processed or “eaten” by the other side. | |||
• Status code: every HTTP request that comes in to a server will generate a response code. (i.e. response code 200 means o.k. Response code 404 means page not found and 302 means page moved temporarily). | |||
• Node is a general web application execution platform. Express is a framework for it. | |||
• The following function takes ‘Comp 4106 rules!’ as a secret argument to encrypt the user session and to generate the valid cookies. The cookies must be made to be hard to reverse by others. | |||
o app.use(express.cookieParser(‘Comp 2406 rules!’)); | |||
• The following function uses the cookie parser in order to maintain sessions. It is the session identifier. Every time we do a “get” a cookies comes along with it and the user is identified: | |||
o app.use(express.session()); | |||
• Cookies can be specified with different life times. Some cookies are specified with session only life time. Some other cookies are specified to live for hours, days or years. | |||
• /routes/Index.js: | |||
• When the user enters the username, the incoming request has a session sub-object which is defined by the session layer of Express | |||
• If the session object has a username as a property, the user is already logged in | |||
o Function index (req, res) { | |||
o If (req.session.username){ | |||
o res.redirect(“/users”); | |||
o } else { | |||
o res.render(‘index’), { title: ‘COMP 2406 Session Demo’, | |||
o error: req.query.error }); | |||
o } | |||
o } | |||
• In the following code we set the username variable by (req.session.username) | |||
o Function login (req, res) { | |||
o Var username = req.body.username; | |||
o Req.session.username = username; | |||
o loggedInUsers [username] = LoggedIn; | |||
o res.redirect (“/users”) | |||
o } | |||
• Note that the user name came from the req.body object. | |||
• (req.body.username) is a part of the form. | |||
• The form “post” sends the user name to the server (this can be viewed under the “params” tab of the “network” section in the console. | |||
• Next we save it to the session by | |||
o Req.session.username = username; | |||
• When you ever see a line like: | |||
o Form (action=”/login” , method=”post”) | |||
In /views/index.jade | |||
You should expect to see a corresponding route like: | |||
o App.post(“/login”, routes.login); | |||
o App.post(“/logout”, routes.logout) | |||
In app.js | |||
Otherwise there will be a 404 error (page not found). | |||
• When deleting | |||
o App.use(express.json()); | |||
Nothing really happens | |||
• When deleting | |||
o App.use(express.urlencoded()); | |||
The (req.session.username) condition in index.js (as shown below) fails and it won’t consider the user logged in. | |||
o Function users (req, res) { | |||
o If(req.session.username){ | |||
o res/render (“account.jade”, {username: req.session.username, | |||
o title:”Account”, | |||
o loggedInUsers: loggedInUsers}); | |||
o } else { | |||
o res.redirect(“/?error=Not Logged In”); | |||
o } | |||
o }; |
Revision as of 23:26, 4 February 2014
Video from the lecture given on Jan 22, 2014 is now available from multiple sources:
- small at screencast.com (flash/mp4)
- large at screencast.com (flash/mp4)
- original at CUOL (mp4)
- original at homeostasis (mp4)
• To create an empty object we use:
o Var car = { speed: “slow”}; o Var tesla = object.create(car);
• To check the properties of the object:
o Tesla.speed o ‘slow’
• To assign a different value to the speed property:
o Tesla.speed = “fast”; o ‘fast’
• To assign a default value to a prototype object property:
o Car.colour = “white”; o ‘white’
• To check:
o Car o { speed: ‘slow’, colour: ‘white’ } o Tesla o { speed: ‘fast’ }
• Note that the object “tesla” does not have the property colour but its prototype has it.
o Object.getPrototypeOf(tesla); o { speed: ‘slow’, o colour: ‘white’ o wheels: 4 }
• Every object in JavaScript has a prototype that can be accessed by:
o Object.prototype
• Session-demo: • Different users have different sessions and the server knows about the different sessions. The server is keeping track of state per user that is logged in. • The state is representation of what is on the server but it is also a reflection of which session has been identified to the server. • HTTP is a stateless protocol. Stateless means that each request that goes to the browser is independent of every other request. • When you make a request, your browser does not only send URL. It also sends a request with a lot of other properties. This is also a part of the HTTP protocol.(Look under the “Header” tab of the “Network” section in the Firefox console).
• A User-Agent string is a part of the HTTP request. It is supposed to tell the server what kind of browser you are using. • A cookie is some bit of data that is sent somewhere and is expect to be returned later and is not to be processed or “eaten” by the other side. • Status code: every HTTP request that comes in to a server will generate a response code. (i.e. response code 200 means o.k. Response code 404 means page not found and 302 means page moved temporarily). • Node is a general web application execution platform. Express is a framework for it. • The following function takes ‘Comp 4106 rules!’ as a secret argument to encrypt the user session and to generate the valid cookies. The cookies must be made to be hard to reverse by others.
o app.use(express.cookieParser(‘Comp 2406 rules!’));
• The following function uses the cookie parser in order to maintain sessions. It is the session identifier. Every time we do a “get” a cookies comes along with it and the user is identified:
o app.use(express.session());
• Cookies can be specified with different life times. Some cookies are specified with session only life time. Some other cookies are specified to live for hours, days or years.
• /routes/Index.js:
• When the user enters the username, the incoming request has a session sub-object which is defined by the session layer of Express
• If the session object has a username as a property, the user is already logged in
o Function index (req, res) { o If (req.session.username){ o res.redirect(“/users”); o } else { o res.render(‘index’), { title: ‘COMP 2406 Session Demo’, o error: req.query.error }); o } o }
• In the following code we set the username variable by (req.session.username)
o Function login (req, res) { o Var username = req.body.username; o Req.session.username = username; o loggedInUsers [username] = LoggedIn; o res.redirect (“/users”) o }
• Note that the user name came from the req.body object. • (req.body.username) is a part of the form. • The form “post” sends the user name to the server (this can be viewed under the “params” tab of the “network” section in the console. • Next we save it to the session by
o Req.session.username = username;
• When you ever see a line like:
o Form (action=”/login” , method=”post”)
In /views/index.jade You should expect to see a corresponding route like:
o App.post(“/login”, routes.login); o App.post(“/logout”, routes.logout)
In app.js Otherwise there will be a 404 error (page not found).
• When deleting
o App.use(express.json());
Nothing really happens • When deleting
o App.use(express.urlencoded());
The (req.session.username) condition in index.js (as shown below) fails and it won’t consider the user logged in.
o Function users (req, res) { o If(req.session.username){ o res/render (“account.jade”, {username: req.session.username, o title:”Account”, o loggedInUsers: loggedInUsers}); o } else { o res.redirect(“/?error=Not Logged In”); o } o };