本文用node进行图片上传主要借助formidable插件,具体使用步骤如下:

  1、安装formidable插件  

npm install formidable -D

  2、引入依赖包   

const formidable = require('formidable');

  3、接口实现逻辑

 1 router.post('/uploadFile', (req, res, next) => {
 2   let form = new formidable.IncomingForm();
 3   form.encoding = 'utf-8';
 4   //上传到服务器指定文件夹
 5   form.uploadDir =`public/${constant.UPLOAD_FOLDER}`;
 6   form.keepExtensions = true;     //保留后缀
 7   form.maxFieldsSize = constant.IMAGE_SIZE;
 8   let data = new MsgBean('上传失败',1);
 9   form.parse(req, (err, fields, files) => {
10     if (err) {
11       data.setContent(err);
12       res.send(data);
13       return;
14     }
15     let file = files.file;
16     let fileType = new RegExp(file.type, 'g');
17
18     let isLegal = fileType.test(constant.IMAGE_TYPE);
19     if(!isLegal) {//判断上传图片格式是否合法
20         data.msg('非法的图片格式');
21         res.send(data);
22         return;
23     }
24     let fileSize = file.size;
25     if(fileSize > constant.IMAGE_SIZE) {//上传图片超出最大限度
26         data.msg('图片大小超出最大限制');
27         res.send(data);
28         return;
29     }
30     let index = file.name.lastIndexOf('.');
31     let oldPath = files.file.path;
32     let uploadDate = new Date().getTime();
33     let fileName = `${file.name.slice(0, index)}_${uploadDate}_origin.${file.name.slice(index+1)}`;
34     let newPath = `public/${constant.UPLOAD_FOLDER}/${fileName}`;
35     fs.rename(oldPath, newPath, err => {//图片更名
36         if(err) {
37             data.setContent('图片解析失败');
38             res.send(data);
39             return;
40         }
41         let baseUrl = req.headers.host;
42         let imgUrl = `http://${baseUrl}/${constant.UPLOAD_FOLDER}/${fileName}`;
43         let result =  {
44             imgUrl
45         };
46         data.setCode(0);
47         data.setContent(result);
48         data.setMsg('上传成功');
49         res.send(data);
50     });
51   })
52 });

转载于:https://www.cnblogs.com/gerry2019/p/10343557.html

Node.js之图片上传相关推荐

  1. node.js实现图片上传(包含缩略图)

    图片上传 使用multiparty插件实现上传 安装multiparty npm i --save multiparty 代码实现 const multiparty = require('multip ...

  2. node.js实现图片上传

    两步走战略: 将图片上传到服务器 将图片的路径保存到数据库 图片上传到服务器 下载第三方插件multer npm install multer --save 先写一个上传图片的接口 在路由文件夹中创建 ...

  3. 使用Node.js express 开发上传文件/图片api接口

    我是傲夫靠斯,欢迎关注我的公众号[前端工程师的自我修养],每天更新. 今天我们来搞一个Node.js Express的上传文件功能,我使用了busboy这个库. Busboy是一个基于事件的文件流解析 ...

  4. node.js实现formdata上传文件

    node.js实现formdata上传文件 1.关于formdata XMLHttpRequest Level 2 添加了一个新的接口--FormData.利用 FormData 对象,我们可以通过 ...

  5. 如何上传图片到fileupload空间_如何用原生js写图片上传组件v2.0(还有新版本)?...

    js图片上传组件: 基本要求: 1.上传的图片可预览,可删除,可被覆盖更新 2.要求图片格式为jpg和png,大小不能超过2M 新加需求: 1.模拟回显,可用本地存储(实际上的回显是通过后台传过来的u ...

  6. js实现图片上传预览及进度条

    js实现图片上传预览及进度条 原文js实现图片上传预览及进度条 最近在做图片上传的时候,由于产品设计的比较fashion,上网找了比较久还没有现成的,因此自己做了一个,实现的功能如下: 1:去除浏览器 ...

  7. js实现图片上传预览功能

    js实现图片上传预览功能 很多业务场景下,我们需要在用户上传图片前,先预览待上传的图片 <body><input type="file"><img s ...

  8. 前端js实现图片上传

    前端js实现图片上传的原理是通过input标签的type=file属性将input标签定义为上传文件,对input进行onchange事件的监听,当input的value值改变时代表用户已经上传了图片 ...

  9. 手机端移动端的前端原生js裁剪图片上传

    手机端移动端的前端原生js裁剪图片上传 选择头像时裁剪上传,确保图片是个正方形,不会出现压扁拉伸的现象 效果图 原理很简单,其实就是用canvas截图出来而已,只是要对比例做一下处理. <!-- ...

  10. 关于editor网页编辑器ueditor.config.js 配置图片上传

    最近公司项目在做一个门户网站,其中新闻和简介等部分使用到了ueditor编辑器,但是上级明确指示需要图片上传这个功能,这时却发现图片上传功能不能正常使用,上传时一直报错,网上收了好几个处理办法,都说的 ...

最新文章

  1. RStudio v1.2.1335 发布,R 语言的集成开发环境
  2. 一路撑起支付宝的OceanBase数据库,背后究竟有哪些杀手锏?| 云·创课程报名
  3. Powershell 渗透测试工具-Nishang
  4. linux iconv函数失败,Linux 编码转换 (iconv失败的解决方法)
  5. idea 与springboot 快捷键
  6. 数码管和573锁存器的细节问题
  7. c++ map底层_深入浅出Redisredis底层数据结构(上)
  8. Markdown YYDS,但是编辑器依旧可以更好 | CSDN编辑器测评
  9. linux下c语言scanf,C语言输入scanf
  10. 玩转linux 中间的yum 命令
  11. Python 最抢手、Java 最流行,前线程序员揭秘 2019 软件开发现状
  12. vc++6.0常用插件和界面库
  13. php 编译指定libiconv,PHP升级编译出错 libiconv_open及 apache libiconv
  14. Gitee上传代码 提示remote Incorrect username or password ( access token )错误原因
  15. string entitlement = Application.dataPath+ “/Editor/Entitle Unity工程到处iOS工程,用脚本把Push Notifications打开
  16. 「网络流 24 题」餐巾计划 【网络流】
  17. STM32内部RAM在线调试配置方法及详细说明(基于Keil开发工具)
  18. 将UTC(字符串包含TZ的时间)时间转换成本地时间 python
  19. 软工实践 - 第十一次作业 Alpha 冲刺 (3/10)
  20. ACC-C++组初赛

热门文章

  1. poj 3071 Football 概率dp
  2. Illustrator 教程,如何在 Illustrator 中修改形状?
  3. Illustrator 教程,如何在 Illustrator 中更改角色的姿势?
  4. Mac 不能进入睡眠模式,如何修复?
  5. MacBook 显示未连接任何摄影机,视频镜头不能用怎么办?
  6. iOS开发之将base64位编码的字符串转换为图片,data转图片,图片转data
  7. Microsoft 365 for Mac(原Office 365)
  8. 如何在Mac设置开机自启程序项
  9. 图像处理软件Acorn for Mac如何创建新图像?
  10. BZOJ 5277 IQ题orz