Express

简介

  • Express 是一个简洁而灵活的 Node.js Web应用框架, 提供一系列强大特性帮助你创建各种Web应用
  • Express内部还是使用的http模块实现服务器创建和监听, 对http模块进行了二次封装
  • 严格上来说 express就是NodeJS的一个模块 直接下载安装

使用

  • node下载express模块：
  • 命令 ：
    • 初始化服务 ： npm init -y
    • 下载express： npm i express
  • 使用的时候 引入 需要实例化一个express应用 使用应用对象创建各种服务

express响应

  • express响应的时候使用response对象中的send方法进行响应 注意 send只能响应一次 如果多次 将不执行
  • 只会执行第一次响应的内容
  • 使用send的时候 不需要设置头信息 直接使用就可以
1
2
3
4
5
6
7
8
9
10
11
12
13
const express = require("express");
// 创建一个应用 (不用new)
let app = express();
// 测试一个web服务器
app.get("/index",(req,res)=>{
    // 在express中,响应用到的是response的send()方法; 且只能用一个
    res.send("<h1>你好 2022</h1>")
})

// 监听
app.listen(3000,"127.0.0.1",()=>{
    console.log("服务器正在运行...")
})

现象：若浏览器输入127.0.0.1：3000 浏览器则显示 Cannot GET /；只有输入127.0.0.1：3000/index 才能显示 你好 2022

express路由

  • 路由其实就是我们平时所说的路径
  • express路由分为 get、post、use、all(不常用,也就不写例子了)
  1. get路由： 定义的get路由在浏览器中访问的时候 只能使用get方式进行访问
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
const express = require("express");
// 创建应用
let app = express();

// 定义路由
app.get("/",(req,res)=>{
    res.send("<h1>this is root </h1>")
})

app.get("/index",(req,res)=>{
    res.send("这是index路由")
})

// 监听
app.listen(3000)

在页面输入127.0.0.1:3000 则会显示 h1解析之后的 this is root ；输入127.0.0.1:3000/index 则会显示 这是index路由

  1. post路由：定义的post路由在浏览器中访问的时候 只能使用post方式进行访问
1
2
3
4
//因为是post,所以不能在url地址栏中进行输入,那里面的都算get,所以需要html来协助一哈哈
 <form action="http://127.0.0.1:3000/index" method="POST">  //要有action 和method 缺一不可
     <input type="submit">
 </form>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
const express = require("express");
// 创建应用
let app = express();

// 定义路由
app.post("/",(req,res)=>{
    res.send("<h1>this is root </h1>")
})

app.post("/index",(req,res)=>{
    res.send("这是index路由")
})

// 监听
app.listen(3000)

跟get相比，仅仅是get改为了post，别的一毛一样；

  1. use路由 (可以用来设置404页面)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
const express = require("express");
// 创建应用
let app = express();

// 定义路由
app.get("/",(req,res)=>{
    res.send("<h1>this is root </h1>")
})

app.post("/index",(req,res)=>{
    res.send("这是index路由")
})

// 不设置路由表示除了上面的别的都匹配(脸最大的时候就是不要脸)
// status()设置状态码
app.use((req,res)=>{
    res.status(404).send("404 Not Found")
})

// 监听
app.listen(3000)

响应头

  • 响应头就是MIME，express中默认是响应头的 “Content-type”：”text/html”
  • 但如果想展示一张图片，text/html不能解析图片，则需要设置响应头
  • setHeader()内置两个参数：第一个参数是Content-type 第二个参数是MIME类型 例如： image/jpg
  • 要是设置了不管用，清缓存或者开一个无痕浏览
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
const express = require("express");
const fs  = require("fs");
const path = require("path")

let app = express();

app.get("/index",(req,res)=>{
    res.setHeader("Content-type","image/jpg");
    let contents = fs.readFileSync(path.resolve(__dirname,"./dm.jpg"));//图片不能写utf-8;因为图片是二进制的
    res.send(contents)
})

app.listen(3000,()=>{
    console.log("is running")
})

sendFile响应文件

  • sendFile是响应一个文件 和上述的功能是差不多的 如果说 我们直接响应一个图片
  • 我们可以直接使用sendFile方法进行响应 直接输入图片的地址 但是要求 图片地址必须是绝对路径
  • sendFIle内置一个参数 参数是文件的绝对路径
1
2
3
4
5
6
7
8
9
10
11
const express =require("express");
const path = require("path");

let app = express();
app.get("/index",(req,res)=>{
    res.sendFile(path.resolve(__dirname,"./dm.jpg"))
})

app.listen(3000,()=>{
    console.log("server is running")
})

解析get参数

  • Express中解析get参数相对来说比较简单 使用request对象中的query
  • 可以使用表单，可以使用url地址栏传参；**(除了form和ajax，别的其实都是url地址栏传参的)**
  • 接受到的结果直接就是一个对象 直接处理就可以
1
2
3
4
5
6
7
8
9
10
11
<form action="http://127.0.0.1:3000/index" method="GET">
    <div>用户名：
        <input type="text" name="username">
    </div>
    <div>密码：
        <input type="text" name="password">
    </div>
    <div>
        <input type="submit" value="提交">
    </div>
</form>
1
2
3
4
5
6
7
8
9
10
11
12
const express =require("express");
let app = express();

app.get("/index",(req,res)=>{
    let params = req.query;  
    console.log(params);  //{ username: 'asdasd', password: '123' }
    res.send("lala")
})

app.listen(3000,()=>{
    console.log("server is running")
})

路由参数

  • 路由参数不能通过form表单进行传参

  • 参数名在路由上进行传递 接收 传递参数的时候一一对应

  • 路由参数传递数量和参数名保持一致 否则404

  • 数名在路由上进行传递 ‘/index/:name/:age/:sex’

  • 处理参数的时候 路由参数保存在request对象中的params对象中

1
2
3
4
5
6
7
8
9
10
11
const express = require("express");
let app =express();
app.get("/index/:name/:age/:sex",(req,res)=>{
    let params = req.params;
    console.log(params)  //{ name: 'fsl', age: '24', sex: '1' }
    res.send("lala")
})

app.listen(3000,()=>{
    console.log("server is running")
})

在地址栏中输入 http://127.0.0.1:3000/index/fsl/24/1 即可访问，参数和定义的路由一一对应，少传参数或者多传都会访问不到，例如少传一个：http://127.0.0.1:3000/index/fsl/24/ =>Cannot GET /index/fsl/24/

get参数和路由参数的区别

  1. get可以表单传参，可以url地址栏传参，url地址栏使用?进行传递 参数名=参数值 多个参数使用&进行分割；路由参数只能在url地址栏传参，url地址栏使用/:key/:key的方式传参 (例如：/index/:name/:age/:sex http://127.0.0.1:3000/index/fsl/24/1 )
  2. 路由传参参数名在路由上进行传递，接收，参数必须一一对应，参数数量必须保持一致，否则404
  3. get参数通过res.query，路由参数通过res.params；(但都是对象)

热更新

  • 传统写node，每次进行代码修改之后，需要ctrl+c然后重启服务，有点繁琐
  • 下载第三方模块nodemon，需要全局下载npm install nodemon -g
  • 直接nodemon 运行程序
  • 注：仅在测试的时候用，上线的时候不能用，因为上线之后一改就重启服务的话……hha……