Node.js基础4

express

1. 概念：Express的作用和内置的http模块很相似，是用来创建WEB服务器的,基于http模块封装出来的
2. 作用：能制作Web网站服务器与API接口服务器
3. 安装：npm i [email protected]

//调用模块
const express=require('express')
//创建服务器
const app=express()
//打开监听
app.listen(80,function(){
    console.log('express server running');
})

监听get请求

1. 通过app.get()方法监听
2. 语法app.get(‘url’,function(req,res){//处理函数})

• req请求对象（属性与方法）
• res响应对象（属性与方法）

app.get('/test',(req,res)=>{
    //拿到客户端传输数据
    console.log(req.query);
})

监听post请求

1. 通过app.post()方法监听
2. 语法app.post(‘url’,function(req,res){//处理函数})

• req请求对象（属性与方法）
• res响应对象（属性与方法）

app.post('/test',(req,res)=>{
    res.send('响应post成功')
})

向客户端响应内容

通过res.send()方法

 //响应给客户端
    res.send({
        nane:'test',
        date:'2022'
    })

获取url中携带的参数

1. 通过req.query对象，可以查询到客户端的通过字符串发送的信息
2. 通过?name=jack&age=20传入的

 req.query.name=jack
 rea.query.age=20

获取url中动态参数

1. 通过req.params对象，可以访问到url中匹配的动态参数
2. 当传入如/test/:2，可以这样获取

app.get('/test/:id',(req,res)=>{
    //拿到客户端传输数据
    console.log(req.params);
 })
 //结果id:2

3. 后面也可以匹配多个参数url/:参数1/:参数2

托管静态资源

1. express.static()通过它可以创建一个静态服务器，将图片，css文件，js文件对外开放
public文件夹下有一个index.html文件

const express=require('express')
const app=express()
app.use(express.static('../public'))

app.listen(80,function(){
console.log('express server tunning');
})

//浏览器输入http://localhost/index.html拿到html中内容

2. 托管多个静态资源时，只需要多次调用express.static()就行
3. 挂载路径前缀app.use((‘路径前缀’),express.static(‘文件名’))

const express=require('express')
const app=express()
app.use('public',express.static('../public'))

app.listen(80,function(){
console.log('express server tunning');
})
//注意这次输入地址前要加public
//浏览器输入http://localhost/public/index.html拿到html中内容

nodemon

1. 在编写代码时候，如果修改了代码，需要close后，重新启动。nodemon在监听到代码改动后，会自动启动
2. 安装npm install -g nodemon
3. 使用启动项目时改用nodemon 文件名启动项目

express路由

1. 概念：路由指客户端的请求与服务器处理函数之间的映射关系
2. express中的路由是请求的类型，请求的url地址，处理函数
3. 路由的匹配

• 每一个请求到达服务器之后，需要先经过路由的匹配，只有匹配成功后，才会调用对应的函数
• 匹配时，按照路由顺序匹配，当请求的类型和url同时匹配成功，才会调用对应的函数

4. 路由的使用

• 挂载到app下

const express=require('express')
const app=express()
//挂载到app下
app.get('/',function(req,res){
    console.log('hello get');
})
app.get('/use',function(req,res){
    console.log('hello use');
})
app.post('/',function(req,res){
    console.log('hello post');
})
app.listen(80,function(){
    console.log('express server running');
})
//客户端输入http//127.0.0.1得到响应为hello get,输入http//127.0.0.1/use得到结果响应hello use

• 将路由抽离成单独的模块

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

//创建一个router文件

const  express=require('express')
const router=express.Router()
//挂载对象
router.get('/use',(req,res)=>{
    res.send('hello router get')
})
router.post('/use',(req,res)=>{
    res.send('hello router post')
})
module.exports=router

//使用路由模块

const express=require('express')
const app=express()
//使用路由
const myRouter=require('./router')
//注册路由模块
app.use(myRouter)//aap.use()注册中间件
app.listen(80,()=>{
    console.log('exprss srever running')
})
//浏览器输入http//127.0.0.1/use响应结果为hello router get

express中间件

1. 概念：中间事件，对请求预处理
2. 格式：中间件本质是一个事件处理函数

app.get('url',function(req,res,next){
	next()
})

3. next函数作用是把流转关系转交给下一个中间件或路由
4. 创建中间件函数

• 简单中间件函数

const express=require('express')
const app=express()
const midFun=function(req,res,next){
    console.log('middle function');
    next()
}
app.listen(80,()=>{
    console.log('express server running');
})

• 全局生效中间件，客户端发送的任何请求都会到达的叫全局中间件

const express=require('express')
const app=express()
//简单中间件
const midFun=function(req,res,next){
    console.log('middle function');
    next()
}
//注册为全局中间件
app.use(midFun)

//也可简写成
//   app.use((req,res,next)=>{
//      console.log('middle function');
//      next()
//   })


app.get('/',(req,res)=>{
    res.send('hello midFun')
})
app.listen(80,()=>{
    console.log('express server running');
})

5. 中间件作用：在多个中间件中，共享一份req和res，所以在上游中间件中为req和res统一添加方法和属性以供下游中间件或路由使用

const express=require('express')
const app=express()
//简单中间件
const midFun=function(req,res,next){
    const time=Date.now()
//挂载在req上
    req.startTime=time
    next()
}
//注册为全局中间件
app.use(midFun)
app.get('/',(req,res)=>{
    res.send('startTime',req.startTime)
})
app.listen(80,()=>{
    console.log('express server running');
})

6. 局部中间件
   不使用app.use()定义的中间件叫做局部中间件

const express=require('express')
const app=express()
//简单中间件
const midFun=function(req,res,next){
    const time=Date.now()
    req.startTime=time
    next()
}
//注册为局部中间件
app.get('/',midFun,(req,res)=>{
    res.send('startTime 局部')
})
app.get('/use',(req,res)=>{
    res.send('startTime')
})
app.listen(80,()=>{
    console.log('express server running');
})

使用多个中间件

app.get('/',[midFun,midFun2],(req,res)=>{
    res.send('startTime 局部')
})

中间件分类

1. 应用级别中间件
   通过app.use()||app.get()||app.post(),绑定到app示例上的中间件，叫做应用级别中间件
2. 路由级别中间件
   express.Router()示例上的中间件，用法和应用级别中间件用法没有区别
3. 错误级别中间件：专门用来捕获整个项目中发生的异常错误，从而防止项目异常崩溃问题
   function(err,req,res,next)

const express=require('express')
const app=express()
app.get('/',function(req,res){
    throw new Error('服务器出错');
    res.send('home page')
})
app.use((err,req,res,next)=>{
console.log('err',err.message);
res.send('err',err.message)
})

app.listen(80,function(){
    console.log('express listen running');
})

4. Express内置中间件

• express.static快速托管静态资源内置中间件
• express.json解析JSON格式的数据
• express.urlencoded解析URL-encode数据格式

app.use(express.json())
app.use(express.urlencoded({extended:false}))

5. 第三方中间件

• npm i 文件名
• require导入
• app.use注册使用

自定义中间件

1. 实现步骤

• 定义中间件
• 监听req的data事件
• 监听req的end事件
• 使用querystring模块解析数据
• 解析出来的数据挂载到req.body
• 将自定义中间件封装为模块

2. 示例

const express=require('express')
const app=express()
//导入内置模块
const qs=require('querystring')
//解析表单数据中间件
app.use((req,res,next)=>{
//在数据较大时，会分成很多次传输，所以需要定义str保存
    let str='';
//监听req事件
    req.on('data',(chunk)=>{
        str+=chunk
    })
//监听req的end事件
    req.on('end',function(){
        const change=qs.parse(str)
        req.change=change
        next()
    })
})
app.post('/test',(req,res)=>{
    res.send(req.change)
})
app.listen(80,function(){
    console.log('express server running');
})

express写接口

1. 编写GET接口

router.get('/get',(req,res)=>{
//拿到客户端传输数据
    const query=req.query
//响应给客户端
    res.send({
        status:0,//0表示成功
        msg:'get请求成功',//具体描述
        data:query
    })
//通过get请求时响应{status:0,msg:'get请求成功' ,data:请求的内容}
})

2. 编写POST接口

router.post('/post',(req,res)=>{
    //拿到客户端传输数据
        const body=req.body
    //响应给客户端
        res.send({
            status:0,//0表示成功
            msg:'get请求成功',//具体描述
            data:body
        })
//通过post请求时响应{status:0,msg:'get请求成功' ,data:请求的内容}    
})

3. 跨域问题

• cors中间件解决跨域问题
• npm install cors
• const cors =require(‘cors’)
• app.use(cors())

4. CORS跨域资源共享
   同源安全策略会阻止网页跨域获取资源，但如果接口服务器配置了CORS相关的HTTP响应头，就可以解除浏览器的跨域问题

• CORS主要配制在服务端
• CORS具有兼容性问题

CROS介绍

1. CROS响应头部Access-Control-Allow-Origin
   语法：Access-Control-Allow-Origin:||*
2. CROS仅支持客户端向服务端发送的九个请求头
   如果是别的需要设置
   res.use(‘Access-Control-Allow-Headers’,‘Content-Type,X-Custom-Header’)
3. CROS仅支持get,post,head请求
   如果要响应别的请求，需要通过Access-Control-Allow-Methods
   res.use(‘Access-Control-Allow-Methods’,‘GET,POST,HEAD,DELETE’||’*’)
4. 简单请求

• 请求方式：get,post,head
• HTTP头部信息不超过这几种

5. 预检请求（非简单请求）

• 请求方式：get,post,head之外的请求
• 请求头中包含自定义头部字段
• 向服务器发送了application/json格式数据
  注：在浏览器与服务器正式通信之前，会先发送OPTION请求进行预检，成功后再进行正式通信

6. jsonp浏览器通过/

• jsonp只能接受get请求
• 必须配置在CROS之前

const express=require('express')
const app=express()
app.use(express.urlencoded({extended:false}))
//响应jsonp数据请求
app.get('/test/jsonp',(req,res)=>{
    //前端需要以这种方式发起请求
    const funName=req.query.callback
    const name={name:'jack',age:20}
    //拼接成字符串后传给客户端
    const str=`${funName}${JSON.stringify(name)}`
    res.send(str)
})

app.listen(80,function(){
    console.log('express listen running');
})
//以jsonp发送请求时响应结果为自己请求的内容与name:'jack',age:20