nodejs图片上传
node中图片上传的中间键很多,比如formidable等,这里我们使用nodejs中的fs来实现文件上传处理:
1、安装中间键connect-multiparty
npm install connect-multiparty
通过connect-multiparty中间键我们可以实现req.files的功能,这样可以拿到上传文件的大小、类型等一系列参数,对其进行判断,从而达到限制上传的目的。
2、connect-multiparty的使用
var multipart = require('connect-multiparty');
var multipartMiddleware = multipart();
....
router.post('/upload', multipartMiddleware, function (req, res) {
....
}
在需要引入的js页面顶部引入上面代码,再在相应的路由中如上引入,然后通过req.files即可直接获取上传的文件参数。
3、完整实例:
index2.html文件:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>文件上传实例</title>
</head>
<body> <form enctype="multipart/form-data" action="/upload" method="post">
<input type="file" name="uploadFile" id="upload" />
<input type="submit" value="上传"/>
</form> </body>
</html>
app.js配置:
var routes = require('./routes/index');
...
//设置post文件大小
app.use(bodyParser.json({limit: '50mb'}));
app.use(bodyParser.urlencoded({limit: '50mb', extended: true}));
app.set('views', path.join(__dirname, 'views'));
var template = require('art-template');
template.config('base', '');
template.config('extname', '.html');
app.engine('.html', template.__express);
app.set('view engine', 'html');
...
app.use('/', routes);
index.js文件:
/**
* Created by chaozhou on 2015/11/9.
*/
var express = require('express');
var router = express.Router();
var tags = require('../modules/tag.js');
var multipart = require('connect-multiparty');
var multipartMiddleware = multipart();
var fs = require("fs"); router.get('/', function(req, res, next) {
res.render("index2");
}); router.post('/upload', multipartMiddleware,function(req, res) {
var type = req.files.uploadFile.type;
var size = req.files.uploadFile.size;
var maxSize = 800 * 1024; //800K
type = type.split("/")[1];
if (type != "jpeg" && type != "jpg" && type != "png") {
res.send({"errMsg": "请上传png、jpg、jpeg格式照片"});
return;
} else if (size > maxSize) {
res.send({"errMsg": "图片大小不要超过800K"});
return;
} else if (type == "jpeg" || type == "jpg" || type == "png" && size < maxSize) {
fs.readFile(req.files.uploadFile.path, function (err, data) {
if (err) {
res.send({"errMsg": "'图片上传失败'"});
return;
}
var base64str = new Buffer(data).toString('base64'); //图片转字节
fs.writeFileSync("public/upload/" + "upload."+type, base64str, 'base64'); //写入本地
res.send("<input type='image' src='/upload/upload."+type+"'/>");
});
}
}); module.exports = router;
在public目录下新建upload上传文件夹,上传的图片统一放在这里:

浏览器上传效果:


上传成功!
nodejs图片上传的更多相关文章
- 使用connect-multiparty限制nodejs图片上传
connect-multiparty中间件,可用于获取文件上传时各种参数,比如文件大小.格式等,具体使用: var multipart = require('connect-multiparty'); ...
- 图片上传之FileAPI与NodeJs
HTML5之fileAPI HTML5之fileAPI使得我们处理图片上传更加简单. 实例 html代码 <div class="form-group"> <la ...
- nodeJs实现微信小程序的图片上传
今天我来介绍一下nodejs如何实现保存微信小程序传过来的图片及其返回 首先wx.uploadFile绝大部分时候是配合wx.chooseImage一起出现的,毕竟选择好了图片,再统一上传是实现用户图 ...
- nodejs 接收上传的图片
1.nodejs接收上传的图片主要是使用formidable模块,服务器是使用的express搭建. 引入formidable var formidable = require('./node_mod ...
- NodeJs实现图片上传
关于formidable NodeJs实现图片上传,此处主要用了插件:formidable github上关于formidable的资料如下: https://github.com/felixge/n ...
- Nodejs之MEAN栈开发(四)---- form验证及图片上传
这一节增加推荐图书的提交和删除功能,来学习node的form提交以及node的图片上传功能.开始之前需要源码同学可以先在git上fork:https://github.com/stoneniqiu/R ...
- 使用express+multer实现node中的图片上传
使用express+multer实现node中的图片上传 在前端中,我们使用ajax来异步上传图片,使用file-input来上传图片,使用formdata对象来处理图片数据,post到服务器中 在n ...
- multer实现图片上传
multer实现图片上传: ejs代码: <!DOCTYPE html> <html lang="en"> <head> <meta ch ...
- 基于Node的React图片上传组件实现
写在前面 红旗不倒,誓把JavaScript进行到底!今天介绍我的开源项目 Royal 里的图片上传组件的前后端实现原理(React + Node),花了一些时间,希望对你有所帮助. 前端实现 遵循R ...
随机推荐
- 2.ECMAScript 5.0
JS的引入方式 内接式 <script type="text/javascript"> </script> 外接式 <!--相当于引入了某个模块--& ...
- django 配置xadmin
django xadmin本地安装 百度云 下载,激活码:bxhv,下载后不需要解压,直接本地 pip install xxx.zip django 版本需要 1.1.11, 1,添加app INST ...
- 【算法】C++用链表实现一个箱子排序附源代码详解
01 箱子排序 1.1 什么是分配排序? 分配排序的基本思想:排序过程无须比较关键字,而是通过"分配"和"收集"过程来实现排序.它们的时间复杂度可达到线性阶:O ...
- python(unittest)报告导出(二):使用 BeautifulReport导出
BeautifulReport(导出的报告比HTMLTestRunner更全面) 下载地址及安装位置 https://github.com/TesterlifeRaymond/BeautifulRep ...
- 解决Maven本地仓库没有Jar包问题,请求中央仓库自动下载以及手动下载方法
一.首先指定本地仓库 <localRepository>D:\software\Maven_Home\mvn_repository</localRepository> 二.修改 ...
- SpringCloud与Docker微服务架构实战笔记
一 微服务架构概述 1. 单体应用架构存在的问题 结合:https://www.cnblogs.com/jialanshun/p/10637454.html一起看,在该篇博客中搜索“单块架构的优缺点 ...
- Oracle 备份还原
导出整个数据库,在CMD命令窗口执行 EXP 用户名/密码@服务名(数据库) FULL=Y FILE=路径 EXP INTERFACE/INTERFACE@PIVAS_XMDWYY FULL=Y FI ...
- 固定定位 z-index iconfont的使用 043
固定定位 现象 脱标 提升层级 将盒子固定住 参考点 浏览器的左上角 : <!DOCTYPE html> <html lang="en"> <he ...
- shell map使用
# 定义初始化map declare -A map=([") # 输出所有key echo ${map[@]} # 输出key对应的值 "]} # 遍历map for key in ...
- python学习 条件控制
if - else if 条件a : 内容a else : 内容 非a if - elif - else if 条件a : 内容a elif 条件b: 内容b-a else : 内容 非(a∪b) ...