Koa2简明笔记

最新推荐文章于 2024-07-23 13:54:34 发布
最新推荐文章于 2024-07-23 13:54:34 发布
阅读量71 收藏
点赞数
分类专栏： Node.js 文章标签： node.js
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_44600038/article/details/133623032
版权

文章目录

起步

安装

$ npm init -y
$ npm install koa

第一个程序

新建 index.js 文件

const Koa = require('koa')
const app = new Koa()

app.use(async ctx => {
  ctx.body = 'Hello World'
})

app.listen(3000)

启动

$ node index.js

开发环境可以使用 nodemon 来进行热更新

$ npm install nodemon -D

修改 package.json 文件，添加 "dev": "nodemon index.js"

{
  "name": "koa-demo",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
+   "dev": "nodemon index.js"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "dependencies": {
    "koa": "^2.13.4"
  },
  "devDependencies": {
    "nodemon": "^2.0.20"
	}
}

此时使用 npm run dev 来运行我们的开发环境

路由

安装 koa-router

$ npm install @koa/router

修改 index.js 文件

const Koa = require('koa')
const app = new Koa()
const router = require('@koa/router')()

router.get('/test', ctx => {
  ctx.body = 'test page'
})

app.use(router.routes()).use(router.allowedMethods())

app.listen(3000)

重新执行 node index.js 或者等待 nodemon 热加载完毕

访问 http://localhost:3000/test，此时可以看到页面输出内容 test page

获取请求数据

获取GET请求数据

  • query 形式传参，通过 ctx.request.query 获取参数（request可省略），形如 ?xxx=xxx&xxx=xxx
router.get('/test', ctx => {
  const query = ctx.request.query
  ctx.body = {
    query
  }
})

访问 http://localhost:3000/test?name=zs&age=22，输出：

{
  "query": {
    "name": "zs",
    "age": "22"
  }
}
  • params 形式传参，通过 ctx.request.params 获取参数（request可省略），形如 /users/xxx
router.get('/users/:id', ctx => {
  const params = ctx.request.params
  ctx.body = {
    params
  }
})

访问 http://localhost:3000/users/1，输出：

{
  "params": {
    "id": "1"
  }
}

获取POST请求数据

使用 koa-body 中间件

安装

$ npm install koa-body

index.js 文件中

const Koa = require('koa')
const app = new Koa()
const router = require('@koa/router')()
+ const koaBody = require('koa-body')

+ app.use(koaBody())

router.post('/', ctx => {
  const body = ctx.request.body
  ctx.body = {
    body
  }
})

app.use(router.routes()).use(router.allowedMethods())

app.listen(3000)

使用 ctx.request.body 接收 post 传参

可以使用 postman 、apifox 等 api 调试工具进行测试，或者使用 jetbrains 开发工具的 .http 文件进行测试

在这里插入图片描述

此时返回响应

{
  "body": {
    "id": 999,
    "value": "content"
  }
}

静态资源

安装 koa-static

$ npm install koa-static

根目录新建 assets/index.css 文件，写入

#app {
    background-color: #ccc;
}

index.js 文件中

const Koa = require('koa')
const app = new Koa()
const router = require('@koa/router')()
const koaBody = require('koa-body')
+ const koaStatic = require('koa-static')
+ const path = require('path')

app.use(koaBody())
+ app.use(koaStatic(path.resolve(__dirname, 'assets')))

router.get('/', ctx => {
    ctx.body = '111'
})

app.use(router.routes()).use(router.allowedMethods())

app.listen(3000)

访问 http://localhost:3000/index.css

文件上传

const Koa = require('koa')
const app = new Koa()
const router = require('@koa/router')()
const {koaBody} = require('koa-body')
const koaStatic = require('koa-static')
const path = require('path')

app.use(koaBody())
+ app.use(koaStatic(path.resolve(__dirname, 'upload')))


router.post('/upload', koaBody({
    multipart: true,
    formidable: {
        uploadDir: path.resolve(__dirname, 'upload'),
        keepExtensions: true,
    }
}), ctx => {
    const {file} = ctx.request.files
    ctx.body = {
        url: `${ctx.origin}/${file.newFilename}`
    }
})

app.use(router.routes()).use(router.allowedMethods())

app.listen(3000)

postman 测试

浏览器打开 http://localhost:3000/6a70c105d00700018d83b5203.jpg 即可访问图片

模板引擎

art-template

安装 art-template

$ npm install art-template koa-art-template

使用

新建 view/index.art 文件

<!doctype html>
<html lang="zh">
<head>
  <meta charset="UTF-8">
  <meta name="viewport"
        content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>Document</title>
</head>
<body>
  <h1>{{ title }}</h1>
</body>
</html>

index.js 文件

const Koa = require('koa')
const app = new Koa()
const router = require('@koa/router')()
const render = require('koa-art-template')

render(app, {
  root: path.join(__dirname, 'view'),
  extname: '.art',
  debug: process.env.NODE_ENV !== 'production'
})

router.get('/', ctx => {
  ctx.render('index', {
    title: 'hello art-template'
  })
})

app.use(router.routes()).use(router.allowedMethods())

app.listen(3000)

更多语法参考 https://aui.github.io/art-template/zh-cn/docs/index.html

错误处理

使用 koa-onerror 对错误进行处理，返回 json 格式

安装

$ npm install koa-onerror

使用

const Koa = require('koa')
const app = new Koa()
const onerror = require('koa-onerror')

// 404 Not Found
app.use(async (ctx, next) => {
    await next()
    if (ctx.status === 404) {
        ctx.throw(404)
    }
})

// error handler
onerror(app, {
    accepts() {
        return 'json'
    },
    json(err, ctx) {
        ctx.body = {
            code: ctx.status || 500,
            msg: err.message
        }
    }
})

使用 ctx.throw([status], [msg], [properties]) 抛出异常，如：ctx.throw(401, 'id is required')

数据库

koa2 中常使用 orm 框架来操作数据库，其中最常见的两个框架为 mongoose 和 sequelize ，分别对应 MongoDB 数据库和 MySQL 数据库。此外，sequelize 还支持 MariaDB，SQLite 和 PostgreSQL 数据库

mongoose

安装
$ npm install mongoose
连接
const mongoose = require('mongoose')

mongoose.connect('mongodb://username:password@host/database', {
  useNewUrlParser: true,
  useUnifiedTopology: true
}).then(() => {
  console.log('数据库连接成功')
}).catch(error => {
  console.log(error)
  console.log('数据库连接失败')
})
创建一个模型
const mongoose = require('mongoose')

const userSchema = new mongoose.Schema({
  username: {
    type: String,
    required: true
  },
  password: {
    type: String,
    required: true
  },
  email: String,
  avatar: String
})
const User = mongoose.model('User', userSchema)
增删改查
  • 增
router.post('/users', async ctx => {
  const { username, password } = ctx.request.body
  const user = await User.create({ username, password })
  ctx.body = {
    user
  }
})

请求

POST http://localhost:3000/users
Content-Type: application/json

{
  "username": "admin",
  "password": "123456"
}

响应

{
  "user": {
    "username": "admin",
    "password": "123456",
    "_id": "6352c002f55b91e7f9187c6f",
    "__v": 0
  }
}
  • 改
router.put('/users', async ctx => {
  const { id } = ctx.query
  const { username, password } = ctx.request.body
  const user = await User.findByIdAndUpdate(id, { username, password }, { new: true })
  ctx.body = {
    user
  }
})

请求

PUT http://localhost:3000/users?id=6352c002f55b91e7f9187c6f
Content-Type: application/json

{
  "username": "admin1",
  "password": "123456789"
}

响应

{
  "user": {
    "_id": "6352c002f55b91e7f9187c6f",
    "username": "admin1",
    "password": "123456789",
    "__v": 0
  }
}
  • 删
router.delete('/users', async ctx => {
  const { id } = ctx.query
  const { username, password } = ctx.request.body
  const user = await User.findByIdAndDelete(id, { username, password }, { new: true })
  ctx.body = {
    user
  }
})

请求

DELETE http://localhost:3000/users?id=6352c002f55b91e7f9187c6f

响应

{
  "user": {
    "_id": "6352c002f55b91e7f9187c6f",
    "username": "admin1",
    "password": "123456789",
    "__v": 0
  }
}
  • 查
router.get('/users',  async ctx => {
  const {id} = ctx.query
  if (!id) {
    const users = await User.find()
    ctx.body = {
      users
    }
  } else {
    const user = await User.findById(id)
    ctx.body = {
      user
    }
  }
})

请求1

GET http://localhost:3000/users

响应1

{
  "users": [
    {
      "_id": "6352c35680bd9bce302ad3f2",
      "username": "admin",
      "password": "123456",
      "__v": 0
    }
  ]
}

请求2

GET http://localhost:3000/users?id=6352c35680bd9bce302ad3f2

响应2

{
  "user": {
    "_id": "6352c35680bd9bce302ad3f2",
    "username": "admin",
    "password": "123456",
    "__v": 0
  }
}

const Koa = require('koa')
const app = new Koa()
const router = require('@koa/router')()
const koaBody = require('koa-body')
const koaStatic = require('koa-static')
const path = require('path')
const render = require('koa-art-template')

const mongoose = require('mongoose')

mongoose.connect('mongodb+srv://root:yuan521jin@oyal.vysd5.mongodb.net/koa-demo?ssl=true&authSource=admin', {
  useNewUrlParser: true,
  useUnifiedTopology: true
}).then(() => {
  console.log('数据库连接成功')
}).catch(error => {
  console.log(error)
  console.log('数据库连接失败')
})

app.use(koaBody())
app.use(koaStatic(path.resolve(__dirname, 'assets')))
app.use(koaStatic(path.resolve(__dirname, 'upload')))
render(app, {
  root: path.join(__dirname, 'view'),
  extname: '.art',
  debug: process.env.NODE_ENV !== 'production'
})

const userSchema = new mongoose.Schema({
  username: {
    type: String,
    required: true
  },
  password: {
    type: String,
    required: true
  },
  email: String,
  avatar: String
})

const User = mongoose.model('User', userSchema)

router.get('/users',  async ctx => {
  const {id} = ctx.query
  if (!id) {
    const users = await User.find()
    ctx.body = {
      users
    }
  } else {
    const user = await User.findById(id)
    ctx.body = {
      user
    }
  }
})

router.post('/users', async ctx => {
  const { username, password } = ctx.request.body
  const user = await User.create({ username, password })
  ctx.body = {
    user
  }
})

router.put('/users', async ctx => {
  const { id } = ctx.query
  const { username, password } = ctx.request.body
  const user = await User.findByIdAndUpdate(id, { username, password }, { new: true })
  ctx.body = {
    user
  }
})

router.delete('/users', async ctx => {
  const { id } = ctx.query
  const user = await User.findByIdAndDelete(id)
  ctx.body = {
    user
  }
})


router.post('/upload', koaBody({
  multipart: true,
  formidable: {
    uploadDir: path.resolve(__dirname, 'upload'),
    keepExtensions: true,
  }
}), ctx => {
  const { file } = ctx.request.files
  console.log(file)
  ctx.body = {
    url: `${ctx.origin}/${file.newFilename}`
  }
})

app.use(router.routes()).use(router.allowedMethods())

app.listen(3000)
远小帅
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
专栏目录
Koa2基础笔记
Tml的博客
12-01 1142
中间件、路由、请求参数解析、错误处理
koa2-study:koa 学习笔记
05-18
**Koa2 学习笔记概述** `Koa2` 是一个由 `Express` 团队开发的基于 `Node.js` 的下一代 web 开发框架，它以简洁、优雅的 API 设计著称，旨在提高开发效率和代码可读性。在 `Koa2` 中，中间件是其核心特性，通过洋葱...
免费的计算机编程类中文书籍
SunnyMarkLiu
04-21 1436
免费的编程中文书籍索引，欢迎投稿。 国外程序员在 stackoverflow 推荐的程序员必读书籍，中文版。stackoverflow 上的程序员应该阅读的非编程类书籍有哪些？ 中文版github 上的一个流行的编程书籍索引 中文版 参与交流 欢迎大家将珍藏已久的经典免费书籍共享出来，您可以： 使用 Issues 以及 Pull Request 贡献者名单: http
计算机电子书 2016 BiliDrive 备份
热门推荐
龙哥盟
12-15 5万+
下载方式 根据你的操作系统下载不同的 BiliDrive 二进制。 执行： bilidrive download <link> 链接 文档 链接 Go入门指南.epub (1.87 MB) bdrive://b171489e7f5eae9f92fc45f7626d1942db643130 nwjs-doc.epub (2.83 MB) bdrive://d030...
程序员必备学习资源资料库！！！免费开发书籍中文版大全
kaggle expert，全球排名前1000，清华计算机研究生，兴趣算法工程
05-18 1252
语言无关 IDE IntelliJ IDEA 简体中文专题教程 Web 3 Web Designs in 3 Weeks Chrome 开发者工具中文手册 Chrome扩展及应用开发 Chrome扩展开发文档 Growth: 全栈增长工程师指南 Grunt中文文档 Gulp 入门指南 gulp中文文档 HTTP 接口设计指北 HTTP/2.0 中文翻译 http2讲解 JSON风格指南 Wireshark用户手册 一站式学习Wireshark 关于浏览器和网络的 20 项须
koa2Demo1:koa 2学习计划
05-14
koa2koa2 学习笔记koakoa是Express的下一代基于Node.js的web框架，目前有1.x和2.0两个版本,2.0基于ECMA7 async awaitBabelBabel是一个JavaScript编写的转码器，它可以把高版本JavaScript代码转换成低版本JavaScript...
koa2-http-proxy-middleware：koa2 http代理中间件
02-03
koa2请求转发中间件 用法 初始化中间件 const Koa = require ( 'koa' ) const app = new Koa ( ) const PORT = 3000 const koaBodyparser = require ( 'koa-bodyparser' ) const httpProxy = require ( 'koa2-...
koa2Study.rar
09-05
【Koa2 框架详解】 Koa2 是基于 Node.js 的下一代 web 开发框架，由 Express 团队的原班人马打造。它旨在提供一个轻量、灵活且强大的基础，帮助开发者构建现代的 web 应用。在 Koa2 中，核心特性是中间件，它们按照...
使用koa2创建web项目的方法步骤
10-17
您可能感兴趣的文章:详解Vue SSR（ Vue2 + Koa2 + Webpack4）配置指南详解React项目的服务端渲染改造(koa2+webpack3.11)使用webpack打包koa2 框架appnode使用Koa2搭建web项目的方法 koa2创建web项目 相关文章 在 ...
【Node.js】初识 Node.js
小秀的博客
07-18 1065
事件驱动就是当进来一个新的请求的时，请求将会被压入一个事件队列中，然后通过一个循环来检测队 列中的事件状态变化，如果检测到有状态变化的事件，那么就执行该事件对应的处理代码，一般都是回调函数。例如在执行了访问数据库的代码之后，将立即转而执行其后面的代码，把数据库返回结果的处理代码放在回调函数中，从而提高了程序的执行效率。Nodejs采用了非阻塞型I/0机制，在做I/0操作的时候不会造成任何的阻塞，当完成之后，以时 间的形式通知执行操作。其实，Nodejs能实现几乎一切的应用，只考虑适不适合使用它。
【Node.js基础03】利用http模块创建Web服务
大前端开发工程师、互联网方向创业者
07-20 396
利用http、fs、path模块，创建Web服务程序
Vue前端工程化 安装Vue-Cli与node.js 最详细步骤（带图展示）
2301_80035882的博客
07-23 300
【代码】Vue前端工程化 安装Vue-Cli与node.js 最详细步骤（带图展示）
Node.js知识点总结
weixin_62831076的博客
07-18 1668
Node.js其本质和浏览器一样是一个JavaScript运行环境。浏览器的运行环境为V8引擎+浏览器内置API（BOM、DOM、Canvas);而node.js的运行环境是V8引擎+node提供的API(fs、path、http)。它使JavaScript可以编写后端。
【教程】在 VS Code 集成终端中解决 Node.js 环境变量识别问题
最新发布
Beihai_Van的博客
07-23 186
【代码】【教程】在 VS Code 集成终端中解决 Node.js 环境变量识别问题。
聊一聊 Node.js V22.5 有啥重要更新
前端达人
07-22 245
大家好，今天我们来聊聊 Node.js 最新发布的 V22.5 版本。作为一名开发者，每次看到新的版本更新，总是让人期待不已。V22.5 中新增了许多强大且实用的功能，让我们的开发工作更加高效便捷。在这篇文章中，我们将重点讨论以下几个更新：新增 node:sqlite 模块（由 Colin Ihrig 提供）#53752新增 matchesGlob 方法（由 Aviv Keller 提供）#528...
探索NVM：让Node.js开发如虎添翼的利器
拥有必珍惜
07-22 490
在这个日新月异的编程世界里，Node.js凭借其高效的非阻塞I/O操作和轻量级的事件驱动模型，成为了全栈开发、微服务架构及实时Web应用的热门选择。然而，随着项目规模的扩大和依赖库的增多，Node.js版本管理和依赖管理成为了开发者不得不面对的挑战。今天，就让我们一起走进NVM（Node Version Manager）的世界，看看它是如何解决这些问题的，并学会如何优雅地使用它。NVM，全称Node Version Manager，是一款专为Node.js设计的版本管理工具。
【Node.js基础02】fs、path模块
大前端开发工程师、互联网方向创业者
07-20 210
node.js中两个重要模块，fs模块以及path模块的应用
node.js实现静态资源加载的方法——两种方法http及express
x15514104477的博客
07-23 156
node.js中实现静态资源的两种方法，其一：使用原生node，其二：使用express模块中内置中间件static去实现
Node.js与Koa2：打造下一代Web应用，从基础到实战部署
《Node.js与Koa2构建下一代Web应用：异步与await实践》是一本深度讲解Node.js开发的实战指南，特别关注Koa2框架。本书适合对JavaScript有一定了解、具备Web开发基础，并已接触过AngularJS或ReactJS的开发者。作者...
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值