Express框架建立在node.js內(nèi)置的http模塊上,核心是對http模塊的再包裝,等于在http模塊之上拼卵,加了一個中間層
中間件(middleware)
中間件就是處理HTTP請求的函數(shù)澡腾,在實例運行過程中會調(diào)用一系列中間件.
每個中間件可以從App實例募闲,接收三個參數(shù)饶氏,依次為request對象(代表HTTP請求)告丢、response對象(代表HTTP回應(yīng))志膀,next回調(diào)函數(shù)(代表下一個中間件)人灼。每個中間件都可以對HTTP請求(request對象)進行加工骨饿,并且決定是否調(diào)用next方法亏栈,將request對象再傳給下一個中間件
var path = require('path');
var express = require('express');
var app = express();
var indexRouter = require('./routes/index');
var userRouter = require('./routes/users');
app.set('views', path.join(__dirname, 'views'));// 設(shè)置存放模板文件的目錄
app.set('view engine', 'ejs');// 設(shè)置模板引擎為 ejs
app.use(express.static('public'));
// app.use('/', indexRouter);
app.use('/users', userRouter);
app.get('/', function (req, res) {
res.sendfile('./public/login.html');
});
app.use("/home", function(request, response, next) {
response.writeHead(200, { "Content-Type": "text/plain" });
response.end("Welcome to the homepage!\n");
});
app.use("/about", function(request, response, next) {
response.writeHead(200, { "Content-Type": "text/plain" });
response.end("Welcome to the about page!\n");
});
app.use(function(request, response) {
response.writeHead(404, { "Content-Type": "text/plain" });
response.end("404 error!\n");
});
app.listen(8000);
程序順序執(zhí)行,最后一個中間件沒有調(diào)用next();執(zhí)行到該處中間件的傳遞終止宏赘,若前面的路徑一旦有一個匹配成功則不再繼續(xù)執(zhí)行下邊的中間件.
訪問結(jié)果:
use是express注冊中間件的方法绒北,它返回一個函數(shù)
use方法也允許將請求網(wǎng)址寫在第一個參數(shù)。這代表察署,只有請求路徑匹配這個參數(shù)闷游,后面的中間件才會生效
set方法
set方法用于指定變量的值
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'ejs');
response.sendFile
response.sendFile方法用于發(fā)送文件,發(fā)送文件需要完整的路徑名
一般用于靜態(tài)網(wǎng)頁
res.sendfile('./public/login.html');
發(fā)送所在文件夾的文件可以用
res.sendFile(__dirname + '/login.html');
指定靜態(tài)文件目錄
默認為public贴汪,用來存放圖片脐往,樣式表等靜態(tài)文件
app.use(express.static('public'));
模板引擎
這里用ejs舉例,先安裝ejs
npm i ejs --save
app.set('views', path.join(__dirname, 'views'));// 設(shè)置存放模板文件的目錄
app.set('view engine', 'ejs');// 設(shè)置模板引擎為 ejs
在 views 下新建 users.ejs扳埂,添加如下代碼:
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
body {padding: 50px;font: 14px "Lucida Grande", Helvetica, Arial, sans-serif;}
</style>
</head>
<body>
<h1><%= name.toUpperCase() %></h1>
<p>hello, <%= name %></p>
</body>
</html>
ejs 有 3 種常用標(biāo)簽:
- <% code %>:運行 JavaScript 代碼业簿,不輸出
- <%= code %>:顯示轉(zhuǎn)義后的 HTML內(nèi)容
- <%- code %>:顯示原始 HTML 內(nèi)容
更多標(biāo)簽參考官方文檔
users.js中調(diào)用 res.render(模板的名字,傳給模板的數(shù)據(jù)) 函數(shù)渲染 ejs 模板
var express = require('express');
var router = express.Router();
router.get('/:name', function(req, res) {
res.render('users', {
name: req.params.name
});
});
module.exports = router;
啟動服務(wù)器:
node app.js
訪問結(jié)果中name是動態(tài)可變化的:
我的post.js代碼(重新定義了一個服務(wù)器阳懂,端口8080)
var http = require('http');
var querystring = require('querystring');
var util=require('util');
http.createServer(function (req, res) {
var body = "";
req.on('data', function (chunk) {
body += chunk;
});
req.on('end', function () {
// 解析參數(shù)
body = querystring.parse(body);
// 設(shè)置響應(yīng)頭部信息及編碼
res.writeHead(200, {'Content-Type': 'text/html; charset=utf8'});
if(body.name && body.number) { // 輸出提交的數(shù)據(jù)
res.write("yourName:" + body.name);
res.write("<br>");
res.write("number:" + body.number);
}
res.end();
});
}).listen(8080);
啟動服務(wù)器:
node post.js