zoukankan      html  css  js  c++  java
  • 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属性设置他的路径即可。语言组织能力不是很强,可是很实用,哈哈

  • 相关阅读:
    01: Django rest framework 基础
    配置java环境 启动服务
    配置文件详解
    介绍
    所有的编译安装包
    mysql 二进制安装
    使用Python 、 go 语言测试rabbitmq的工作机制
    Haproxy + Rabbit 集群 简要介绍
    rabbitmqctl 的常用命令
    虚拟主机介绍
  • 原文地址:https://www.cnblogs.com/athean/p/6800895.html
Copyright © 2011-2022 走看看