本系列寫下去唯一的理由是給像博主一樣頭腦簡單記不住Express使用方法的菜鳥們，但是會假定菜鳥們熟悉JavaScript,node.js基本使用方法,以及ASP.Net MVC。我會嘗試在例子中加一些與ASP.Net MVC的對應知識點，但願可以幫助理解而不是幫倒忙
自學能力強的菜鳥可以移步https://github.com/visionmedia/express，下載源碼自學。例子就在根目錄下的Examples中。編譯之前記得在根目錄中輸入 npm install以初始化運行環境。
對於例子中使用到的Express方法，請移步http://expressjs.com/api.html，里面是Express的API
1.Hello World！
入門怎么少的了Hello World
View Code
1 var express = require('http://www.cnblogs.com/');//引入express包 2 3 var app = express();//創建express實例 4 5 //路由 6 //下面的方法響應缺省“/”的get請求 7 //req,res是不是看得特別眼熟？ 8 app.get('/', function(req, res){ 9 res.send('Hello World'); 10 }); 11 12 app.listen(3000);//設置監聽http請求的端口號 13 console.log('Express started on port 3000');
訪問www.localhost:3000.com 可以看到服務器直接返回的字符串 “Hello World！”（類似mvc中的 return Content("hello world!")）
2.EJS模板+后台傳參到前台+分布視圖
可以從服務器端直接返回字符串了，那該怎么顯示好看的html頁面呢？別着急，下面就是Express常用的視圖模板EJS。看完了下面的例子，你應該學會如何返回html頁面，如何向前台html頁面傳遞參數以及寫html頁的好幫手——分布視圖的
使用方法
后台node的代碼
View Code
1 var express = require('http://www.cnblogs.com/'); 2 3 var app = module.exports = express(); 4 5 //注冊ejs模板為html頁。簡單的講，就是原來以.ejs為后綴的模板頁，現在的后綴名可以//是.html了 6 app.engine('.html', require('ejs').__express); 7 8 //設置視圖模板的默認后綴名為.html,避免了每次res.Render("xx.html")的尷尬 9 app.set('view engine', 'html'); 10 11 //設置模板文件文件夾,__dirname為全局變量,表示網站根目錄 12 app.set('views', __dirname + '/views'); 13 14 var users = [ 15 { name: 'tobi', email: 'tobi@learnboost.com' }, 16 { name: 'loki', email: 'loki@learnboost.com' }, 17 { name: 'jane', email: 'jane@learnboost.com' } 18 ]; 19 20 app.get('/', function(req, res){ 21 //向頁面模板傳遞參數，可以傳遞字符串和對象，注意格式 22 res.render('users', { 23 users: users, 24 title: "EJS example", 25 header: "Some users" 26 }); 27 }); 28 29 if (!module.parent) { 30 app.listen(3000); 31 console.log('Express app started on port 3000'); 32 }
前台html的代碼
View Code
1 //user.html 2 3 <% include header.html %> 4 5 <h1>Users</h1> 6 <ul id="users"> 7 <% users.forEach(function(user){ %> 8 <li><%= user.name %> <<%= user.email %>></li> 9 <% }) %> 10 </ul> 11 12 <% include footer.html %> 13 14 //header.html 15 <!DOCTYPE html> 16 <html lang="en"> 17 <head> 18 <meta charset="utf-8"> 19 <title> <%= title %> </title> 20 <style type="text/css"> 21 body { 22 padding: 50px; 23 font: 13px Helvetica, Arial, sans-serif; 24 } 25 </style> 26 </head> 27 <body> 28 29 //footer.html 30 </body> 31 </html>
熟悉mvc的同學肯定看出來了，這不跟mvc那一套差不多嘛！ 路由(Router)找到相關處理方法，方法(Controller)中要么直接返回字符串(return Content())，要么將數據傳遞給視圖引擎(return View())，由視圖引擎展示數據。
可是仔細看看，還不是mvc，因為現在的這些代碼結構不清晰，還沒有分層次，下一篇中，咱們將看到express mvc的搭建
本系列使用的操作系統為ubuntu，Node版本為0.10.0，Express版本為3.2.0，ejs版本為0.8.3，目前基本最新的版本了基本都是