koa2实现文件上传。

在使用koa2进行文件上传的时候,我写了一个中间件用来处理url,然而我在从新配置上传文件的url的时候,需要指定一下,upload.single('file'),这让我原来的url处理中间件会出错,才开始,我在中间件的Post那里做了个判断,如果url===“”uploadFile“”,增加upload.single('file'),然而上床文件没有什么反应。

最后突然看到,我的中间件那里可以自定义一个新的函数,让中间件函数处理的不是.js文件,而是自定义一个新的函数,专门用来处理文件上传,这样也不用在原来的主文件中增加代码,妨碍主文件的可读性。废话不说上代码:

controller.js

var fs = require('fs');
function addMapping(router,mapping) {
	for (var url in mapping) {
		if (url.startsWith('GET')) {
			//如果url类似GET ***
			var path = url.substring(4);
			router.get(path,mapping[url]);
			console.log(`register URL mapping:GET ${path}`);
		} else if (url.startsWith('POST')) {
			var path = url.substring(5);
			router.post(path,mapping[url]);
			console.log(`register URL mapping: POST ${path}`);
		} else if (url.startsWith('PUT')) {
			var path = url.substring(4);
			router.put(path,mapping[url]);
			console.log(`register URL mapping: PUT ${path}`);
		} else if (url.startsWith('DELETE')) {
			var path = url.substring(7);
			router.del(path,mapping[url]);
			console.log(`register URL mapping: DELETE ${path}`);
		}else {
			console.log(`invalid URL :${url}`);
		}
		
	}
}
function addControllers(router,dir) {
	//使用sync是因为启动时只用一次,不存在性能问题
	fs.readdirSync(__dirname + '/'+ dir).filter((f) => {
		//过滤出.js文件
		return f.endsWith('.js');
	}).forEach((f) => {
		console.log(`process controller:${f}...`);
		//导入js文件
		let mapping = require(__dirname + '/' + dir + '/' + f);
		addMapping(router,mapping);
	});
}
function addUploadFile(router) {
	//文件上传
	const multer = require('koa-multer');
	//配置
	var storage = multer.diskStorage({
		//文件保存路径
		destination:function (req,file,cb) {
			cb(null,'./public/uploads/img/')
		},
		filename:function (req,file,cb){
			var fileFormat = (file.originalname).split(".");
			cb(null,Date.now() + "." + fileFormat[fileFormat.length - 1]);
		}
	})
	var upload = multer({storage:storage});
	//upload.single('file')这里面的file是上传空间的name<input type="file" name="file"/>  
	router.post('/uploadFile',upload.single('file'),async (ctx,next) => {
		ctx.response.body ="<h1>上传成功!</h1>";
		/*ctx.body = {  
	    		filename: ctx.req.file.filename//返回文件名  
	  	} */
	  	ctx.redirect('/index');
	})
	console.log(`register URL mapping: POST /uploadFile`);
}
module.exports = function (dir) {
	let controllers_dir = dir || 'controllers',
		router = require('koa-router')();
	addControllers(router,controllers_dir);
	addUploadFile(router);
	return router.routes();
};
app.js

const Koa = require('koa');
const bodyParser = require('koa-bodyparser');
const controller = require('./controller');
const templating = require('./templating');
const app = new Koa();


const isProduction = process.env.NODE_ENV === 'production';

app.use(async(ctx,next) => {
	console.log(`Process ${ctx.request.method} ${ctx.request.url}...`);
	var start = new Date().getTime(), 
         execTime; 
    await next(); 
    execTime = new Date().getTime() - start; 
    ctx.response.set('X-Response-Time', `${execTime}ms`);
});

app.use(bodyParser());

app.use(templating('views',{
	noCache: !isProduction,
	watch: !isProduction
}));

// static file support: 
let staticFiles = require('./static-files'); 
app.use(staticFiles('/static/', __dirname + '/static')); 

app.use(controller());
app.listen(3000);
console.log('app started at port 3000....');
这样就完美的使用了中间件处理了文件上传。





  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
好的,我可以帮你实现基于 TypeScript 和 Koa 框架的文件上传和文件信息展示。首先,我们需要安装以下依赖: ```bash npm install koa koa-body koa-router @types/koa @types/koa-body @types/koa-router ``` 然后,我们可以创建一个 `upload.ts` 文件,实现文件上传和文件信息展示的逻辑。示例代码如下: ```typescript import Koa from 'koa'; import koaBody from 'koa-body'; import Router from 'koa-router'; import { File } from 'form-data'; interface UploadedFile { filename: string; type: string; data: Buffer; } const app = new Koa(); const router = new Router(); // 处理文件上传 router.post('/upload', koaBody({ multipart: true, }), async (ctx) => { const uploadedFile: UploadedFile = { filename: ctx.request.files.file.name, type: ctx.request.files.file.type, data: ctx.request.files.file.path, }; const file: File = new File([uploadedFile.data], uploadedFile.filename, { type: uploadedFile.type }); // 这里需要自己实现文件存储逻辑 // ... ctx.body = '上传成功'; }); // 展示文件信息 router.get('/file/:filename', async (ctx) => { const filename = ctx.params.filename; // 这里需要自己实现读取文件信息的逻辑 // ... const file: File = new File([fileData], filename); ctx.body = { filename: file.name, size: file.size, type: file.type, }; }); app.use(router.routes()); app.listen(3000, () => { console.log('Server is running on http://localhost:3000'); }); ``` 这个示例代码实现了一个文件上传和文件信息展示的接口。首先,我们定义了一个 `UploadedFile` 接口来表示上传的文件,然后在处理文件上传时,将 `koa-body` 解析出的文件数据转换成 `UploadedFile` 对象,并使用 `File` 类型来表示文件对象。在这里,我们只是将文件数据保存在了内存中,你需要自己实现文件存储逻辑。 在展示文件信息的接口中,我们根据文件名读取文件数据,并使用 `File` 类型来表示文件对象。然后,返回文件的元数据给客户端。 需要注意的是,这个示例代码中并没有实现文件存储和读取的逻辑,请根据自己的需求自行实现。同时,为了简化示例代码,这里只返回了文件的一些基本信息,实际上你可能需要返回更多的信息。
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值