nodejs学习笔记-06express

184 阅读5分钟

1. express简介

1.1什么是Express

Express是基于node.js平台,快速,开放,极简的Web开发框架,通俗来讲 Express的作用就是和node.js中内置的http模块类似,是专门用来创建Web服务器的

本质: Express本质上就是一个npm上的第三方包,提供了快速创建Web服务器的便捷方法

对于前端程序员来说,最常见的两种服务器分别是:

  1. web网站服务器,专门对外提供Web网页资源的服务器
  2. API接口服务器专门对外提供API接口的服务器

使用Express,我们可以方便,快速的创建Web网站的服务器或API接口的服务器

2.express的基本使用

2.1.安装:

npm i express

2.2 创建基本的web服务器

// 导入express
const express = require("express");
// 创建web服务器
const app = express();
// 调用app.listen(端口号,启动成功之后的回调函数) , 启动服务器
app.listen(80, () => {
  console.log("express server running in http://127.0.0.1 ");
});

2.3监听get请求post请求

通过app.get()方法,可以监听客户端的GET请求,通过app.post()方法,可以监听客户端的GET请求,

// 导入express
const express = require("express");
// 创建web服务器
const app = express();
// 监听客户端的get和post请求,并向客户端响应具体的内容
// 参数1:客户端请求的 URL地址
// 参数2:请求对应的处理函数
//  req:请求对象
//  res:响应对象
app.get("/user", (req, res) => {
  // 调用express提供的res.send()方法,向客户端响应一个JSON对象
  res.send({ name: "stephen", age: 34, career: "basketball" });
});
app.post("/user", (req, res) => {
  res.send("请求成功");
});

// 调用app.listen(端口号,启动成功之后的回调函数) , 启动服务器
app.listen(80, () => {
  console.log("express server running in http://127.0.0.1 ");
});
image.png image.png

2.4获取URL中携带的查询参数

通过req.query,可以访问到客户端并通过查询字符串的形式,发送到服务器的参数

app.get('/',(req,res)=>{
    console.log('req.query',req.query) // {}
    // 通过res.query可以获取到客户端发送过来的查询参数
    // 注意:默认情况下,req.query是一个空对象 
    res.send(req.query)
})
image.png

2.5 获取URL中的动态参数

通过req.params对象,可以访问到到URL中,通过: 匹配到动态参数

// :id为一个动态参数
app.get('/user/:id',(req,res)=>{
    console.log('req.params',req.params) // {}
    // res.params 默认为一个空对象
    // 里面存放着 通过:匹配到的参数值
    // 将res.params作为响应 
    res.send(req.params)
})
image.png

注意:动态参数也可以有多个

3.express-静态资源处理

3.1 express.static()

express提供了一个非常好用的函数,叫做express.static(),通过它,我们可以非常方便的创建一个静态资源服务器例如,通过如下代码就可以将public目录下的图片,css文件,javascript文件对外开放访问了:app.use(express.static('public'))

const express = require("express");
const app = express();
// 调用express.static()方法,快速的对外提供静态资源,之后就可以访问目录中的所有文件了
app.use(express.static('../02-practice-综合案例(path&fs)/result'))
app.listen(80, () => {
  console.log("express server running http://127.0.0.1http://127.0.0.1");
});
//在浏览器输入http://127.0.0.1/index.html
//在浏览器输入http://127.0.0.1/index.css
//在浏览器输入http://127.0.0.1/index.js

注意:express在指定的静态目录中查找文件,并对外提供资源的访问路径,因此,存放静态文件的目录名不会出现在URL中

3.2 托管多个静态资源目录

如果需要托管多个静态资源目录,请多次调用express.static()函数,

注意:访问静态资源文件时,express.static()函数会根据目录的添加顺序查找所需的文件

3.3 挂载路径前缀

如果希望在托管的静态资源访问路径之前,挂载路径前缀,则可以使用如下的方式

app.use('/abc',express.static('../02-practice-综合案例(path&fs)/result'))
// 现在就可以通过http://127.0.0.1/abc/index.html来访问页面资源了

4.nodemon

nodemon这个工具,它能够监听项目文件的变动,当代码被修改后,nodemon会自动帮我们重启项目,极大的方便了开发和调试

安装nodemon: npm i -g nodemon(-g全局安装) 安装完成之后,我们可以将启动项目的命令换成 nodemon 文件名,之后只要文件做了修改保存之后,都会自动重启一次

5.express路由

在express中,路由指的是客户端请求服务器处理函数之间的映射关系

express中的路由由3部分组成

  • 请求的类型(METHOD)
  • 请求的URL地址(PATH)
  • 处理函数(HANDLER)

app.METHOD(PATH,HANDLER) 每当一个请求到达服务器之后,需要先经过路由的匹配,只有匹配成功之后,才会调用对应的处理函数,在匹配时,会按照路由的顺序进行匹配,如果请求类型请求的URL同时匹配成功,则Express会将这次请求,转交给对应的function函数进行处理

//express中简单的路由例子
const express = require("express");
const app = express();
// 挂载路由
app.get("/", (req, res) => {
  res.send("Get Request");
});
app.post("/", (req, res) => {
  res.send("Post Request");
});
app.listen(80, () => {
  console.log("express server running http://127.0.0.1");
});

5.1模块化路由

为了方便对路由进行模块化的管理,express不建议直接将路由挂载到app上,而是推荐将路由抽离为单独的模块

抽离路由为单独模块的步骤:

  1. 创建路由模块对应的.js文件
  2. 调用express.Router()函数创建路由对象
  3. 向路由对象上挂载具体的路由
  4. 使用module.exports向外共享路由对象
  5. 使用app.use()函数注册路由模块

举例

// 这是路由模块 router.js
// 1.导入express
const express = require('express')
// 2.创建路由对象
const router= express.Router()
// 3.挂载具体的路由
router.get('/user/list',(req,res)=>{
    res.send('Get user list')
})
router.post('/user/add',(req,res)=>{
    res.send('Add new user')
})
// 4.向外导出路由对象
module.exports = router
// 使用路由模块化的文件
const express = require("express");
const app = express();
const router = require("./05-router");
// 1.导入路由模块
// 2.注册路由模块
//app.use()函数的作用.就是来注册全局中间件
app.use(router);
app.listen(80, () => {
  console.log("express server running http://127.0.0.1");
});
image.png image.png

5.2为路由模块添加前缀

类似于托管静态资源时,为静态资源同意挂载访问前缀一样,路由模块的添加前缀方式也非常简单

// 在使用app.use()注册路由模块的时候,添加统一的访问前缀 /api
app.use('api',router)