直接就是上手Koa2

105 阅读3分钟

创建服务器koa实例

const Koa = require('koa')
const app = new Koa
​
ctx.body = {}  //对象中写响应前端的数据
app.listen(3000)  //监听端口号

创建路由router实例

const router = require('koa-router')()  
//注意koa-router返回的是个函数、执行后返回router对象

router.get('/路由', async ctx => {  //路由的响应
  await ctx.render('响应准备渲染的文件夹中渲染index.html的文件')
})
​
router.post('/路由', async ctx => { 
    //返回给前端的数据
})
​
//动态路由写法
router.post('/koa/:id',async ctx => {
  console.log(ctx.params)    //{ id: '1' }
})
​
app  //代码最后写这个固定写法
  .use(router.routes())
  .use(router.allowedMethods())
  .listen(3000)

koa-body模块(处理 post 请求)

const koaBody = require('koa-body')
​
app.use(koaBody()) 
//之后就能在中间件中调取请求的数据
//ctx.request.body(post请求)   ctx.request.query(get请求)

//koaBody(opt)单独配置接收的数据格式时需要配置参数 opt是配置对象
//配置opt对象
let opt = {
  multipart: true, //支持多文件上传
  strict:false,  //支持delete请求
  encoding: "gzip", //接收gzip压缩形式
  formidable: {
    // 设置接收的文件的存放地址
    uploadDir: resolve(__dirname, "uploadDir"), 
    maxFileSize: 1024 * 500, //文件大小
    keepExtensions: true, // 保持默认文件后缀名
    onFileBegin(name,file){
        //文件上传前的一些设置操作 
        //file.path可以控制文件保存整个的路径
        //所以也可以控制重命名文件名
    }
  }
}

//一个post路由内使用 koaBody() 的例子(写了2个中间件):
router.post('/update',
async (ctx, next) => {
  try {
    //写一个中间件检擦接收的文件是否符合配置opt的逻辑
    await next()  //中间件模式
  }catch{}
}, 
koaBody(opt), 
async ctx => {
  ctx.body = "{data}"
})

@koa/cors模块(解决跨域问题)

const cors = require('@koa/cors')
app.use(cors())  //允许任何域的请求

koa-views模块(响应解析的html等超文本)

const views = require('koa-views')
​
app.use(views('准备渲染的静态文件夹路径'), {
    // 加载解析的文档到app上
  extension: "文件夹中文件的后缀名" //例如pug  html是默认值
})
//resolve(__dirname,"./views")   点斜杠 别忘了

koa-static模块(访问静态链接自动响应)

const koaStatic = require('koa-static')
​
app.use(koaStatic(静态链接的文件夹路径))
//设置了静态资源后所有访问该文件夹内的文件路径都不要加目录文件夹名 加了反而出问题

解决前后端路由的冲突

const fs = require('fs');  //文件系统模块
const { resolve } = require('path')  //文件路径模块

//方法一: 在后端的根文件(index.js)最后写
app.use( async ctx => {
    ctx.type = 'html';
    ctx.body = fs.createReadStream(resolve(__dirname,'./public/index.html'));
})

//方法二: 在后端的路由文件夹的根路由文件(routers/index.js)最后加
r.get('/:id', ctx => {
    ctx.type = 'html'; 
    ctx.body = fs.createReadStream(resolve(__dirname,'../public/index.html'));
})
​

koa-session模块

const session = require('koa-session')
​
app.keys = ['secret']   // 密钥
const CONFIG = {
  key: 'koa:sess', //cookie的key。 (默认是 koa:sess) 
  maxAge: 86400000, // cookie的过期时间单位ms(默认是一天)
  overwrite: true,//是否可重写
  httpOnly: true,//不允许前端可见
  singed: true,
  //这个是对客户端Cookie的签名
  //也就是用一个特别的字符加密(多一个sig的cookie文件)
  //保证客户端Cookie不会被伪造出来
  rolling: true //响应时刷新
}
app.use(session(CONFIG, app))
​
​
//ctx.session.isNew  这是判断用户是否是登录状态  ture为未登录
//delete ctx.session 删除session

cookies的设置和清除

ctx.cookies.set(name, value, {options})
// 通过 options 设置 cookie name 的 value  
//{maxAge: 60 * 1000 * 60,httpOnly: true}

ctx.cookies.get('name')
// Koa 中获取 Cookie 的值

ctx.cookies.set('name','',{signed:false,maxAge:0}) 
//清除cookie代码示例