5.node js

55
Geun-Hyung Kim UMCL @ Dong-Eui University Introduction to Node.js

Transcript of 5.node js

Page 1: 5.node js

Geun-Hyung�Kim�

UMCL�@�Dong-Eui�University

Introduction to Node.js

Page 2: 5.node js

개�요Node.js�?

Server-side�framework��

useful�for�building�highly�scalable�and�fast�

network�applications

JavaScript�runtime�built�on�Chrome’s�V8�JavaScript�engine.�It�uses�an�event-driven,�non-blocking�I/O�model�that�makes�it�lightweight�and�efficient,�perfect�for�data-intensive�real-

time�applications�that�run�across�distributed�devices

developed�by�Ryan�Dahl�in�2009

Page 3: 5.node js

개�요Architecture

node�standard�library

node�bindings�(socket,�http,�etc.)

V8thread�pool�

(libeio)

event�loop�

(libev)

DNS�

(c-ares)

crypto�

(OpenSSL)

JavaScript C/C++

Page 4: 5.node js

개�요Brief�History

JavaScript’s�Speed�revolution�has�started�since�2008.

2008.�9:�Google�releases�Chrome�Web�browser�beta�version�based�on�V8�JavaScript�Engine

2009.�1:�ServerJS�project�(currentCommonJS�project)�started�to�use�

JavaScript�in�other�areas�except�Web�browser.

2009.�11:�Node.js�was�released�based�on�CommonJS�standard�and�V8�

JavaScript�Engine�(for�Linux)

2011.�5:�npm�(Node�Package�Manager)�1.0�was�released

2011.�7:�Node.js�for�Windows�was�released

2009.�3:�Node.js�had�a�name.

Page 5: 5.node js

개�요Why�Node.js?

<source:�modulecounts.com>

Node�packages�are�growing�faster�than�Ruby,�Python,�and�Java�combined

asynchronous,�event-driven�framework�

designed�for�creating�scalable�network�app.�

single-threaded��

uses�a�concurrency�model�based�on�an�event�loop�

non-blocking�with�callback�function:�handle�concurrent�operations�without�multiple�thread�of�execution�

no�buffering

ideal�for�I/O�bound�applications,�

but�not�so�great�for�CPU-heavy�

applications�

Page 6: 5.node js

개�요Event�based�Asynchronous

<현황> 각 상점에 가서 물건을 구매하기 위해서 대기를 기다려야 함. 한 상점 씩 다니면서 물건을 살 경우 27분이 소요된다.

Page 7: 5.node js

Event�based�Asynchronous

<해결책>

1. 몸을 복제하여 동시에 여러 가게에 간다. (thread 기반 동기방식)

2. 각 상점에서 대기표를 나누어주는 시스템을 바꾸고 대기표를 받고 기다린다. (이벤트 기반 비동기 방식)

Page 8: 5.node js

Sync.�vs.�Async.�I/O

fileRead(fileName)

1.�파일�읽기�요청

3.�파일�읽기�완료

2.�파일�읽는�중

Synchronous�I/O

Page 9: 5.node js

Sync.�vs�Async�I/O

fileRead(fileName,callback)

1.�파일�읽기�요청

4.�파일�읽기�종료�후

callback�함수�호출

3.�파일�읽는�중2.�바로�리턴

Asynchronous�I/O

Page 10: 5.node js

Installing Node.js

Page 11: 5.node js

InstallationOfficial�Node.js�website

https://nodejs.org/en/download/

�windows�installer�다운로드하여�설치

Page 12: 5.node js

InstallationVersion�Check�and�Start!

1.�version�check

2.�execute�node�(it�shows�Node�shell.)

3.�type�simple�code�to�prompt�“Hello�World”�to�the�console�

Node�shell�에서�빠져�나오는�방법:�Ctrl+d�

Page 13: 5.node js

Node�ProgramHello�World!

// helloworld.jsconsole.log(“Hello World”);

// execute helloworld.js $ node helloworld.js

Page 14: 5.node js

Server Programming

Page 15: 5.node js

HTTP�ServerTarget

로그인

id:�

pw:

login

geunkim Welcome�to�this�world

To�geunkim

http://localhost:8000/start http://localhost:8000/hello

Page 16: 5.node js

HTTP�Server

var http = require(“http”);

http.createServer(function (request, response) {response.writeHead(200, {“Content-Type”:”text/plain”});response.write(“Hello World!”);response.end();

}).listen(8000);console.log(“Http Server has been started”);

// server.js

// cmd terminal$ node server.js

// browser

http://localhost:8000

Simple�HTTP�Server�-�1

Page 17: 5.node js

HTTP�Server

var http = require(“http”);

function onRequest(request, response) { console.log(“Request Received”);response.writeHead(200, {“Content-Type”:”text/plain”});response.write(“Hello World!”);response.end();

}

http.createServer(onRequest).listen(8000);console.log(“Http Server has been started”);

// server1.js

Simple�HTTP�Server�-�2

Page 18: 5.node js

Node.js�has�a�simple�module�loading�system.�

module:�a�single�unit�of�code�which�encapsulates�related�codes�into.�

When�creating�a�module,�this�can�be�interpreted�as�moving�all�related�functions�into�a�file.�

In�Node.js,�files�and�modules�are�in�one-to-one�correspondence�(한�파일이�모듈이�하나..).�

Assign�an�expression�in�a�module�file,�that�we�want�to�become�available�in�other�files�to�the�exports�object.

making�a�user�moduleModule

<ref:�https://nodejs.org/api/modules.html#modules_modules>

Page 19: 5.node js

making�a�user�moduleExporting�a�Module

exports.sayHelloInEnglish = function() {return “HELLO”;};exports.sayHelloInSpanish = function() {return “Hola”;};

// greetings.js

exports.add = function(a, b) {return a+b;};exports.sub = function(a, b) {return a-b;};exports.mul = function(a, b) {return a*b;};exports.div = function(a, b) {return a/b;};

// calc.js

// circle.jsconst PI = Math.PI;exports.area = (r) => PI *r *r;exports.circumference = (r) => 2 *PI * r;

<ref:�https://nodejs.org/api/modules.html#modules_modules>

<ref:�https://www.sitepoint.com/understanding-module-exports-exports-node-js/>

Page 20: 5.node js

(info.)�The�keyword�require�is�used�in�Node.js�to�import�modules.

make�a�user�moduleImport�a�Module

var require = function(path){// …return module.exports;

}

require�module�files�in�your�js�file.

var greetings = require(“./greetings.js”);

access�the�publicly�available�methods�of�greetings.js

greetings.sayHelloInEnglish();

greetings.sayHelloInSpanish();

<ref:�https://www.sitepoint.com/understanding-module-exports-exports-node-js/�>

Page 21: 5.node js

import�calc.js

making�a�user�moduleImport�a�Module

import�circle.js

var calcObj = require(“./calc.js”);

var circle = require(“./circle.js”);

Page 22: 5.node js

When�a�file�is�run�directly�from�Node.js,�require.main�is�set�to�its�module.�

So,�developer�can�determine�if�a�file�has�been�run�directly�by�testing�

For�a�file�foo.js,��

this�will�be�true�when�it�run�via�node�foo.js.�

But,�this�will�be�false,�then�it�run�by�require(“./foo”)

making�a�user�moduleAccessing�the�main�module

<ref:�https://nodejs.org/api/modules.html#modules_modules>

require.main === module

Page 23: 5.node js

making�a�user�modulehttp�server�module

var http = require(“http”);

function start() {function onRequest(request, response) { console.log(“Request Received”);response.writeHead(200, {“Content-Type”:”text/plain”});response.write(“<h1>Welcome to HTTP Server !</h1>”);response.write(“<h2>Hello World..</h2>”);response.end();

}

http.createServer(onRequest).listen(8000);console.log(“Http Server has been started”);

}

exports.start = start;

// httpServer.js (version 1)

Page 24: 5.node js

making�a�user�moduleusing�http�server�module

var httpServer = require(“./httpServer”);

httpServer.start();

// index.js (version 1)

// execute index.js

$ node index.js

// browser

index.js

httpServer

start()

Page 25: 5.node js

Http�Server는�다양한�사용자�요청에�응답해야�함�

조회를�위한�요청,�저장을�위한�요청�등�다양한�요청을�식별하는�routing�

기능을�고려�

Router�

request�URL과�GET/POST�parameter에�따라�실행할�코드를�결정

Routing:�Dependency�Injection

Dependency�Injection

HTTP�요청에서�URL과�GET/POST�Parameter의�추출이�필요

이�정보는�어디에�있을까�?

Page 26: 5.node js

Routing:�url�parsingurl�and�query�parsing

http://localhost:8000/start?foo=bar&hello=world

url.parse(string).pathname

querystring.parse(string)[“foo”]

url.parse(string).query

querystring.parse(string)[“hello”]

request.url

require�“url”�module

require�“querystring”�module

Page 27: 5.node js

Routing:�url�parsing

http://localhost:8000/start?foo=bar&hello=world

parsing�results:

url�and�query�parsing

Page 28: 5.node js

Routing:�url�parsingrequest�url

var http = require(“http”);var url = require(“url”);

function onRequest(request, response) {console.log(request.url); response.writeHead(200, {“Content-Type”:”text/plain”});response.write(“Hello World!”);response.end();

}

http.createServer(onRequest).listen(8000);console.log(“Http Server has been started”);

// httpServer.js (version 1-1)

Page 29: 5.node js

Routing:�pathname�parsingpathname�parsing

var http = require(“http”);var url = require(“url”);

function start() {function onRequest(request, response) { var pathname = url.parse(request.url).pathname; console.log(“Request for ” + pathname + “ received.”);response.writeHead(200, {“Content-Type”:”text/plain”});response.write(“<h1>Welcome to HTTP Server !<h1>”);response.write(“<h2>Hello World..<h2>”);response.end();

}http.createServer(onRequest).listen(8000);console.log(“Http Server has been started”);

}

exports.start = start;

//httpServer.js (version 2)

Page 30: 5.node js

Routing:�router�modulesimple�router

function route(pathName) {console.log(“about to route a request for “ + pathName);

}

exports.route = route;

// router.js (version 1)

index.js

httpServer

start()

router

route()inject function

index.js에서�router�module을�로딩하고�route()함수를�httpServer에�전달하여�실행하는�구조

Dependency�Injection

server�코드�변경없이�router�함수�교체가�가능

Page 31: 5.node js

Routing:��router

var httpServer = require(“./httpserver”);var router = require(“./router”);

httpServer.start(router.route);

// index.js (version 2)

index.js�with�router

server.js�는�start()�실행�시�route�함수를�전달하여��

‘request’�이벤트가�발생할�때�마다�route()�함수를�호출하여�

클라이언트�요청을�식별

Page 32: 5.node js

Routing:�router

var http = require(“http”);var url = require(“url”);

function start(route) {function onRequest(request, response) { var pathname = url.parse(request.url).pathname; console.log(“Request for ” + pathname + “ received.”); route(pathname); // injected function callresponse.writeHead(200, {“Content-Type”:”text/plain”});response.write(“<h2>Hello World..<h2>”);response.end();

}http.createServer(onRequest).listen(8000);console.log(“Http Server has been started”);

}exports.start = start;

//httpServer.js (version 3)

httpServer�with�router

Page 33: 5.node js

Server:�receives�client’s�request�

Router:�route�the�client’s�request�to�the�request�handler�

Request�Handler:�process�the�client’s�specific�request

Routing:�Request�HandlerRequest�Handler

index.js

httpServer

start()

router

route()inject function

request�Handler

handle

Page 34: 5.node js

Routing:�Request�HandlerRequest�Handler�//requestHandlers.js (version 0)

function start() {console.log(“Request handler ‘start’ was called”);return “Welcome Start Page”;

}

function hello() {console.log(“Request handler ‘hello’ was called”);return “Welcome Hello Page”;

}

exports.start = start; //export startexports.hello = hello;

Page 35: 5.node js

Routing:�Request�HandlerRequest�Handler�//requestHandlers.js (version 1)

function start() {console.log(“Request handler ‘start’ was called”);return “Welcome Start Page”;

}

function hello() {console.log(“Request handler ‘hello’ was called”);return “Welcome Hello Page”;

}

var handle = {};handle[“/“] = start;handle[“/start”] = start;handle[“/hello”] = hello;

exports.handle = handle; //export JavaScript Object

Page 36: 5.node js

Routing:�Request�Handlerindex.js�with�request�handler

var httpServer = require(“./httpserver”);var router = require(“./router”);var requestHandlers = require(“./requestHandlers”);

httpServer.start(router.route, requestHandlers.handle);

// index.js (version 3)

start()�실행�시�route�함수와�handler�객체를�전달하고�

‘request’�이벤트가�발생할�때�마다��

handler�객체를�route()�함수에�전달하여�호출하여��

클라이언트의�요청을�식별하고�해당�기능�수행

Page 37: 5.node js

Routing:�Request�Handlerrouter.js�with�request�handler

function route(handle, pathName) {console.log(“about to route a request for “ + pathName);if (typeof handle[pathName] === ‘function’) {return handle[pathName]();

} else {console.log(“No request handler found for “ + pathName);return “404 Not Found”;

}}

exports.route = route;

// router.js (version 2)

요청(pathName)�별로�다른�함수를�호출�

Page 38: 5.node js

Routing:�Request�Handler

//httpServer.js (version 4)

httpServer�with�router

var http = require(“http”);var url = require(“url”);

function start(route, handle) {function onRequest(request, response) { var pathname = url.parse(request.url).pathname; console.log(“Request for ” + pathname + “ received.”);var content = route(handle, pathname); response.writeHead(200, {“Content-Type”:”text/plain”});response.write(content);response.end();

}http.createServer(onRequest).listen(8000);console.log(“Http Server has been started”);

}exports.start = start;

construct�response�message�with�return�value�of�request�handler

Page 39: 5.node js

Routing:�BlockingFrom�request�to�response

HTTP�Server

Router

Request�Handlers

request

url�forwarding

invoke�handler

response

return�result

return�result

Problem:�Request�Handler’s�processing�time�may�degrade�the�performance�of�HTTP�Server.

Page 40: 5.node js

Routing:�BlockingPerformance//requestHandlers.js (version 1-1)

function start() {console.log(“Request handler ‘start’ was called”);

function sleep(msecs) {var startTime = new Date().getTime();while(new Date().getTime() < startTime + msecs);

}

sleep(10000); // 10 sec waiting

return “Welcome Start Page”;}

Server�waits�util�this�function�returns.�

This�makes�the�response�delay�of�other�request.

Page 41: 5.node js

Routing:�Non�BlockingFrom�request�to�response

HTTP�Server

Router

Request�Handlers

request

pass�response�object

pass�response�object

response

Each�request�handler�sends�the�response�message�individually.�

Page 42: 5.node js

Routing:�Non�BlockinghttpServer�with�non-blocking//httpServer.js (version 5)

var http = require(“http”);var url = require(“url”);

function start(route, handle) {function onRequest(request, response) { var pathname = url.parse(request.url).pathname; console.log(“Request for ” + pathname + “ received.”);route(handle, pathname, response);

}http.createServer(onRequest).listen(8000);console.log(“Http Server has been started”);

}exports.start = start;

Page 43: 5.node js

function route(handle, pathName, response) {console.log(“about to route a request for “ + pathName);if (typeof handle[pathName] === ‘function’) {handle[pathName](response);

} else {console.log(“No request handler found for “ + pathName);response.writeHead(404, {“Content-Type”:”text/plain”});response.write(“404 Not Found”);response.end();

}}

exports.route = route;

// router.js (version 3)

Non�blocking�router

Page 44: 5.node js

View�LogicView�logic�for�POST//start function in requestHandlers.js (version 2)

function start(response) {console.log(“Request handler ‘start’ was called”);

var body = “<html><head><title>First View</title>”+“<meta charset=‘UTF-8’></head><body>“ +“로그인</br>”+“<form action=‘/hello’ method=‘post’>” +“id: <input type=‘text’ name=‘id’></input>”+“ <input type=‘submit’ value=‘login’/></br>”+“pw: <input type=‘text’ name=‘pw’></input>”+“</form></body></html>”;

response.writeHead(200, {“Content-Type”:”text/html”});response.write(body);response.end();

}

Page 45: 5.node js

POST�data�receivingAsynchronous�Data�receiving

request.addListener(“data”, function(chunk) { // called when a new chunk of data was received}

request.addListener(“end”, function() { // called when all chunks of data has been received}

Page 46: 5.node js

POST�data�receivinghttpServer�with�POST

function onRequest(request, response) { var postData =“”; var pathname = url.parse(request.url).pathname; console.log(“Request for ” + pathname + “ received.”);

request.setEncoding(“utf8”);request.addListener(“data”, function(chunk) {postData += chunk;

});

request.addListener(“end”, function() {route(handle, pathname, response, postData);

}); }

//onRequest function in httpServer.js (version 6)

Page 47: 5.node js

POST�data�receiving

function route(handle, pathName, response, postData) {console.log(“about to route a request for “ + pathName);if (typeof handle[pathName] === ‘function’) {handle[pathName](response, postData);

} else {console.log(“No request handler found for “ + pathName);response.writeHead(404, {“Content-Type”:”text/plain”});response.write(“404 Not Found”);response.end();

}}

exports.route = route;

Router�with�POST

// router.js (version 4)

Page 48: 5.node js

Pass�POST�data��to�the�Client

Request�handler�with�POST

function hello(response, postData) {console.log(“Request handler ‘hello’ was called”);var out = “To “ + querystring.parse(postData)[“id”];response.writeHead(200, {“Content-Type”:”text/plain”});response.write(out);response.write(“</br> Welcome to this World”);response.end();

}

//requestHandlers.js (version 3)

Page 49: 5.node js

GET�data�receivinghttpServer�with�GET

function onRequest(request, response) { var getData =“”; var pathname = url.parse(request.url).pathname; console.log(“Request for ” + pathname + “ received.”); getData += url.parse(request.url).query; route(handle, pathname, response, getData); }

//onRequest function in httpServer.js (version 7)

Page 50: 5.node js

GET�data�receiving

function route(handle, pathName, response, getData) {console.log(“about to route a request for “ + pathName);if (typeof handle[pathName] === ‘function’) {handle[pathName](response, getData);

} else {console.log(“No request handler found for “ + pathName);response.writeHead(404, {“Content-Type”:”text/plain”});response.write(“404 Not Found”);response.end();

}}

exports.route = route;

Router�with�GET

// router.js (version 4)

Page 51: 5.node js

View�LogicView�logic�for�GET//start function in requestHandlers.js (version 3)

function start(response) {console.log(“Request handler ‘start’ was called”);

var body = “<html><head><title>First View</title>”+“<meta charset=‘UTF-8’></head><body>“ +“로그인</br>”+“<form action=‘/hello’ method=‘get’>” +“id: <input type=‘text’ name=‘id’></input>”+“ <input type=‘submit’ value=‘login’></br>”+“pw: <input type=‘text’ name=‘pw’></input>”+“</form></body></html>”;

response.writeHead(200, {“Content-Type”:”text/html”});response.write(body);response.end();

}

Page 52: 5.node js

Pass�GET�data��to�the�ClientRequest�handler�with�GET

function hello(response, getData) {console.log(“Request handler ‘hello’ was called”);var out = “To “ + querystring.parse(getData)[“id”];response.writeHead(200, {“Content-Type”:”text/plain”});response.write(out);response.write(“</br> Welcome to this World”);response.end();

}

//requestHandlers.js (version 4)

Page 53: 5.node js

Node:�AppendixWho�uses�Node�?

Page 54: 5.node js

E-Commerce�

Payment�Processing�

Social�Media�

Realtime�Services�

Media�Applications�

Enterprise�Services�

Node:�AppendixApps�suited�for�Node.js

Page 55: 5.node js

Node.js:�Hello로�시작하는�Web�애플리케이션��

http://www.nextree.co.kr/p8574/�

The�Node�Beginner�Book�

Simona�Clapan,�“The�MEAN�stack�-�SoCalCodeCamp�-�june�29th�2014”�from�slidehsare

References