koa使用koa-multer进行文件的上传和表单的提交

下图是我建立的文件夹的布局

koa使用koa-multer进行文件的上传和表单的提交_第1张图片

1、前端页面(方便演示,我简单做一个表单)

	

姓名:


学号:


爱好:


选择文件



这里的话是存在文件和表单数据的,现在我们要做的是在后台可以获取到表单数据

看我的app.js文件

const Koa = require('koa');
const router = require('koa-router')();  //注意:引入的方式
const app = new Koa();
const render = require('koa-art-template');
const static = require('koa-static');
const multer = require('koa-multer');


//以下是配置
var storage = multer.diskStorage({
	//定义文件保存路径
	destination:function(req,file,cb){
	    cb(null,'./upload/');//路径根据具体而定。如果不存在的话会自动创建一个路径
	},                       //注意这里有个,
	//修改文件名
	filename:function(req,file,cb){
	    var fileFormat = (file.originalname).split(".");
    	    cb(null,Date.now() + "." + fileFormat[fileFormat.length - 1]);
	}
})

var upload = multer({ storage: storage });

/*配置模板路径*/
render(app,{
    root:path.join(__dirname,'views'),
    extname:'.html',
    debug:process.env.NODE_ENV !=='production'
});
//配置静态资源中间件
app.use(static(__dirname + '/public'));

router.post('/upload',upload.single('file'), async (ctx, next) => {
 
  console.log(ctx.req.body);
  ctx.body = {
    filename: ctx.req.file.filename  //返回文件名 
  }
})

app.use(router.routes());//启动路由
app.use(router.allowedMethods());

app.listen(3000,()=>{
    console.log('starting at port 3000');
});
最后在upload文件夹里就可以看见我们的上传的文件。

koa使用koa-multer进行文件的上传和表单的提交_第2张图片

在控制台那里输出



这样我们就获取到了文件和表单数据了。


你可能感兴趣的:(koa使用koa-multer进行文件的上传和表单的提交)