npm init
npm install —save express
創建.gitignore 存放 node_modules .DS_Store
var express = require(‘express’);
var app = express();
app.set(‘port’, process.env.PORT || 3000);
app.get(‘/‘, function(req, res){
res.type(text/plain)
res.status(200);
res.render(‘index’, {})
})
//定制404頁面
app.use(function(req, res){
res.type(‘text/plain’);
res.status(404);
res.send(‘404 - Not Found’);
})
//定制500頁面
app.use(function(err,?req, res, next){
console.error(err.stack);
res.type(‘text/plain’);
res.status(500);
res.send(‘500 - Server Error’);
})
app.listen(app.get(‘port’, function(){
console.log(‘Express started onhttp://localhost:'+
app.get(‘port’);
})
handlebars 視圖引擎
var app = express();
var handlebars = require(‘express3-handlebars’)
.create({defaultLayout:?‘main’});//默認布局
app.engine(‘handlebars’, handlebars.engine);
app.set(‘view engine’,?‘handlebars’);
創建views > layouts布局目錄
視圖引擎會默認返回text/html的內容類型和200狀態碼
static中間件可以將一個或多個目錄指派為包含靜態資源的目錄，可以不經過處理直接發送到客戶端。
如圖片、CSS文件、客戶端javascript等
創建對外開放的public目錄
app.use(express.static(__dirname +?‘/public’));
給所有靜態文件創建了路由 直接引用，忽略路徑public
如：/img/logo.png
創建模塊
var fortune = require(‘./lib/fortune.js’);
app.get(‘/about’, function(req, res) {
res.render(‘about’, { fortune: fortune.getFortune() });
}）
請求體，get無請求主體內容
post請求常見媒體類型application/x-www-form-urlendcoded
文件類型multipart/form-data
ajax請求 application/json
req.query 查詢字符參數
req.body post請求參數 ?req.body.name 必須引入中間件body-parser
req.route當前匹配路由信息
req.cookies/req.singnedCookies
req.headers
req.accepts([type])確定是否接受一個或一組指定的類型
req.ip 客戶端IP地址
req.path 請求路徑（不包含協議，主機，端口或查詢字符串）
req.xhr 是否由Ajax發起
req.url
響應對象
res.status(code)
res.set(name, value) 設置響應頭
res.cookie(name, value, [options]), res.clearCookie(name, [options])設置或清除客戶端cookies值
res.redirect([status], url) 303
res.send(body) res.send(status, body)向服務器發送響應及可選的狀態碼
默認內容類型是text/html, 若修改需在res.send前 res.set(‘Content-Type’,’text/json’)
若body是對象或數組，響應將會以json形式發送（建議直接用res.json)
res.json(json) res.json(status, json)
res.jsonp(json) res.jsonp(status,json)
res.type(type)設置Content-Type 頭信息
res.format(object)允許根據接收請求報頭發送不同的內容
res.attachment([filename]) res.download(path, [filename], [callback])
res.sendFile(path, [option], [callback])
res.locals 對象，包含用于渲染視圖默認上下文
res.render（view, callback) 配置模板引擎的渲染視圖
app.post(‘/process-contact’, function(req, res) {
console.log(req.body.name);
console.log(req.body.email);
try {
//保存到數據庫
return res.xhr ? res.render({success: true}) : res.redirect(303,?‘/thank-you’);
} catch(er) {
return res.xhr ? res.json({ error:?‘database error.’ }) : res.redirect(303,?‘/database-error’)
}
})
指定不同的模板或不使用布局
app.get(‘/foo’, function(req, res) {
res.render(‘foo’, {layout: null}) 或{layout:?‘microsite’}
}
局部文件
創建views/partials子目錄，創建文件名稱如weather, 于是上下文名稱為partials.weather
在入口文件中，添加中間件
app.use(function(req, res, next) {
if(!res.locals.partials) res.locals.partials = {};
res.locals.partials.weather = getWeatherData(); //res.locals 定義上下文
}
在視圖引擎中引用局部文件
{{ >weather}} 當partials中有子目錄時，{{ >目錄1/目錄2 }}
經驗：某個請求中要執行的中間件一定要在該get方法執行前調用！
模板引擎中遍歷數組方法 及指定上下文環境
{{#each partials.weather.locations }}
{{/each}}
局部文件位置和局部文件上下文
段落
handlebars 實例化地section輔助方法
var handlebars = require(‘express3-handlebars’).create({
defaultLayout:?‘main’,
helpers: {
section: function(name, options){
if (!this._sections) this._sections = {};
this._sections[name] = options.fn(this);
return null;
}
}
})
Handlebars.compile 接收一個模板，返回方法，該方法接收一個上下文對象，返回已渲染的字符串
表單處理
默認為GET提交，在表單提交時需在form 中用 method=“POST”指定
action 被用于接收表單數據的url
帶name屬性的數據才能被服務器識別
表單提交時，默認編碼是application/x-wwwform-urlencoded
發送文件使用multipart/form-data
處理表單的不同方式
瀏覽器提交和ajax
若表單使用POST請求，展現表單和處理表單通常使用相同的路徑，一個是get方法，一個是post方法可以區分路徑，
因而可以省略action。也可以用單獨路徑來處理表單
響應瀏覽器
直接響應HTML
303重定向
POST請求需要引入中間件來解析URL編碼體
npm install —save body-parser
app.use(require(‘body-parser’)())
從而可以直接使用表單字段 如 req.body.name
$(document).ready(function(){
$(‘.newsletter’).on(‘submit’, function(event){
event.preventDefault();
var action = $(this).attr(‘action’);
var $container = $(this).closest(‘.forContainer’);
$.ajax({
url: action,
type:?‘POST’,
success: function(data) {
if(data.success) {
$container.html(‘
Thank you!
’)} else {
$container.html(’There was a problem’)
}
},
error: function(){
$container.html(‘There was a problem’)
}
})
}
})
應用程序
app.post(‘/process’, function(req, res) {
if(req.xhr || req.accepts(‘json,html’)===‘json’){ 詢問最佳返回方式
res.send({success: true})
}else {
res.redirect(303,?‘/thank-you’) 重定向
}
})
文件上傳
安裝中間件 npm install?—save formidable
指定類型 enctype=“multipart/form-data”
app.use(require('body-parser')());
app.use(express.static(__dirname + '/public’)); ? ?app.use(express.static('public'));
