Hello node.js - win7中的nodejs(1) 安裝篇至hello world

本文提供了在windows 7系統下安裝node.js、express以及簡易的npm操作及部分範例實作。

Node.js是一個事件驅動I/O伺服端JavaScript環境，基於Google的V8引擎。目的是為了提供撰寫可擴充網路程式，如Web服務。

引自維基百科node.js

一、安裝

nodejs

NODEJS官方網站下載
下載後進行安裝即可，安裝時，所有元件都要安裝，別漏掉了。

安裝完後，以系統管理員開啟"Node.js command prompt"(以下簡稱cmd)，輸入node -h應會看到以下畫面

若否，則執行以下語法，將node加入path中 以下語法為預設安裝路徑，若安裝時有更改路徑，要調整路徑參數

SET PATH=C:\Program Files\Nodejs;%PATH%

輸入npm應會看到以下畫面

若否，則執行以下語法，將npm加入path中 以下語法為預設安裝路徑，若安裝時有更改路徑，要調整路徑參數

SET PATH=C:\Program Files\Nodejs;%PATH%

到這邊，已經安裝完nodejs了。

express

在cmd中，輸入npm install express安裝express，應會看到安裝成功的畫面

若否，則執行以下語法，進行自我簽證設定，再重新安裝

npm install npm -g --ca=""

ejs

由於express精簡了很多，因此大多數的middlewire都要另外安裝，ejs是express的"VIEW"
在cmd中，輸入npm install ejs安裝ejs

body-parser

body-parser擴充了express的request.body參數，讓他可以接受ajax的post資料
在cmd中，輸入npm install body-parser安裝body-parser

二、node with express

Hello World

server js: todolistajax.js

var express = require('express');//載入express模組
var app = express();//初始化
app.get('/',function(req,res){ //設定ROUTER首頁的處理函式
    res.json({isSuccess:true, test:"Hello World"});//回傳JSON
});
app.listen(8000);
console.log('server on ...');

執行node todolistajax.js，在瀏覽器輸入127.0.0.1:8000進行瀏覽
執行結果

重點摘要：

載入模組使用require關鍵字
express要設定router方可看到
express可以回傳許多格式，會幫你設定HEADER
利用app.listen可以設定要監聽的阜號
console.log可以將結果輸出在cmd視窗

ejs

server js: todolistajax.js

var express = require('express');//載入express模組
var app = express();//初始化
app.get('/',function(req,res){//設定ROUTER首頁的處理函式
    res.render('todolistajax.ejs',{text: "Hello World"});//回傳ejs內容
});
app.listen(8000);
console.log('server on ...');

server ejs: \views\todolistajax.ejs
ejs預設要放在要執行的js那層中的views資料夾內

<!DOCTYPE html>
<html>
<head>
<title>TodoList</title>
</head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<body>
    <div id="todolistajax"><%= text %><</div>
  </body>
</html>

執行node todolistajax.js，在瀏覽器輸入127.0.0.1:8000進行瀏覽
執行結果

重點摘要：

ejs是express的view
利用render可以將處理過後的ejs作為html回傳給client
render的第二個參數可以將資料傳入view
<% %>可以在裡面輸入程式
<% =xxx %>會將結果xxx輸出

Request

從SERVER向指定網址請求資料有很多方法，這邊使用HTTP模組來進行範例練習
server js: todolistajax.js

var express = require('express');
var http = require('http');
var app = express();
app.get('/test',function(req,res){  
     res.send('hello world');
});
app.get('/',function(req,res){  
    var options = {
        host: '127.0.0.1', 
        port: 8000, 
        path: '/test', 
        method: 'GET'
    };
    var request = http.request(options, function(response){
        response.setEncoding('utf8');
        response.on('data', function(data){
            res.render('hello.ejs',{text: data});
        });
    });
    request.end();
});
app.listen(8000);
console.log('server on ...');

server ejs: \views\todolistajax.ejs
ejs預設要放在要執行的js那層中的views資料夾內

<!DOCTYPE html>
<html>
<head>
<title>TodoList</title>
</head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<body>
    <div id="todolistajax"><%= text %><</div>
  </body>
</html>

執行node todolistajax.js，在瀏覽器輸入127.0.0.1:8000進行瀏覽
執行結果

重點摘要：

http模組可以向指定網址進行請求，也還有其他功能，請參照HTTP
不管用哪種模組，發送請求時通常都要提供[目標網址HOST]、[目標網址阜號]、[路徑]、[方法(get,post,delete...)]
http回傳的response會觸發data事件，監聽data事件並給予callback以在收到資料時可以進行處理，response的其他事件
response屬於readable stream，readable stream的詳細

Request Post Data

express若要使用POST發送資料出去的話，要載入模組body-parser
先至cmd安裝body-parsernpm install body-parser
server js: todolistajax.js

var express = require('express');
var http = require('http');
var app = express();
var bodyParser = require('body-parser');
app.use(bodyParser.urlencoded({ extended: true }));
app.post('/saveItem',function(req,res){
    var itemID = req.param('itemID');
    var itemText = req.param('itemText');
    var pdata = {};
    pdata.member = 'luki';
    pdata.itemText = itemText;
    pdata = JSON.stringify(pdata);
    var options = {
        host: '192.168.11.86', 
        port: 8000, 
        path: '/v1/todo/' + itemID, 
        method: 'POST',
        headers: {
            'Content-Type': 'application/json',
            'Content-Length': Buffer.byteLength(pdata)
        }
    };
    var request = http.request(options, function(response){
        response.setEncoding('utf8');
        response.on('data', function(data){
            res.json({isSuccess:true, message:data});
        });
    });
    request.write(pdata);
    request.end();
});
app.listen(8000);
console.log('server on ...');

server ejs: \views\todolistajax.ejs
ejs預設要放在要執行的js那層中的views資料夾內

<!DOCTYPE html>
<html>
<head>
<title>TodoList</title>
</head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<body>
    <div id="todolistajax"><%= text %><</div>
  </body>
</html>

重點摘要：