如果你真想用node做服務器來開發項目，我的建議是你在看完啟航文檔后就可以去搞express或者它的下一版本KOA了，因為用原生的來開發實在太晦澀（慢）了，這不是noder的風格。
如果你還是想深入的了解，可以往下看，我給諸位準備了個小DEMO，希望對你有幫助。
項目名稱：用戶登錄系統
項目簡述：項目包含首頁和登錄頁面，用戶點擊首頁的登錄按鈕跳轉到登錄頁面，填寫用戶名和密碼，點擊確認按鈕，如果正確則提示登錄成功，并跳轉到首頁，如果失敗則提示登錄失敗。
項目架構 原生nodejs
- 首先創建倆頁面index.html 和 login.html(放在template文件夾下),如下(好裸，但說的是原理，相看好看的可以看HTML/CSS文集，里面會持續跟新很多漂亮的布局和頁面效果)
<!--index.html-->
<!DOCTYPE>
<html>
<meta charset='utf-8'><!--否則中文亂碼-->
<body>
<button onclick = 'javascript:location.href="/login"'></button>
</body>
</html>
<!--login.html-->
<!DOCTYPE>
<html>
<meta charset='utf-8'>
<body>
<form>
<input type='text' id='name'/>
<input type='password' id='pwd'/>
<input type='button' value='提交' id='submit'/>
</form>
<script type='text/javascript'>
//使用原生ajax提交表單。項目很小，就不用框架了（IE5-6會有問題）
var _submit = document.getElementById('submit');
_submit.onclick = function(){
var _name = document.getElementById('name').value;
var _pwd = document.getElementById('pwd').value;
var _req = new XMLHttpRequset();
_req.open('POST','/checkLogin');
_req.send('name='+_name+'&pwd='+_pwd);
_req.onreadystatechange = function(){
if(_req.readyState == 4 && _req.status === 200){
if(_req.responseText == '0'){
alert('登錄成功！');
location.href='/';
}else if(_req.responseText == '1'){
alert('帳號或密碼錯誤，請重試');
}
}
}
}
</script>
</body>
</html>
- 修改我們寫過的file.js文件
'use strict' //這一行是ES6下為防止不兼容加的
var fs = require('fs');
function resHtml=function(htmls){
return fs.readFileSync(htmls); //注意這里用阻塞方式讀取頁面文件，不然會報錯。
}
module.exports = resHtml;
- 為了防止中途會出現什么bug，我們先修改下index.js來看下效果
'use strict'
var resHtml = require('./file'); //引入我們自己的模塊
var http = require('http');
http.createServer(function(req,res){
res.writeHead(200,{'Content-Type':'text/html'}); //注意這里將text/plain 改成了text/html 這是定義輸出的文本格式
res.write(resHtml('template/index.html')); //通過模塊接口拿到數據
res.writeEnd(); //回執結束
}).listen(3000) //監聽3000的端口
運行服務器并在瀏覽器中查看，看是否輸出頁面，如果到這里沒有問題請繼續往下走，如果有看報錯然后修改。
創建路由文件route.js
function route(path){
console.log('path:'+path);
}
//這里我們什么也沒有做，只是為了讓大家看得更清除
exports.route = route;
- 修改index.js文件
'use strict'
var resHtml = require('./file');
var http = require('http');
var route = require('./route');
var url = require('url');
http.createServer(function(req,res){
var path = url.parse(req.url).pathname; //獲取訪問路徑并格式化;
route.route(path);
res.writeHead(200,{'Content-Type':'text/html'});
res.write(resHtml('template/index.html'));
res.writeEnd();
}).listen(3000);
- 運行服務器并在瀏覽器中查看，在地址欄中輸入不同的路由，然后看控制臺上的輸出。有的會有兩個（比如根目錄會是 / 和 /favicon.ico，這無關緊要，我們取數組的第一個元素）
現在開始加速開發了
- 更改index.js
'use strict'
var resHtml = require('./file');
var http = require('http');
var route = require('./route');
var url = require('url');
http.createServer(function(req,res){
route.route(req,res);
}).listen(3000);
- 更改route.js
var Controller = require('./controller');
var controller = new Controller;
function route(req,res){
var path = url.parse(req.url).pathname; //獲取訪問路徑并格式化;
switch(path){
case '/':
controller.home(res);
break;
case '/login':
controller.login(res);
break;
case '/checkLogin':
constroller.checkLogin(req,res);
break;
default:
break;
}
}
exports.route = route;
- 創建 controller.js文件，并修改如下
//這個東西不贅述，不懂的看js的進階文集，里面有講
var resHtml = require('./file')
function controller(){
this.home = function(res){
res.writeHead(200,{'Content-Type':'text/html'});
res.write(resHtml('template/index.html'));
res.writeEnd();
}
this.login = function(res){
res.writeHead(200,{'Content-Type':'text/html'});
res.write(resHtml('template/index.html'));
res.writeEnd();
}
this.checkLogin(req,res){
//TODO;
}
}
module.controller = controller;
至此，你運行服務器在瀏覽器中可以操作了，從 / 跳轉到 /login;同時基本的框架分層也清晰了。當然，如果真正用它來搞，還需要很多工作要做，比如里面好多writeHead的重復啊，路由書寫的不美觀等。如果你是個技術發燒友，可以自己去搞了。
下面我們針對controller中的checkLogin來搞
var qs = require('querystring'); //字符串序列化模塊
// ... ...
this.checkLogin(req,res){
var postString = '';
req.on('data',function(chunk){ //node不會自動解析請求體，需要手動搞;
postString+=chunk;
})
req.on('end',function(){
var postJson = qs.parse(postString); //序列化為post請求格式
if(postJson.name == 'bob' && postJson.pwd == 'lisa'){
res.writeHead(200,{'Content-Type':'text/plain'});
res.write('0');
res.writeEnd();
}
else{
res.writeHead(200,{'Content-Type':'text/plain'});
res.write('1');
res.writeEnd();
}
})
}
運行你的項目吧～
至此，這個簡單的demo就完成了！
