node+multer实现图片上传的示例代码


Posted in Javascript onFebruary 18, 2020

最近在学习node实现一个后台管理系统,用到了图片上传,有一些小问题记录一下~

直接上代码,问题都记录在注释里~

const express = require('express');
const path = require('path');
const multer = require('multer');
const app = new express();

// 设置静态目录 第一个参数为虚拟的文件前缀,实际上文件系统中不存在
// 可以用public做为前缀来加载static文件夹下的文件了
app.use('/public', express.static(path.join(__dirname, './static')));

// 根据当前文件目录指定文件夹
const dir = path.resolve(__dirname, '../static/img');
// 图片大小限制KB
const SIZELIMIT = 500000;

const storage = multer.diskStorage({
  // 指定文件路径
  destination: function(req, file, cb) {
    // !!!相对路径时以node执行目录为基准,避免权限问题,该目录最好已存在*
    // cb(null, './uploads');
    cb(null, dir);
  },
  // 指定文件名
  filename: function(req, file, cb) {
    // filedname指向参数key值
    cb(null, Date.now() + '-' + file.originalname);
  }
});

const upload = multer({
  storage: storage
});

app.post('/upload', upload.single('file'), (req, res) => {
  // 即将上传图片的key值 form-data对象{key: value}
  // 检查是否有文件待上传
  if (req.file === undefined) {
    return res.send({
      errno: -1,
      msg: 'no file'
    });
  }
  const {size, mimetype, filename} = req.file;
  const types = ['jpg', 'jpeg', 'png', 'gif'];
  const tmpTypes = mimetype.split('/')[1];
  // 检查文件大小
  if (size >= SIZELIMIT) {
    return res.send({
      errno: -1,
      msg: 'file is too large'
    });
  }
  // 检查文件类型
  else if (types.indexOf(tmpTypes) < 0) {
    return res.send({
      errno: -1,
      msg: 'not accepted filetype'
    });
  }
  // 路径可根据设置的静态目录指定
  const url = '/public/img/' + filename;
  res.json({
    errno: 0,
    msg: 'upload success',
    url
  });
});

app.listen(3000, () => {
  console.log('service start');
});

附上文档参考链接:
express框架
path模块
multer
最后再附赠一个node自动重启工具nodemon

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
JavaScript 解析Json字符串的性能比较分析代码
Dec 16 Javascript
给文字加上着重号的JS代码
Nov 12 Javascript
JavaScript代码应该放在HTML代码哪个位置比较好?
Oct 16 Javascript
对JavaScript中this指针的新理解分享
Jan 31 Javascript
理解JavaScript中worker事件api
Dec 25 Javascript
基于Bootstrap重置输入框内容按钮插件
May 12 Javascript
深入理解angular2启动项目步骤
Jul 15 Javascript
从零开始搭建一个react项目开发
Feb 09 Javascript
VUE Error: getaddrinfo ENOTFOUND localhost
May 03 Javascript
快速解决select2在bootstrap模态框中下拉框隐藏的问题
Aug 10 Javascript
vue-cli3 DllPlugin 提取公用库的方法
Apr 24 Javascript
vue-cli+webpack项目打包到服务器后,ttf字体找不到的解决操作
Aug 28 Javascript
JavaScript canvas绘制圆弧与圆形
Feb 18 #Javascript
javascript中的with语句学习笔记及用法
Feb 17 #Javascript
JS实现百度搜索框关键字推荐
Feb 17 #Javascript
js实现百度淘宝搜索功能
Feb 17 #Javascript
JavaScript使用canvas绘制随机验证码
Feb 17 #Javascript
JavaScript中this的学习笔记及用法整理
Feb 17 #Javascript
Vue 中使用 typescript的方法详解
Feb 17 #Javascript
You might like
PHP实现获取客户端IP并获取IP信息
2015/03/17 PHP
PHP+MySql+jQuery实现的&quot;顶&quot;和&quot;踩&quot;投票功能
2016/05/21 PHP
Yii2 RESTful中api的使用及开发实例详解
2016/07/06 PHP
阿里云的WindowsServer2016上部署php+apache
2018/07/17 PHP
在网站上应该用的30个jQuery插件整理
2011/11/03 Javascript
jquery中dom操作和事件的实例学习 仿yahoo邮箱登录框的提示效果
2011/11/30 Javascript
javascript 得到文件后缀名的思路及实现
2020/05/09 Javascript
js随机生成网页背景颜色的方法
2015/02/26 Javascript
js实现简单的联动菜单效果
2015/08/19 Javascript
JavaScript+canvas实现七色板效果实例
2016/02/18 Javascript
全国省市二级联动下拉菜单 js版
2016/05/10 Javascript
微信小程序 swiper制作tab切换实现附源码
2017/01/21 Javascript
详解VueJs异步动态加载块
2017/03/09 Javascript
利用js查找数组中指定元素并返回该元素的所有索引示例
2017/03/29 Javascript
ES6新特性之数组、Math和扩展操作符用法示例
2017/04/01 Javascript
详解jquery插件jquery.viewport.js学习使用方法
2017/09/08 jQuery
详解ES6 Promise对象then方法链式调用
2018/10/20 Javascript
JS实现数组去重,显示重复元素及个数的方法示例
2019/01/21 Javascript
谈谈node.js中的模块系统
2020/09/01 Javascript
[02:16]卖萌的僵尸 DOTA2神话信使飞僵小宝来袭
2014/03/24 DOTA
[01:07:19]DOTA2-DPC中国联赛 正赛 CDEC vs XG BO3 第一场 1月19日
2021/03/11 DOTA
python在指定目录下查找gif文件的方法
2015/05/04 Python
Python使用email模块对邮件进行编码和解码的实例教程
2016/07/01 Python
python模块smtplib学习
2018/05/22 Python
Python实现的微信好友数据分析功能示例
2018/06/21 Python
基于Python制作一副扑克牌过程详解
2020/10/19 Python
Boden澳大利亚官网:英国在线服装公司
2018/08/05 全球购物
您的时尚,您的生活方式:DTLR Villa
2019/12/25 全球购物
SQL Server面试题
2013/04/04 面试题
大学生在校学习的自我评价
2014/02/18 职场文书
毕业实习自我鉴定范文2014
2014/09/26 职场文书
2015年六一儿童节演讲稿
2015/03/19 职场文书
求职导师推荐信范文
2015/03/27 职场文书
2015国庆节宣传语
2015/07/14 职场文书
国庆节主题班会
2015/08/15 职场文书
使用canvas仿Echarts实现金字塔图的实例代码
2021/11/11 HTML / CSS