首先,我们需要一个form表单,用来提交数据.
<!-- html文件 -->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<!-- action表示提交到哪里 -->
<!-- method表示提交的方法,有get和post -->
<form action="http://localhost:3000/" method="post">
file:<input type="file" name="file_01"><br>
<input type="submit" value="submit">
</form>
</body>
</html>
然后我们需要一个js文件
const express=require('express');
const bodyParser=require('body-parser');
const server=express();
server.listen(3000,function(err){
if(!err){
console.log('server is listening 3000 port');
}else{
console.log(err);
}
});
server.use(bodyParser.urlencoded({extended:false}));
server.post('/',function(req,res){
console.log(req.body);
});
在cmd中启动服务器,并且打开html文件,选择任意文件上传.
我们发现,cmd显示:
{ file_01: 'bible.txt' }
但是这只是文件的名字,并没有把实质的数据传过来.
普通的post是无法上传文件的,我们必须使用enctype才可以上传.
enctype有三种值
application/x-www-form-urlencoded 表示上传值
multipart/form-data 上传实际的文件,不仅仅是值
text/plain 纯文本
另外body-parser也无法处理文件,因此我们需要新的模块multer.
multer模块可以帮我们处理文件上传.
const express=require('express');
const bodyParser=require('body-parser');
const multer=require('multer');
const server=express();
server.listen(3000,function(err){
if(!err){
console.log('server is listening 3000 port');
}else{
console.log(err);
}
});
const objMulter=multer();
//any表示可以接受任意文件
server.use(objMulter.any());
server.post('/',function(req,res){
//上传的文件在files里
console.log(req.files);
});
然后我们重新上传,我们发现cmd显示:
[ { fieldname: 'file_01',
originalname: 'bible.txt',
encoding: '7bit',
mimetype: 'text/plain',
buffer: <Buffer b2 ce cb ef ... >,
size: 494 } ]
但是这个是直接存在内存里的,极大的占用服务器的资源,因此我们要让它写进磁盘.因此我们可以这么做:
//multer接受一个json做参数
//json里有一个key值叫dest
//表示上传文件所存入的地址
const objMulter=multer({dest:'./www/upload'});
再次上传,我们发现upload文件夹下真的多了一个文件,但是这个文件没有后缀,不能正常的打开,因此我们希望上传来的文件需要有后缀名,因此我们需要用到fs模块和path模块.
const express=require('express');
const bodyParser=require('body-parser');
const multer=require('multer');
const fs=require('fs');
const pathLib=require('path');
const server=express();
server.listen(3000,function(err){
if(!err){
console.log('server is listening 3000 port');
}else{
console.log(err);
}
});
const objMulter=multer({dest:'./www/upload'});
//any表示可以接受任意文件
server.use(objMulter.any());
server.post('/',function(req,res){
//上传的文件在files里
var newName=req.files[0].path+pathLib.parse(req.files[0].originalname).ext;
fs.rename(req.files[0].path,newName,function(err){
if(err){
res.send(err);
}else{
res.send('succeed');
}
});
});
网友评论