【决战Koa之巅-6】传JSON和传文件原来如此简单!

639 阅读1分钟

开门见山,使用 koa-body,来进行 JSON 和文件传参看看官方介绍:

image.png

它支持 multiparturlencoded, and json

安装

npm install koa-body

使用

传 JSON 参数

const koa = require("koa");
const Router = require("@koa/router");
const app = new koa();
const router = new Router();
const { koaBody } = require("koa-body");

router.post("/auth", async (ctx, next) => {
  const { uId } = ctx.request.body;
  ctx.body = `Hello world! ${uId}`;
});

app.use(koaBody());
app.use(router.routes());
app.listen(3000, () => {
  console.log("启动成功!http://localhost:3000");
});

验证:

image.png

传文件

增加路由如下:

router.post("/file", async (ctx, next) => {
  ctx.body = `Success!`;
});

传文件需要使用 form-data 格式,这里用 postman 验证:

image.png

然后你会发现,提示成功,但是并不知道图片传哪儿了!

当然是要做一些设置了,比如设置一下存储路径。

完整修改如下(替换代码中的YOUR_FILE_SAVE_PATH为你的路径):

const koa = require("koa");
const Router = require("@koa/router");
const app = new koa();
const router = new Router();
const { koaBody } = require("koa-body");

router.post("/auth", async (ctx, next) => {
  const { uId } = ctx.request.body;
  ctx.body = `Hello world! ${uId}`;
});

router.post("/file", async (ctx, next) => {
  ctx.body = `Success!`;
});

app.use(
  koaBody({
    multipart: true,
    formidable: {
      keepExtensions: true,
      uploadDir: "/YOUR_FILE_SAVE_PATH/"
    }
  })
);
app.use(router.routes());
app.listen(3000, () => {
  console.log("启动成功!http://localhost:3000");
});

这样,上传后就会在目录下生成文件:

image.png

至此,支持 JSON 和上传文件就集成完毕,后面是一些扩展问题:

  1. 上传后的命名能否修改?
  2. 同一张图片多次上传命名是否一样?
  3. 如何用 URL 访问上传的图片?

聪明的读者们可以先想一想,后续教程将会解答。

Demo

JSON & File-Demo