• multer 实现图片上传



    首先必须配置multer,新建multer.js(我是在router目录下新建的)
    //上传图片
    //引进multer模块  记得在终端安装multer模块
    const multer = require('multer')
    开始配置
    const storage = multer.diskStorage({
    //上传图片的路径,是在你的静态目录下(public)uploads会自动进行创建
        destination: 'public/uploads',
     //给上传文件重命名,获取添加后缀名
        filename: function(req, file, callback){
    //在这里我是把图片命名为我当前登陆的用户名
            var user  = req.session.user;
            callback(null, `${user.name}.jpg`);
        }
    })
    //导出模块
    module.exports = multer({storage})

    然后使用在router目录下的index.js上引进  var uploads=require('./multer');

        //*****************上传图片*********************
        app.get('/user/photo',checkLogin)
        app.get('/user/photo',function(req,res){
        res.render('photo',{
            title:'发表',
            user:req.session.user,
            success:req.flash('success').toString(),
            error:req.flash('error').toString()
        })
    })
       app.post('/user/photo',checkLogin);
        app.post('/user/photo',uploads.single('photo'),function(req,res,next){
            req.flash('success','上传成功');
            res.redirect('/')
        })

    新建photo.ejs

    <%- include header %>
    <h1><%= user.name %></h1>
    
    <form action="/user/photo" method="post" enctype="multipart/form-data">
        <div class="form-group">
            <input type="file" name="photo" required accept=".jpg,.png"/>
        </div>
        <input type="submit" class="btn btn-success form-control" value="上传"/>
    </form>
    
    <%- include footer %>

    然后你会发现你的uploads目录下会有你上传的图片,如果让他显示出来 ,只需要给img的src属性设置他的路径即可。语言组织能力不是很强,可是很实用,哈哈

  • 相关阅读:
    k8S 搭建集群
    K8S搭建
    华为交换机常用命令
    JSP中动态include和静态include的区别
    什么情况下调用doGet()和doPost()
    get和post的区别
    什么是spring框架
    spring的作用
    什么是DI
    依赖注入的三种实现方式
  • 原文地址:https://www.cnblogs.com/athean/p/6800895.html
Copyright © 2020-2023  润新知