使用nodeJs的express框架实现图片上传

在开发项目过程中,少不了上传图片,可以通过form表单上传图片,前端代码:

 <form enctype="multipart/form-data" id="form1" method="POST" action="/upload">
    <input type="file" id="instructions" name="instructions" multiple="multiple">
    <button type="submit">提交</button>
</form>

给表单设置**enctype=“multipart/form-data”**属性。
后端路由代码(post方式获取):

router.post("/",(req,res)=>{
    const form = new multiparty.Form();  // 表单 name 
    form.encoding = "UTF-8";   // 设置编码
    form.uploadDir = "./uploadtemp";   // 设置临时文件中转站 
    form.maxFilesSize = 2*1024*1024;   // 2M  // 设置上传图片的最大内存
    form.parse(req,function(err, fields, files){
        if(err) throw err;        // fields 文件域对象        // files 图片文件 
        var uploadUrl = "/images/upload/";
        console.log(files)
        file = files['instructions'];  // 图片信息  
        originalFilename = file[0].originalFilename,  // 1.jpg 
        tempath = file[0].path;   // 临时的文件路径 
        var timestamp = new Date().getTime();  
        uploadUrl += timestamp+originalFilename;   // /images/upload/12342314214521.jpg
        var newPath = "./public"+uploadUrl; // 最终的文件路径 
        var fileRead = fs.createReadStream(tempath);   // 可读流 可写流
        var fileWrite = fs.createWriteStream(newPath);
        fileRead.pipe(fileWrite)  // pipe 管道输送 数据
        
        fileWrite.on("close",()=>{ // pipe 监听 关闭 删除临时文件夹里面的图片 
            fs.unlinkSync(tempath);
            res.json({err:"",msg:uploadUrl}) // msg uploadUrl 
        })
    })
})

以上就是表单上传图片操作。
cnpm i express-generator -g 全局安装express框架
express -e 文件夹名称 新建一个新的express项目文件
cnpm/npm i 反向安装依赖模块

猜你喜欢

转载自blog.csdn.net/qq_40375518/article/details/107511631
今日推荐