koa学习

koa

hello world

复制代码
const Koa = require('koa')

const app = new Koa()


app.listen(8000,()=>{
  console.log('koa server success')
})

中间件:只能通过use来注册中间件

复制代码
// 中间件
app.use((ctx,next)=>{
  console.log('koa 普通中间件')
  ctx.response.body = 'hello koa middleware'

  next()
})

路由使用 koa-router

安装 npm install koa-router

创建路由文件 routers/users.js

复制代码
//routers/users.js
const Router = require('koa-router')
const router = new Router({prefix:'/users'})

// 用户列表接口 /users/lists

router.get('/lists',  (ctx, next) => {
  ctx.response.body = 'user lists'
})

module.exports = router

引入路由,注册路由

复制代码
const Koa = require('koa')

const userRouter = require('./routers/user')

const app = new Koa()

//  使用路由
app.use(userRouter.routes())
// 处理405和501错误
app.use(userRouter.allowedMethods()) 


app.listen(8000,()=>{
  console.log('koa server success')
})

参数解析

params 和 query

复制代码
const router = require('koa-router')

const userRouter = new router({prefix:'/users'})

userRouter.get('/:id', (ctx,next)=>{
  console.log('获取params参数', ctx.params)
  console.log('获取query参数', ctx.query)
  ctx.response.body = 'user id:'+ctx.params.id
})

app.use(userRouter.routes())

//请求路径 /users/yyy?username=yyy&password=123456Aa
//打印内容
//获取params参数 { id: 'yyy' }
//获取query参数 { username: 'yyy', password: '123456Aa' }

json 和 urlencoded

安装第三方插件 koa-bodyparser'

npm install koa-bodyparser'

引入插件,自动解析json和urlencoded参数
复制代码
const bodyParser = require('koa-bodyparser')

app.use(bodyParser())

app.use((ctx,next)=>{
    
    console.log('请求体参数', ctx.request.body)
    ctx.response.body = 'requset body parser'

})

form-data 参数解析

安装koa-multer插件

npm install koa-multer

引入,注册插件

`

const multer = require('koa-multer')

const upload = multer()

loginRouter.post('/', upload.any(), (ctx,next)=>{

console.log('form-data 数据', ctx.req.body) // 注意是在ctx.req.body中获取解析数据

ctx.response.body = 'login success'

})

`

文件上传

复制代码
const multer = require('koa-multer')


const storage = multer.diskStorage({
    // 文件保存路径
    destination: function (req, file, cb) {
        cb(null, './uploads/')
    },
    // 修改文件名称
    filename: function (req, file, cb) {  
      console.log('file', file)
      // 使用更安全的方式生成文件名
      const filename = Date.now() + '-' + Math.round(Math.random() * 1E9) + file.originalname
      cb(null, filename)
    }
})

const upload = multer({storage: storage})

uploadRouter.post('/image', upload.single('file'), (ctx,next)=>{

    ctx.response.body = 'upload success'
})

部署静态资源

安装插件 npm install koa-static

部署

复制代码
const staticAssets= require('koa-static')
app.use(staticAssets(__dirname + '/public')) // 接收静态资源目录
相关推荐
我命由我123451 天前
JS 开发问题:url.includes is not a function
开发语言·前端·javascript·html·ecmascript·html5·js
@PHARAOH3 天前
WHAT - 替代 Express 和 Koa 的现代轻量版 Hono
前端·微服务·express·koa
我命由我123454 天前
Element Plus - 在 el-select 的每个选项右侧添加按钮
前端·javascript·vue.js·前端框架·ecmascript·html5·js
我命由我123455 天前
Element Plus - Cascader 观察记录(基本使用、动态加载、动态加载下的异常环境)
开发语言·前端·javascript·vue.js·typescript·html5·js
我命由我123455 天前
Element Plus - Form 的 resetField 方法观察记录
开发语言·前端·javascript·vue.js·html·html5·js
CyrusCJA6 天前
JavaScript原型与super关键字
前端·javascript·js
nibabaoo6 天前
前端开发攻略---Vue3项目中实现指定区域的打印预览与 PDF 导出功能
vue3·js·打印预览pdf
我命由我123457 天前
Vue Router - 记录一下 2 种路由写法
前端·javascript·vue.js·前端框架·html·html5·js
我命由我123458 天前
React - state、state 的简写方式、props、props 的简写方式、类式组件中的构造器与 props、函数式组件使用 props
前端·javascript·react.js·前端框架·html·html5·js