使用nodejs+express实现简单的文件上传功能


Posted in NodeJs onDecember 27, 2017

1.建立express项目

express -e nodejs-uploadfile

2.下载multer中间件

npm i multer or yarn multer

3.在routes/index.js中引用multer,由于还要使用到文件操作,还要引用fs模块,并指定文件上传目录

const multer = require('multer');
const fs = require('fs');
const UPLOAD_PATH = './uploads'

单文件上传: index.html中文件如下( form文件的类型必须为 enctype="multipart/form-data" ),

<form action="/upload" method="post" enctype="multipart/form-data">
 <input name="fileUpload" type="file" />
 <img src="" alt="">
 <button type="submit">上传</button>
</form>

在routes/index.js里面添加upload路由用来处理上传文件的操作

router.post('/upload', upload.single('fileUpload'), function (req, res, next) {
 const { file } = req;
 fs.readFile(file.path, function(err, data) {
 fs.writeFile(`${UPLOAD_PATH}/${file.originalname}`, data, function (err) {
  if (err) res.json({ err })
  res.json({
  msg: '上传成功'
  });
 });
 })
})

如果上传的文件是图片的话,还可以使用FileReader对象实现图片预览

(function($){
 $('input').on('change', function(event) {
 var files = event.target.files,
  reader = new FileReader();
 if(files && files[0]){
  reader.onload = function (ev) {
   $('img').attr('src', ev.target.result);
  }
  reader.readAsDataURL(files[0]);
 }
 })
}(jQuery))

多文件上传: 多文件上传的原理和单文件上传的原理一样,代码如下:

router.post('/upload', upload.array('fileUpload'), function (req, res, next) {
 const files = req.files;
 const response = [];
 const result = new Promise((resolve, reject) => {
 files.map((v) => {
  fs.readFile(v.path, function(err, data) {
  fs.writeFile(`${UPLOAD_PATH}/${v.originalname}`, data, function(err, data) {
   const result = {
   file: v,
   }
   if (err) reject(err);
   resolve('成功');
  })
  })
 })
 })
 result.then(r => {
 res.json({
  msg: '上传成功',
 })
 }).catch(err => {
 res.json({ err })
 });
})

相关代码在 github.com/bWhirring/n…

总结

以上所述是小编给大家介绍的使用nodejs+express实现简单的文件上传功能,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

NodeJs 相关文章推荐
nodejs之请求路由概述
Jul 05 NodeJs
nodejs简单实现中英文翻译
May 04 NodeJs
浅谈Nodejs中的作用域问题
Dec 26 NodeJs
详解NodeJs支付宝移动支付签名及验签
Jan 06 NodeJs
nodejs根据ip数组在百度地图中进行定位
Mar 06 NodeJs
NodeJS自定义模块写法(详解)
Jun 27 NodeJs
nodejs模块学习之connect解析
Jul 05 NodeJs
详解nodejs通过响应回写的方式渲染页面资源
Apr 07 NodeJs
详解NodeJs开发微信公众号
May 25 NodeJs
nodejs中用npm初始化来创建package.json的实例讲解
Oct 10 NodeJs
nodejs中各种加密算法的实现详解
Jul 11 NodeJs
详解NodeJS模块化
Jun 15 NodeJs
nodejs超出最大的调用栈错误问题
Dec 27 #NodeJs
nodejs实现简单的gulp打包
Dec 21 #NodeJs
nodejs调取微信收货地址的方法
Dec 20 #NodeJs
基于nodejs实现微信支付功能
Dec 20 #NodeJs
nodeJS微信分享
Dec 20 #NodeJs
NodeJS爬虫实例之糗事百科
Dec 14 #NodeJs
nodejs实现爬取网站图片功能
Dec 14 #NodeJs
You might like
linux实现php定时执行cron任务详解
2013/12/24 PHP
PHP中使用Memache作为进程锁的操作类分享
2015/03/30 PHP
PHP中STDCLASS用法实例分析
2016/11/11 PHP
jQuery DOM操作小结与实例
2010/01/07 Javascript
jquery引用方法时传递参数原理分析
2014/10/13 Javascript
jQuery实现精美的多级下拉菜单特效
2015/03/14 Javascript
JS实现带鼠标效果的头像及文章列表代码
2015/09/27 Javascript
JS简单实现DIV相对于浏览器固定位置不变的方法
2016/06/17 Javascript
javascript 产生随机数的几种方法总结
2017/09/26 Javascript
JS实现左边列表移到到右边列表功能
2018/03/28 Javascript
JS常见面试试题总结【去重、遍历、闭包、继承等】
2019/08/27 Javascript
jquery实现图片无缝滚动 蒙版遮蔽效果
2020/01/11 jQuery
Vue+Element UI 树形控件整合下拉功能菜单(tree + dropdown +input)
2020/08/28 Javascript
python格式化字符串实例总结
2014/09/28 Python
python对象及面向对象技术详解
2016/07/19 Python
Python+MongoDB自增键值的简单实现
2016/11/04 Python
Python实现的建造者模式示例
2018/08/06 Python
Python嵌套式数据结构实例浅析
2019/03/05 Python
python递归法解决棋盘分割问题
2019/07/17 Python
Django使用模板后无法找到静态资源文件问题解决
2019/07/19 Python
Python数据可视化实现正态分布(高斯分布)
2019/08/21 Python
Python小程序 控制鼠标循环点击代码实例
2019/10/08 Python
pytorch GAN伪造手写体mnist数据集方式
2020/01/10 Python
Python安装第三方库攻略(pip和Anaconda)
2020/10/15 Python
CSS3实现闪烁动画效果的方法
2015/02/09 HTML / CSS
印度电子产品购物网站:Vijay Sales
2021/02/16 全球购物
房屋买卖协议书
2014/04/10 职场文书
《观舞记》教学反思
2014/04/16 职场文书
歌颂祖国的演讲稿
2014/05/04 职场文书
监察建议书格式
2014/05/19 职场文书
优秀中职教师事迹材料
2014/08/26 职场文书
学习党的群众路线剖析材料
2014/10/09 职场文书
在职证明书模板
2015/06/15 职场文书
TensorFlow的自动求导原理分析
2021/05/26 Python
国庆节到了,利用JS实现一个生成国庆风头像的小工具 详解实现过程
2021/10/05 Javascript
码云(gitee)通过git自动同步到阿里云服务器
2022/12/24 Servers