NodeJs koa2 Upload Files

[Reprinted from:] https://www.jianshu.com/p/34d0e1a5ac70

Knowledge to explain

koa2 frame is a frame based middleware, i.e., need to use functions such as route (koa-router), log (koa-logger), you can find the corresponding middleware library, i.e. npm package, then app.use (...) imported.
Subject of this article: Upload Files is by reference to the corresponding intermediate to achieve.
I looked at the statistics, we found that file upload can be achieved middleware has three, one will be able to choose:
1) KOA-body
2) busboy
3) KOA-multer
differences on these three middleware can check their own online information, here I choose more pleasing to the eye koa-body, practical and simple.

Code

Step a: Download koa-body npm package

npm install koa-body –save

npm install koa-body --save

Step two: Quote koa-body middleware koa project

const koaBody = require('koa-body');
app.use(koaBody({
    multipart: true,
    formidable: {
        maxFileSize: 200*1024*1024    // 设置上传文件大小最大限制,默认2M
    }
}));

Step 3: Use koa-body middleware, you can get files uploaded by ctx.request.files

Reminder: Smile
The new version of the koa-body get uploaded files ctx.request.files
old version of koa-body get files uploaded by ctx.request.body.files
friends do not into the pit Kazakhstan, himself into the pit too long time.

Step four: After you get to the file by fs save the file to a specified directory server

Upload a single file:

router.post('/uploadfile', async (ctx, next) => {
  // 上传单个文件
  const file = ctx.request.files.file; // 获取上传文件
  // 创建可读流
  const reader = fs.createReadStream(file.path);
  let filePath = path.join(__dirname, 'public/upload/') + `/${file.name}`;
  // 创建可写流
  const upStream = fs.createWriteStream(filePath);
  // 可读流通过管道写入可写流
  reader.pipe(upStream);
  return ctx.body = "上传成功!";
});


Upload multiple files:

router.post('/uploadfiles', async (ctx, next) => {
  // 上传多个文件
  const files = ctx.request.files.file; // 获取上传文件
  for (let file of files) {
    // 创建可读流
    const reader = fs.createReadStream(file.path);
    // 获取上传文件扩展名
    let filePath = path.join(__dirname, 'public/upload/') + `/${file.name}`;
    // 创建可写流
    const upStream = fs.createWriteStream(filePath);
    // 可读流通过管道写入可写流
    reader.pipe(upStream);
  }
 return ctx.body = "上传成功!";
});

Front-end code

The way to the front of the code also attach the front end, to send the file to your server by submitting the form

<form action="http://localhost:8080/api/upload" method="post" enctype="multipart/form-data">
    <input type="file" name="file" id="file" value="" multiple="multiple" />
    <input type="submit" value="提交"/>
</form>


Concluded

Today, when implementing file uploading in the project, also accidentally into a little pit, and why? (See above Step Three)
Much of the information on the Internet are looking to get the files uploaded by ctx.request.body.files, this is an older version of a file koa-body acquisition method, for safety reasons, a new version of koa-body uses ctx.request.files to get the file.
Conclusion on the causes, he wanted to learn to find official documents, official documents-based, supplemented by other documents, such fishes.

Guess you like

Origin www.cnblogs.com/yaoyinglong/p/12199286.html