Express 框架核心特性:
- 可以设置中间件来响应 HTTP 请求。
- 定义了路由表用于执行不同的 HTTP 请求动作。
- 可以通过向模板传递参数来动态渲染 HTML 页面。
express保留了Node原生的功能,添加了一些方法增强原有的功能
安装 Express
npm install express --save
几个重要的模块是需要与 express 框架一起安装的
body-parser - node.js 中间件,用于处理 JSON, Raw, Text 和 URL 编码的数据。
cookie-parser - 这就是一个解析Cookie的工具。通过req.cookies可以取到传过来的cookie,并把它们转成对象。
multer - node.js 中间件,用于处理 enctype="multipart/form-data"(设置表单的MIME编码)的表单数据
请求和响应
- Express 应用使用回调函数的参数: request 和 response 对象来处理请求和响应的数据。
app.get('/', function (req, res) {
// --
})
req.path:获取请求路径
req.query:获取URL的查询参数串
req.route:获取当前匹配的路由
res.append():追加指定HTTP头
res.send():传送HTTP响应
res.cookie(name,value [,option]):设置Cookie
opition: domain / expires / httpOnly / maxAge / path / secure / signed
res.clearCookie():清除Cookie
res.send():传送HTTP响应
路由
路由路由决定了由谁(指定脚本)去响应客户端请求通过路由提取出请求的URL以及GET/POST参数。
使用express中的路由访问子页面必须使用use请求
var server=express();
server.listen();
server.use('/', require('./route/web.js')());
server.use('/admin/', require('./route/admin.js')());
require()访问route/admin.js文件,返回路由的页面。
const express=require('express');
module.exports=function (){ var router=express.Router(); router.get('/login', (req, res)=>{
res.render('admin/login.ejs', {});
}); router.get('/', (req, res)=>{
res.render('admin/index.ejs', {});
}); router.get('/bannerInserOrUpdate',(req,res)=>{
res.render('admin/bannerInserOrUpdate.ejs')
});
return router;
};
Get请求
- 表单中通过 GET 方法提交两个参数,我们可以使用 server.js 文件内的
process_get
路由器来处理输入
//index.html
<form class="" action="/getinfo" method="get">
用户: <input type="text" name="user" value=""><br>
密码: <input type="text" name="password" value=""><br>
<input type="submit" name="" value="提交">
</form>
// server.js
const express=require("express");
var server= express();
server.get('/index.html', function (req, res) {
res.sendFile( __dirname + "/" + "index.html" );
}); server.get('/process_get ',function(req,res){
var response = {
user:req.query.user,
password:req.query.password
};
console.log(response);
res.write(JSON.stringify(response));
res.end();
}); server.listen();
Post请求
- 通过 POST 方法提交两个参数,我们可以使用 server.js 文件内的 process_post 路由器来处理输入
<!----index.js--->
<form class="" action="/process_post" method="post">
用户: <input type="text" name="user" value=""><br>
密码: <input type="text" name="password" value=""><br>
<input type="submit" name="" value="提交">
</form>
server.js文件
const express=require("express");
const bodyParser=require("body-parser");
// 创建 application/x-www-form-urlencoded 编码解析 var server= express();
server.get('/index.html', function (req, res) {
res.sendFile( __dirname + "/" + "index.html" );
}); var urlencodedParser = bodyParser.urlencoded({ extended: false })
server.post('/process_post',urlencodedParser,function(req,res){ response = {
user:req.body.user,
password:req.body.password
}; res.writeHead(,{'Content-Type':'text/html;charset=utf-8'});//设置response编码为utf-8
console.log(response);
res.write(JSON.stringify(response));
res.end();
}); server.listen();
静态文件
- Express 提供了内置的中间件 express.static 来设置静态文件如:图片, CSS, JavaScript 等。
- 你可以使用 express.static 中间件来设置静态文件路径。例如,如果你将图片, CSS, JavaScript 文件放在 public 目录下
server.use(static('./static/'))
上传文件
html页面
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>文件上传</title>
</head>
<body>
<h3>文件上传:</h3>
<form action="/upload" method="post" enctype="multipart/form-data">
<input type="file" name="imageFile" />
<br />
<input type="submit" value="上传文件" />
</form>
</body>
</html>
server,js页面
var fs = require('fs');
var express = require('express');
var multer = require('multer'); var upload = multer({dest: 'uploads/'}); var app= express();
// 单域单文件上传:input[file]的 multiple != "multiple"
app.post('/upload', upload.single('imageFile'), function(req, res, next) {
// req.file 是 前端表单name=="imageFile" 的文件信息(不是数组)
fs.rename(req.file.path, "upload/" + req.file.originalname, function(err) {
if (err) {
throw err;
}
console.log('上传成功!');
})
res.writeHead(, {
"Access-Control-Allow-Origin": "*"
});
res.end(JSON.stringify(req.file)+JSON.stringify(req.body));
}) app.get('/index', function (req, res) {
res.sendFile( __dirname + "/" + "index.html" );
}); app.listen();