node.js-day04Express的中间件和路由

模块的加载机制

(1)require(模块名称)

require('a')
//(1.1)内置
//(1.2)第三方
// 当成文件 a -> node_modules/a.js
// 当成文件夹 
//  查看package.json里面main属性 ./a->node_modules/a/b.js
//  没有main属性指定文件 a -> node_modules/a/index.js

(2)require(路径)

//(2.1)完整路径
require('./a.js')
//(2.2)没有后缀名
require('./a')
// 把当成文件./a->./a.js
// 当成文件夹
  // 查看package.json里面main属性 ./a->./a/b.js
  // 没有main属性指定文件 ./a->./a/index.js

框架和库的区别?

框架功能很全,并且插件(基于框架的规定开发插件)

第一个express程序

(1)安装express
npm i express@4.17.1
(2)查看中文文档,百度搜索express 中文
https://www.expressjs.com.cn/
(3)写程序

// 1. 导入 express
const express = require('express')
// 2. 创建 web 服务器
const app = express()

// 4. 监听客户端的 GET 和 POST 请求，并向客户端响应具体的内容
app.get('/',(req,res)=>res.send('首页请求方式get'))
app.post('/',(req,res)=>res.send('首页请求方式post'))

// 3. 启动 web 服务器
app.listen(80, () => {
  console.log('express server running at http://127.0.0.1')
})

(4)运行程序
node 07

express的静态托管

//浏览器访问: http://127.0.0.1/index.html,访问文件day2\code\clock\index.html
app.use(express.static('./clock'))
//带缀的静态托管
//浏览器访问: http://127.0.0.1/static/index.html,访问文件day2\code\files\index.html
app.use('/static', express.static('./files'))

express的传参

(1)get方式,通过地址栏
(1.1)浏览器地址,查询字符串:http://127.0.0.1/user?uname=zs&age=10
后端代码:req.query
(1.2)浏览器地址,动态参数:http://127.0.0.1/user/1
等同于http://127.0.0.1/user?id=1
后端代码:req.params
(2)post方式,通过请求体
(2.1)浏览器地址,json
请求体:{"uname":"zs","age": 10}
后端代码

app.use(express.json())
req.body

(2.2)浏览器地址,urlencoded
请求体:uname=zs&age=10
后端代码

app.use(express.urlencoded())
req.body

(2.3)浏览器地址,formData
请求体:二进制

使用nodemon

(1)查看文档
快速访问:https://www.npmjs.com/package/+模块名称
https://www.npmjs.com/package/nodemon
(2)安装
npm i -g nodemon
(3)使用
切换你执行代码目录,nodemon 你的代码
eg:nodemon 08

什么是路由

映射关系,请求的方式(get,post),请求路径(url)和请求处理之间关系

回顾路由写法

(1)全局路由

//对任意请求方式,任意的路径(所有请求)
app.use((req,res,next)=>{
  next()//中间件
  res.send()//路由处理函数
})

(2)局部路由

//对请求方式get,路径/users做处理
app.get('/users',(req,res)=>{})
//对请求方式post,路径/users做处理
app.post('/users',(req,res)=>{})
//对任意请求方式,路径/users做处理
app.use('/users',(req,res)=>{})

中间件

简单理解,就是请求处理方法
中间件的流程是在开车走高速路去某个地方
中间件:收费站
next()给钱,去下一个收费站
res.send()下高速路
throw new Error('产生错误')或者next('错误内容')出车祸
req.xxx = yyy收费站,买瓶水
注意点:send()重复调用会报错,只能调用一次

中间的作用案例

• 权限控制
• 处理数据

const express = require('express')
const app = express()
//定义局部中间件
app.use('/my',(req, res, next) => {
  // 验证token是否有效?
  if(req.query.token === 'abc'){
    //给req添加共享数据
    req.userId = 1
    next() //到下一个中间件
  }else{
    res.send('验证token失败') //返回内容给浏览器
  }
})
//定义路由处理方法
app.get('/my/userInfo', (req, res) => {
  //返回内容给浏览器
  res.send({
    //使用req的共享数据
    userId: req.userId,
    username: '张三'
  })
})

app.listen(80, () => {
  console.log('http://127.0.0.1')
})

修改别人写好的代码片段

扩展文件
C:\Users\用户名称.vscode\extensions\capaj.vscode-standardjs-snippets-0.8.15\snippets\javascript.json

  "arrow function with body": {
    "prefix": "f",
    "body": "(${1:arguments}) => {\n\t${0}\n}"
  },

文件\首选项\用户代码片段\

    "arrow function with body": {
        "prefix": "f",
        "body": "(${1:req}${2:,res}) => {\n\t${0}\n}"
    }

今日每日反馈

(1)能够了解模块的加载机制
(2)能够知道如何使用Express创建基本的Web服务器
(3)能够知道如何使用express托管静态资源
(4)能够知道在Express中如何定义全局和局部的中间件
(5)能够知道如何使用Express中的路由