第一次看完 Node 入門,心裡只有驚呼!!哇!!但是對整個程式碼,並沒有很清楚,只殘留驚呼。於是,開始動起手來整理整個程式碼。希望能加深自己的印象。
1.第一個程式HelloWorld.js
檔名:HelloWorld.js
內容:console.log('Hello World');
2.一個完整的Node.js的Web應用
目標:
.用戶可以透過瀏覽器使用我們的應用。
.當用戶請求http://domain/start時,可以看到一個歡迎頁面,頁面上有一個檔案上傳的表
單。
.用戶可以選擇一個圖片並送出表單,隨後檔案將被上傳到 http://domain/upload,該頁
面完成上傳後會把圖片顯示
(1)一個基礎的http伺服器腳本
檔名:server.js
內容:
var http = require('http');
http.createServer(function(request,response){
console.log('Request received.');
response.writeHead(200,{'Content-Type':'text/plain'});
response.write('Hello World');
response.end();
}).listen(8888);
console.log('Server has started');
(2)一個基礎的http伺服器腳本(不同寫法)
檔名:server.js
內容:
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(8888);
console.log('Server has started');
(3)一個基礎的http伺服器腳本放進函數start(),並
匯出函數start()
檔名:server.js
內容:
var http = require('http');
function start() {
http.createServer(function(request,response){
console.log('Request received.');
response.writeHead(200,{'Content-Type':'text/plain'});
response.write('Hello World');
response.end();
}).listen(8888);
console.log('Server has started');
}
exports.start = start;
檔名:index.js
內容:
var server = require('./server');
server.start();
(4)一個基礎的http伺服器腳本(不同寫法)放進函數start(),並
匯出函數start()
檔名:server.js
內容:
var http = require('http');
function start() {
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(8888);
console.log('Server has started');
}
exports.start = start;
檔名:index.js
內容:
var server = require('./server');
server.start();
3.路由
(1)能找出瀏覽器請求的URL路徑的http伺服器腳本,並匯出函數start(),再加入加入路由
檔名:server.js
內容:
var http = require('http');
var url = require('url');
function start(
route) {
http.createServer(function(request,response){
var pathname = url.parse(request.url).pathname;
console.log('Request received.');
route(pathname);
response.writeHead(200,{'Content-Type':'text/plain'});
response.write('Hello World');
response.end();
}).listen(8888);
console.log('Server has started');
}
exports.start = start;
路由擴充到index.js
檔名:index.js
內容:
var server = require('./server');
var router = require('./router');
server.start(
router.route);
檔名:router.js
內容:
function route(pathname) {
console.log('About to route a request for' + pathname);
}
exports.route = route;
(2)能找出瀏覽器請求的URL路徑的http伺服器腳本(不同寫法),並匯出函數start(),再加入加入路由。
檔名:server.js
內容:
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 received.');
route(pathname);
response.writeHead(200,{'Content-Type':'text/plain'});
response.write('Hello World');
response.end();
}
http.createServer(onRequest).listen(8888);
console.log('Server has started');
}
exports.start = start;
路由擴充到index.js
檔名:index.js
內容:
var server = require('./server');
var router = require('./router');
server.start(
router.route);
檔名:router.js
內容:
function route(pathname) {
console.log('About to route a request for' + pathname);
}
exports.route = route;
(3)新增請求處理程序requestHandlers 模組,並匯出 start()、upload()。
檔名:
requestHandlers.js
內容:
function start() {
console.log("Request handler 'start' was called.");
}
function upload() {
console.log("Request handler 'upload' was called.");
}
exports.start = start;
exports.upload = upload;
(4)將
requestHandlers 模組,引入到 index.js 中:
檔名:index.js
內容:
var server = require('./server');
var router = require('./router');
var requestHandlers = require('./requestHandlers');
var handle = {}
handle['/'] = requestHandlers.start;
handle['/start'] = requestHandlers.start;
handle['/upload'] = requestHandlers.upload;
server.start(router.route,handle);
(5)將
requestHandlers 模組,當成參數傳遞給伺服器。
檔名:server.js
內容:
var http = require('http');
var url = require('url');
function start(route,handle) {
http.createServer(function(request,response){
var pathname = url.parse(request.url).pathname;
console.log('Request received.');
route(handle,pathname);
response.writeHead(200,{'Content-Type':'text/plain'});
response.write('Hello World');
response.end();
}).listen(8888);
console.log('Server has started');
}
exports.start = start;
或者
檔名:server.js (不同寫法)
內容:
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 received.');
route(handle,pathname);
response.writeHead(200,{'Content-Type':'text/plain'});
response.write('Hello World');
response.end();
}
http.createServer(onRequest).listen(8888);
console.log('Server has started');
}
exports.start = start;
(6)將requestHandlers 模組,當成參數傳遞給路由。
檔名:
router.js
內容:
function route(handle,pathname) {
console.log('About to route a request for' + pathname);
if (typeof handle[pathname] === 'function') {
handle[pathname]();
} else {
console.log('No request handler found for ' + pathname);
}
}
exports.route = route;
(7)
另外,阻塞處理與非阻塞處理程式碼範例
檔名:testBlock.js
/*阻塞處理*/
function testok01() {
var st01 = new Date().getTime();
while (new Date().getTime() < st01 + 3000);
}
testok01();
console.log("testok01 finish!!");
console.log("Block !!");
檔名:testNonBlock.js
/*非阻塞處理*/
function testok01(ok) {
setTimeout(() => {
ok();
},3000);
}
testok01(function () {
console.log("testok01 finish!!");
});
console.log("NonBlock !!");
資料來源:
1.
Node 入門
2.
<<Node 入門>>學習
3.
04★Node.js学习★非阻塞处理好难懂
4.
Callback(回調)
5.
同步(Synchronous)、異步(Asynchronous)、阻塞(Block)、非阻塞(Non-block)