1-1 初始化仓库

yarn init -y

1-2 安装依赖

yarn add koa koa-router koa-body

1-3 配置index.js

ctx.requst.files 读取上传的文件

  1. const koa = require("koa");
  2. const app = new koa();
  3. const router = require("koa-router")();
  4. const koaBody = require("koa-body");
  5. router.post("/file", async ctx => {
  6. console.log(ctx.request.files);
  7. ctx.body = "上传成功"
  8. })
  9. app.use(koaBody({
  10. multipart: true,
  11. formidable: {
  12. maxFileSize: 200 * 1024 * 1024, //设置默认上传文件的大小
  13. // 保留文件扩展名
  14. keepExtensions: true
  15. }
  16. }))
  17. app.use(router.routes());
  18. app.listen(5000);
@ html/file.html
<form action="http://localhost:5000/file" 
    enctype="multipart/form-data"
    method="post">
        <input type="file" name="logo"> <br>
        <input type="submit">
</form>

Tips:表单上传文件 一定要加上enctype =”multipart/form-data”

1-4 需要将数据上传到服务器

# path.basename()  可以获取路径中图片的名字及其拓展名
const path = require("path");
var file ="c:/data/logo.jpg";
console.log(path.basename(file))  //logo.jpg
# index.js
router.post("/file", async ctx => {
    var file = ctx.request.files.logo.path
    var baseName = path.basename(file);
    console.log(baseName)
    /* 1、创建一个可读流 */
    var reader =  fs.createReadStream(file);
    /* 2、设置上传图片的文件名 */
    var upFilePath =  `./static/${baseName}`;
    /* 3、创建一个可写流 */
    var writer = fs.createWriteStream(upFilePath);
    /* 4、可读流通过管道写入可写流 */
    reader.pipe(writer);

    ctx.body = "上传成功"
})

1-5 完成版

const koa = require("koa");
const app = new koa();
const fs = require("fs");
const path = require("path");
const router = require("koa-router")();
const koaBody = require("koa-body");
const static = require("koa-static");
router.post("/file", async ctx => {
    var file = ctx.request.files.logo.path
    var baseName = path.basename(file);
    console.log(baseName)
    /* 1、创建一个可读流 */
    var reader =  fs.createReadStream(file);
    /* 2、设置上传图片的文件名 */
    var upFilePath =  `./static/${baseName}`;
    /* 3、创建一个可写流 */
    var writer = fs.createWriteStream(upFilePath);
    /* 4、可读流通过管道写入可写流 */
    reader.pipe(writer);

    ctx.body = "上传成功"
})
app.use(static(path.join(__dirname,"static")))
app.use(koaBody({
    multipart: true,
    formidable: {
        maxFileSize: 200 * 1024 * 1024,    //设置默认上传文件的大小
           // 保留文件扩展名
        keepExtensions: true
    }
}))
app.use(router.routes());

app.listen(5000);