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

  1、安装formidable插件  

npm install formidable -D

  2、引入依赖包   

const formidable = require('formidable');

  3、接口实现逻辑

 router.post('/uploadFile', (req, res, next) => {
let form = new formidable.IncomingForm();
form.encoding = 'utf-8';
//上传到服务器指定文件夹
form.uploadDir =`public/${constant.UPLOAD_FOLDER}`;
form.keepExtensions = true; //保留后缀
form.maxFieldsSize = constant.IMAGE_SIZE;
let data = new MsgBean('上传失败',1);
form.parse(req, (err, fields, files) => {
if (err) {
data.setContent(err);
res.send(data);
return;
}
let file = files.file;
let fileType = new RegExp(file.type, 'g'); let isLegal = fileType.test(constant.IMAGE_TYPE);
if(!isLegal) {//判断上传图片格式是否合法
data.msg('非法的图片格式');
res.send(data);
return;
}
let fileSize = file.size;
if(fileSize > constant.IMAGE_SIZE) {//上传图片超出最大限度
data.msg('图片大小超出最大限制');
res.send(data);
return;
}
let index = file.name.lastIndexOf('.');
let oldPath = files.file.path;
let uploadDate = new Date().getTime();
let fileName = `${file.name.slice(0, index)}_${uploadDate}_origin.${file.name.slice(index+1)}`;
let newPath = `public/${constant.UPLOAD_FOLDER}/${fileName}`;
fs.rename(oldPath, newPath, err => {//图片更名
if(err) {
data.setContent('图片解析失败');
res.send(data);
return;
}
let baseUrl = req.headers.host;
let imgUrl = `http://${baseUrl}/${constant.UPLOAD_FOLDER}/${fileName}`;
let result = {
imgUrl
};
data.setCode(0);
data.setContent(result);
data.setMsg('上传成功');
res.send(data);
});
})
});

Node.js之图片上传的更多相关文章

  1. Node.js实现图片上传功能

    node接口实现 const express = require('express') const mysql = require('mysql') const cors = require('cor ...

  2. 使用express+multer实现node中的图片上传

    使用express+multer实现node中的图片上传 在前端中,我们使用ajax来异步上传图片,使用file-input来上传图片,使用formdata对象来处理图片数据,post到服务器中 在n ...

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

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

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

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

  5. [前端 4] 使用Js实现图片上传预览

    导读:今天做图片上传预览,刚开始的做法是,先将图片上传到Nginx,然后重新加载页面才能看到这个图片.在这个过程中,用户一直都看不到自己上传的文件是什么样子.Ps:我发现我真的有强迫症了,都告诉我说不 ...

  6. js判断图片上传时的文件大小,和宽高尺寸

    今天在做图片上传的小功能,使用了一个kissy上传组件.很好奇它是如何在图片上传前,检测到图片的大小和尺寸的?我们来写个小实例实现一下吧 如何读取图片的size 首先,原生input file控件有个 ...

  7. js实现图片上传及预览---------------------->>兼容ie6-8 火狐以及谷歌

    <head runat="server"> <title>图片上传及预览(兼容ie6/7/8 firefox/chrome)</title> & ...

  8. PHP+js实现图片上传,编辑

    文件上传,点击按钮并选择文件后,文件会临时存到一个位置,会有一个临时名字: 然后在php文件中处理,给文件起名并将文件从临时为止搬到服务器,把需要的文件信息返回给前端页面: 最后表单提交时,把文件信息 ...

  9. html + js 实现图片上传,压缩,预览及图片压缩后得到Blob对象继续上传问题

    先上效果 上传图片后(设置了最多上传3张图片,三张后上传按钮消失) 点击图片放大,可以使用删除和旋转按钮 (旋转功能主要是因为ios手机拍照后上传会有写图片被自动旋转,通过旋转功能可以调正) html ...

随机推荐

  1. Maven安装配置操作

    1)下载maven安装包并解压: 2)环境变量配置: 3)编辑环境变量Path,追加%MAVEN_HOME%\bin; 4)maven安装配置后进行dos命令检查:在cmd中输入 mvn -v 5)配 ...

  2. 详解Jquery选择器

    1.常见的选择器 id,类,标签选择器. $("#a1") $(".myclass") $("div") 2.组合选择器 $("# ...

  3. Ubuntu14.04+caffe+CPU

    刚刚在上篇博客记录了windows10下GPU版本caffe的安装,正准备跑跑论文里的代码,发现好多命令都是.sh命令,这是linux系统的脚本文件.不能直接在windows下运行,于是我想把.sh转 ...

  4. C语言函数调用栈(一)

    程序的执行过程可看作连续的函数调用.当一个函数执行完毕时,程序要回到调用指令的下一条指令(紧接call指令)处继续执行.函数调用过程通常使用堆栈实现,每个用户态进程对应一个调用栈结构(call sta ...

  5. HTTP SIP 认证

    HTTP请求报头: Authorization HTTP响应报头: WWW-Authenticate   HTTP认证  基于  质询  /回应(  challenge/response)的认证模式. ...

  6. ORACLE与SQLSERVER数据转换

    前言: 将SQLServer数据库中的表和数据全量导入到Oracle数据库,通过Microsoft SqlServer Management Studio工具,直接导入到oracle数据库,免去了生成 ...

  7. Sudo的用法和Visudo设置

    身为程序员,你可以活在一个没有Windows的世界,当你离不开Unix(Linux,Mac...).而在Unix下面,你离不开terminal,离不开sudo. 你知道sudo command,然后输 ...

  8. java 扫描输入

    到目前为止,从文件或标准输入读取数据还是一件相当痛苦第事情,一般第解决之道就是读入一行文本,对其进行分词,然后使用Integer Double 等类第各种解析方法来解析数据: //: strings/ ...

  9. hdu3193 降维+rmq

    /* 给定n个数对(p,d),如果有这么一个数对(pi,di),其他所有的数对都不能严格小于这个数对 请求出有多少个这样的数对! 解法:对于数对(p,d),能找到在[1,p-1]之间的小于d的数对,那 ...

  10. poj1470 LCA倍增法

    倍增法模板题 #include<iostream> #include<cstring> #include<cstdio> #include<queue> ...