node 之 express
什么是express?
Express 是一个简洁、灵活的 nodejs 的 web 应用开发框架。本身是由一个路由和中间件组成的框架
特点:
1.易上手
2.高性能
3.扩展性强,可以自由的拆分和安装模块
什么是框架?
大白话:就是把常用的操作封装在里面,这样就可以不用重复书写,直接使用框架里面提供的功能即可
安装express
npm i express
注意事项:不能安装在express文件夹下,否则会失败
使用express构造web服务器
1.加载express模块
2.创建express服务器
3.启动服务器
4.监听浏览器请求并进行处理
//加载express模块 const express = require('express') const app = express(); app.listen(8000,()=>{ console.log('express服务器开始工作了') }) app.get('请求地址',(req,res)=>{} ) app.post('请求地址',(req,res)=>{ })
const express = require("express"); const app = express(); app.listen(8001, () => { console.log("server is running "); }); app.get("/", (req, res) => { res.end("get请求方式"); }); app.post("/", (req, res) => { res.end("post请求方式"); }); 说明:使用nodemon 文件名.js
express封装的新方法
重点: express之所以能够实现web服务器的搭建,是因为其内部对核心模块http进行封装
express express.static() --开放静态资源 express.urlencoded() -- 获取post请求体 ... app app.get() --处理客户端的get请求 app.post() --处理客户端的post请求 app.use() --设置应用级别的配置 ... req req.body --获取post请求体 req.params --获取get请求动态参数 req.query -- 获取get请求参数(获取查询字符串参数) ...... res res.end('helll') ;响应结果 http源码 只能填字符窜参数 (res.end('中文会乱码')) //还需要设置编码格式 --res.end(['aaa','cccc']) res.sendFile('文件的绝对路径') --读取文件,并将结果响应 --res.sendFile(path.join(__dirname,'books.json')) res.json({name:'zs'}) //响应json对象(常用) res.send('hello') //会自动设置响应头,做出响应 --res.send(['aaa','bbb','ccc']) 对于数组,对象等,会自动json.stringify() res.set({'Author','zhangsan'}) -- 设置响应头,不能设置状态码
请求案例(req)
get请求方式的参数获取
let express = require("express"); let app = express(); app.listen("8003", () => { console.log("8003服务器已开启"); }); //查询字符串 获取为对象 配置时与请求地址无关 //http://localhost:8003/index?name=zs&age=19 app.get("/index", (req, res) => { res.send(req.query); }); //动态参数 获取为对象 配置时与请求地址有关 //http://localhost:8003/login/zs/19 app.get("/login/:name/:age", (req, res) => { res.send(req.params); });
post请求方式的参数获取
let express = require("express"); let app = express(); app.listen("8003", () => { console.log("8003服务器已开启"); }); const multer = require("multer"); const path = require("path"); // const upload = multer({ dest: "路径" }); //使用绝对路径 const upload = multer({ dest: "./upload" }); app.post("/bb", upload.single("img"), (req, res) => { //注意:这里的img对应的是post传参对应的参数名 // res.send(req.body);//用来获取post请求的数据 res.send(req.file); //获取文件相关信息 `{"fieldname":"img", "originalname":"3.jpg", "encoding":"7bit", "mimetype":"image/jpeg", "destination":"./upload", "filename":"9d18f0c0d52edb7f6fbf13fa0f55b7cb", "path":"upload\\9d18f0c0d52edb7f6fbf13fa0f55b7cb", "size":63519 }`; });
注意:如下图分析
1/若是含有文件上传的功能,那么就是form-data格式
2/若没有上传,就可以选 x-www-form-urlencoded 格式
post 请求总结
post请求体的类型(content-type)
1/application/x-www-form-urlencoded 比如:id=1&name=zs&age=20 form表单中通过submit按钮提交是这种应用级配置
2/form-data 比如,提交的是formData对象 注意:这里的提交的formData是通过jquery$('from').serilize()然后作为参数提交(有待进一步确认)
3/application/json 比如,提交的是{"id":1,"name":"zs","age":20}
服务器端接收不同类型的请求体,应用级配置的方式也不一样
urlencoded --->app.use(express.urlencoded({extended:false})) 对应post上面的1
application/json ---->app.use(express.json()) 对应的是post上面的2
form-data ----> 服务端使用第三方模块处理(multer)
响应案例(res)
//响应结果案例 //导入 const express = require("express"); const path = require("path"); //创建服务 const app = express(); //启动 app.listen("8002", () => { console.log("8002端口服务器在运行"); }); //配置请求响应 app.get("/index", (req, res) => { // res.end("ok-今天天气真不错"); // res.end({ name: "zs" }); //报错 // res.send("ok-今天天气真不错"); // res.sendFile(path.join(__dirname, "./Z01.js")); // res.json({ name: "zs" }); });
静态资源
//导入express模块 const express = require("express"); //创建服务 const app = express(); app.listen("3006", () => { console.log("书籍系统正在启用中......"); }); // app.get("/api/getbooks", (req, res) => { // res.send(""); // }); app.use(express.static("../zhxm")); //切记,这里的路径是相对执行文件而言的
注意:
多个静态资源目录可以通过多次配置来实现开放
问题:不同路径下,有多个文件,重名怎么办
app.use('/p',express.static('./public'))
路由
什么是路由?
举例说明:拨打电话10086,不同的按键有不同的业务,所以在这里,路由是按键与服务之间的映射关系
实质是: url地址和逻辑(回调函数),之间一一对应的映射关系.
//引入模块 const express = require('express') //创建路由对象 const router = express.Router(); //路由配置 router.get('/index',req,res)=>{ }) //导出路由 module.exports = router
模块化路由
为了方便对路由进行模块化的管理,express不建议将路由直接挂载到app上,而是推荐将路由抽离为单独的模块,将路由抽离为单独模块
1.创建路由模块对应的.js文件
1.创建router/login.js 存放 登录 注册 验证码三个路由
2.创建router/heroes.js存放 和英雄相关的所有路由
2.调用express.Router()函数创建路由对象
const express = require('express') const router = express.Router()
3.向路由对象上挂载具体的路由
router.get('xx/xx',(req,res)=>{}) router.post('xx/xx',(req,res)=>{})
4.使用module.exports向外共享路由对象
module.exports = router
5.使用app.use() 函数注册路由模块 --app.js
//app.js中,将路由导入,注册路由 const login = require('./router/login.js') app.use(login)
实际案例:
user.js
const express = require("express"); const router = express(); router.get("/getUser", (req, res) => { res.send("getUser请求通过"); }); module.exports = router;
stu.js
const express = require("express"); const router = express(); router.get("/getStu", (req, res) => { res.send("getStu请求通过"); }); module.exports = router;
app.js(入口)
const express = require("express"); const app = express(); app.listen("8009", () => { console.log("8009服务已经开启......"); }); const stu = require("./stu"); const user = require("./user"); app.use("/api", stu); app.use("/my", user);
在页面上分别输入可以请求成功
http://localhost:8009/api/getStu
http://localhost:8009/user
中间件
本来正常的过程是前端发送请求到后端,后端对这个请求进行处理,然后给前端返回响应。那么中间件的作用就是在接收到前端的请求后,作出一系列的工作。
中间件的语法:
function 中间的名字(req,res,next){ //req:代表的是http请求 //res:代表的是http 响应 //next:代表调用下一个中间件 }
扩展内容
(1) npm i nodemon 是一个很好的全局工具,可以在每次修改内容后不用重新启动服务
(2) 浏览器输入的请求地址,都是默认为get请求方式
(3) 推荐使用postman软件