| 「这是我参与11月更文挑战的第19天,活动详情查看:2021最后一次更文挑战」 |
|---|
本文介绍koa以下功能的使用和用法:
koa-json协议处理koa-combine-routers合并路由koa-helmet安全协议通信头koa-static静态资源上传图片
koa-json:按照json格式数据的传输
koa将返回结果用json格式显示的插件
安装:npm install -S koa-json
...
//引入
var json = require('koa-json');
...
//使用
app.use(json({ pretty: false, param: 'pretty' }));
...
//案例:
// http://localhost:3000/details?id=1&name=jiangyx
返回结果:{"foo":"bar"}
// 路径加pretty
// http://localhost:3000/details?id=1&name=jiangyx&pretty
返回结果:
{
"foo": "bar"
}
合并路由(路由压缩):koa-combine-routers
安装:npm install koa-combine-routers
// 安装:npm install koa-combine-routers
// app.js
const Koa = require('koa')
const router = require('./routes')
const app = new Koa()
app.use(router())
// routers.js
const Router = require('koa-router')
const combineRouters = require('koa-combine-routers')
const dogRouter = new Router()
const catRouter = new Router()
dogRouter.get('/dogs', async ctx => {
ctx.body = 'ok'
})
catRouter.get('/cats', async ctx => {
ctx.body = 'ok'
})
const router = combineRouters(
dogRouter,
catRouter
)
module.exports = router
加入安全头:koa-helmet
安装:npm install koa-helmet -S
// 安装:npm install koa-helmet -S
// 使用:
const Koa = require("koa");
const helmet = require("koa-helmet");
const app = new Koa();
app.use(helmet());
app.use((ctx) => {
ctx.body = "Hello World"
});
app.listen(4000);
静态资源:koa-static
安装:npm install -S koa-static
安装:npm install -S koa-static
使用:
const serve = require('koa-static');
const Koa = require('koa');
const app = new Koa();
// $ GET /package.json
app.use(serve('.'));
// $ GET /hello.txt
app.use(serve('test/fixtures'));
// or use absolute paths
app.use(serve(__dirname + '/test/fixtures'));
app.listen(3000);
console.log('listening on port 3000')
上传图片
- 基础功能:图片上传、生成图片链接-
- 附加功能:限制上传图片的大小与类型、生成高中低三种分辨率的图片链接、生成CDN
安装
npm i koa-body
npm i koa-static
app.js
const KoaBody = require("koa-body");
const serve = require("koa-static");
// 静态资源目录
app.use(serve(path.join(__dirname, "public")));
// 解析 body
app.use(
KoaBody({
multipart: true,
formidable: {
uploadDir: path.join(__dirname, "public/uploads"),
keepExtensions: true,
},
})
);
controllers/common.js
// Content-Type 为 multipart/form-data 才会被解析
upload(ctx) {
const file = ctx.request.files.file;
const basename = path.basename(file.path);
ctx.body = {
url: `${ctx.origin}/uploads/${basename}`,
};
}
public/index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
</head>
<body>
<form action="/upload" enctype="multipart/form-data" method="POST">
<!-- 必须指定 name 否则后端获取不到文件 -->
<input type="file" name="file" accept="image/*" />
<!-- accept可以指定允许上传的图片类型,比如image/gif, image/jpeg,多种类型用逗号隔开 -->
<button type="submit">上传</button>
</form>
</body>
</html>