WebFund 2014W Lecture 5: Difference between revisions

From Soma-notes
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..."
 
Gkadri (talk | contribs)
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:


• 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	};