


//package.json{ "name": "11.15-fileupload", "version": "1.0.0", "main": "index.js", "license": "MIT", "dependencies": { "koa": "^2.13.4", "koa-body": "^4.2.0", "koa-router": "^10.1.1", "koa-static": "^5.0.0" }}
//add.html//引入外部样式<link rel="stylesheet" href="http://cdn.bootcss.com/bootstrap/3.3.0/css/bootstrap.min.css"> <div class="container"> <form action="http://localhost:5000/file" method="POST" role="form" enctype="multipart/form-data"> <legend>添加小组成员</legend> <div class="form-group"> <label for="">姓名</label> <input type="text" class="form-control" name="username" placeholder="name"> </div> <div class="form-group"> <label for="">年龄</label> <input type="text" class="form-control" name="age" placeholder="age"> </div> <div class="form-group"> <label for="">上传图像</label> <input type="file" class="form-control" name="logo" placeholder="Input field"> </div> <button type="submit" class="btn btn-primary">添加数据</button> </form> </div>
//index.jsconst koa = require("koa");const app = new koa();const router = require("koa-router")();const static = require("koa-static");const koaBody = require("koa-body");const path = require("path");const fs = require("fs");router.get("/",async ctx=>{ ctx.body= "连接成功"})router.post("/file",async ctx=>{ /* name,age */ console.log(ctx.request.body) // console.log(ctx.request.files.logo.path) var logo = ctx.request.files.logo.path; /* 1、创建一个可读流 */ var reader = fs.createReadStream(logo); /* 2、获取上传图片所在的路径和扩展名 */ // console.log(path.basename(logo)) var uploadFile = `./static/${path.basename(logo)}`; /* 3、创建一个可写流 */ var writer = fs.createWriteStream(uploadFile); /* 4、将可读流通过管道写入可写流 */ reader.pipe(writer); console.log(ctx.origin+"/"+path.basename(logo)) ctx.body = "文件上传成功"})app.use(koaBody({ multipart: true, formidable: { maxFileSize: 200 * 1024 * 1024, keepExtensions: true }}))app.use(router.routes());app.use(static(path.join(__dirname,"static")))app.listen(5000)