文件上传
利用表单进行文件上传
[🚀第一步:创建表单]
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>测试文件上传</title>
<script src="../public/js/jquery.min.js"></script>
</head>
<body>
<h1>测试文件上传</h1>
<form action="#" method="post" enctype="multipart/form-data">
<input type="file" name="file" placeholder="请选择文件"/>
<button type="submit">上传</button>
</form>
</body>
</html>
[🚀第二步:安装依赖multer]npm install multer
[🚀第三步:引入multer模块]
//引入上传模块
let multer=require('multer');
[🚀第四步:配置上传]
//配置上传
const storage=multer.diskStorage({
destination:(req,file,cb)=>{
cb(null,'./uploads');//第二个参数表示文件存放位置
},
filename:(req,file,cb)=>{
//获取选中的文件名
let originalName=file.originalname;
console.log("老名字:"+originalName);
//存到服务器上的名字(加上当前时间毫秒数防止同名文件覆盖)
let newName=(new Date().getTime())+'-'+originalName;
console.log('保存到服务器上的name='+newName);
cb(null,newName);
}
})
[🚀第五步:使用配置]
const upload=multer({storage:storage});
[🚀第六步:创建上传文件路由]
由于我的router单独创了个文件夹进行写路由
如果你与我不同,你只需要var app=express();
将router.post()改为app.post()即可
upload.single()参数必须与表单的name一致
//上传文件路由
router.post('/up',upload.single('img'),(req,res)=>{
console.log(req.file);
console.log("上传成功");
});
[🚀第七步:进行测试]
NodeJs的文件上传完结,后期忘了可以进行翻阅此篇文章,CTRL+c,CTRL+v,很香😄😄😄