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图片上传的更多相关文章

  1. 使用connect-multiparty限制nodejs图片上传

    connect-multiparty中间件,可用于获取文件上传时各种参数,比如文件大小.格式等,具体使用: var multipart = require('connect-multiparty'); ...

  2. 图片上传之FileAPI与NodeJs

    HTML5之fileAPI HTML5之fileAPI使得我们处理图片上传更加简单. 实例 html代码 <div class="form-group"> <la ...

  3. nodeJs实现微信小程序的图片上传

    今天我来介绍一下nodejs如何实现保存微信小程序传过来的图片及其返回 首先wx.uploadFile绝大部分时候是配合wx.chooseImage一起出现的,毕竟选择好了图片,再统一上传是实现用户图 ...

  4. nodejs 接收上传的图片

    1.nodejs接收上传的图片主要是使用formidable模块,服务器是使用的express搭建. 引入formidable var formidable = require('./node_mod ...

  5. NodeJs实现图片上传

    关于formidable NodeJs实现图片上传,此处主要用了插件:formidable github上关于formidable的资料如下: https://github.com/felixge/n ...

  6. Nodejs之MEAN栈开发(四)---- form验证及图片上传

    这一节增加推荐图书的提交和删除功能,来学习node的form提交以及node的图片上传功能.开始之前需要源码同学可以先在git上fork:https://github.com/stoneniqiu/R ...

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

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

  8. multer实现图片上传

    multer实现图片上传: ejs代码: <!DOCTYPE html> <html lang="en"> <head> <meta ch ...

  9. 基于Node的React图片上传组件实现

    写在前面 红旗不倒,誓把JavaScript进行到底!今天介绍我的开源项目 Royal 里的图片上传组件的前后端实现原理(React + Node),花了一些时间,希望对你有所帮助. 前端实现 遵循R ...

随机推荐

  1. windows server2008 r2安装DNS服务器

    1.开始->管理工具->服务器管理器 2.角色->添加角色 3.服务器角色->DNS服务器 4.一直点击下一步,直至安装完成. (确认步骤时会提示,可能会需要重启服务器) 安装 ...

  2. Squid代理服务器(二)——配置Squid服务器

    一.传统代理 (一)需求分析 局域网内,客户机访问自家的Web服务器,通过Squid代理服务器访问Web服务器,再由Squid反馈给客户机;在Squid主机上,构建Squid为客户机访问网站提供代理服 ...

  3. 一步一步带你安装史上最难安装的 vim 插件 —— YouCompleteMe

    YouCompleteMe is a fast, as-you-type, fuzzy-search code completion engine for Vim.参考: https://github ...

  4. 关于:maven项目中pom.xml文件添加依赖无法自动搜索的问题

    用的是eclipse 1.Window------>Show View------->Maven Repositories(这个选项一般不直接显示,而在others里面) 2.操作完毕后会 ...

  5. P4175 [CTSC2008]网络管理 树剖+树套树

    $ \color{#0066ff}{ 题目描述 }$ M公司是一个非常庞大的跨国公司,在许多国家都设有它的下属分支机构或部门.为了让分布在世界各地的N个部门之间协同工作,公司搭建了一个连接整个公司的通 ...

  6. 动态渲染可编辑单元格的Table

    一.问题描述 问题是这样的,后台传了xArr = [x1, x2,...,xn]和yArr = [y1, y2, ..yn]两个数组,前端要渲染出表格并且可以填写每个单元格的值,然后按照一定数据结构保 ...

  7. leetcode-118-Pascal's Triangle(生成具有n行的帕斯卡三角形)

    题目描述: Given a non-negative integer numRows, generate the first numRows of Pascal's triangle. Example ...

  8. Numpy中扁平化函数ravel()和flatten()的区别

    在Numpy中经常使用到的操作由扁平化操作,Numpy提供了两个函数进行此操作,他们的功能相同,但在内存上有很大的不同. 先来看这两个函数的使用: from numpy import * a = ar ...

  9. JAVA数据结构--哈希表的实现(分离链接法)

    哈希表(散列)的定义 散列表(Hash table,也叫哈希表),是根据关键码值(Key value)而直接进行访问的数据结构.也就是说,它通过把关键码值映射到表中一个位置来访问记录,以加快查找的速度 ...

  10. js高级程序设计 笔记 --- 引用类型

    一,变量和作用域 1, js变量可以保存两种类型,基本类型.引用类型和symbol类型,基本类型有5种:undefined.null.boolean.number.string,它们都有以下的特征 基 ...