1、安装muterl第三方模块

cnpm install multer --save

2、使用

multer在解析完成后,会向request对象中添加一个body对象和一个file或者files对象(上传多个文件的时候用files对象),其中body中包含提交的字段,而file中包含上传的文件

//1、引入express模块
const express = require("express"); //2、引入multer模块
const multer = require("multer"); //3、对上传的文件进行配置
var storage = multer.diskStorage({ //指定文件上传到服务器的路径
destination: function (req, file, cb) {
cb(null, '/public/img')
}, //指定上传到服务器文件的名称
filename: function (req, file, cb) {
cb(null, file.fieldname + '-' + Date.now())
}
}) var upload = multer({ storage: storage }) //4、使用 在使用路由的时候调用upload方法 name值是客户端传递的key值
var cpUpload = upload.fields([{ name: 'goodsImg', maxCount: 1 }, { name: 'goodsImgs', maxCount: 8 }])
router.post('/goods/addGoods',cpUpload,goodsController.addgoods );

 

3、upload方法

upload.single('key值'):当传递单个文件的时候,对文件的解析

upload.array('key值', maxCout):当传递一组文件的时候,对文件的解析 key值是前端传递的key值 maxcout是最多能传递多少个文件

upload.fields([{ name: 'key值', maxCount: num }, { name: 'key值', maxCount: num }]):当传递多个文件域的时候,对文件的解析

4、客户端传递图片

//创建一个表单数据对象
var formData = new FormData();
var goods_name = $("#goods_name");
var goods_des = $("#goods_des");
var goods_price = $("#goods_price");
var goods_img = $("#goods_img");
var goods_imgs = $("#goods_imgs");
formData.append("goodsName",goods_name.val());
formData.append("gooddsDes",goods_des.val())
formData.append("goodsPrice",goods_price.val())
formData.append("goodsImg",goods_img[0].files[0])
for(var i=0;i<goods_imgs[0].files.length;i++){
formData.append("goodsImgs",goods_imgs[0].files[i])
} $.ajax({
type:"post",
url:"/api/goods/addGoods",
cache: false,//不读取缓存中的结果 true的话会读缓存 其实post本身就不会读取缓存中的结构
processData: false,//默认情况下,通过data选项传递进来的数据,如果是一个对象(技术上讲只要不是字符串),都会处理转化成一个查询字符串,以配合默认内容类型 "application/x-www-form-urlencoded"。如果要发送 DOM 树信息或其它不希望转换的信息,请设置为 false。
contentType: false,//数据编码格式不使用jquery的方式 为了避免 JQuery 对其操作,从而失去分界符,而使服务器不能正常解析文件。
data:formData,
success:$.proxy(this.handleSuccCb)
})
 

【node】---multer模块实现图片上传---【巷子】的更多相关文章

  1. node应用通过multer模块实现文件上传

    multer用于处理文件上传的nodejs中间件,主要跟express框架搭配使用,只支持表单MIME编码为multipart/form-data类型的数据请求. 如果要处理其他编码的表单数据可以通过 ...

  2. 利用layui的load模块解决图片上传

    首先肯定要参考layui官网的upload模块文档:http://www.layui.com/doc/modules/upload.html 讲讲思路:在一份添加表单中,我们有个图片上传的模块,然后我 ...

  3. 从零开始学习Node.js例子三 图片上传和显示

    index.js var server = require("./server"); var router = require("./router"); var ...

  4. nodejs -formidable模块实现图片上传。

    var form = new formidable.IncomingForm(); form.uploadDir="/localnonobank/test/images/";   ...

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

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

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

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

  7. multer实现图片上传

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

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

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

  9. HTML5移动端图片上传模块

    上传图片的功能是极为常用的,之前做过一个移动端上传文件的功能(基于jquery的),总结梳理一下. html <div class="uploadPic clearBox"& ...

随机推荐

  1. OSX下git diff/merge 可视化工具 P4Merge 环境配置步骤

    先下载 step1:首先,把要运行的命令放入外部包装脚本中,创建一个merge包装脚本,名字叫做extMerge,让它带参数调用P4Merge. $ cat >> /usr/local/b ...

  2. Hbase导入MapReduce数据的时候提示Running Job XXXX后就一直卡着不动

    代码确信无误之后,ant运行起来,发现一执行就卡在Running Job XXXX那里一直不动了. 试着把代码打包成jar扔到Linux执行也还是一样的效果.还是停在那里.然后就一顿瞎蒙.最后发现是H ...

  3. 【转】WCF入门教程三[WCF的宿主]

    一.WCF服务应用程序与WCF服务库 我们在平时开发的过程中常用的项目类型有“WCF 服务应用程序”和“WCF服务库”. WCF服务应用程序,是一个可以执行的程序,它有独立的进程,WCF服务类契约的定 ...

  4. e686. 显示打印窗口

    The print dialog allows the user to change the default printer settings such as the default printer, ...

  5. MVC演化 (转至http://www.cnblogs.com/wubaiqing/archive/2011/10/26/2225438.html)

    MVC已经成为我们最常误用的模式,人们之所以常常误用MVC,很大程度上是因为混淆了不同的MVC变体. Classic MVC Classic MVC 大概上世纪七十年代,Xerox PARC的Tryg ...

  6. 【JavaScript】使用setInterval()函数作简单的轮询操作

    轮询(Polling)是一种CPU决策怎样提供周边设备服务的方式,又称"程控输出入"(Programmed I/O). 轮询法的概念是.由CPU定时发出询问.依序询问每个周边设备是 ...

  7. CIRI 识别circRNA的原理

    CIRI 根据circRNA 连接点处的reads来识别circRNA, 在连接点处的reads 其比对情况非常特殊: CIRI 根据3种模型来识别circRNA, 连接点处的read 叫做junct ...

  8. 一些 Linux 常用命令说明

    目前由于自己接触到的是 Windows 的操作系统,所以会经常使用 git bash 来提交代码到 github上. git bash 是 Windows 下模拟 Linux 的命令行工具. 在此总结 ...

  9. Win10開始菜单打不开

    一.前言 自从用Win10之后(附上<我的Win10之旅>).用清理软件.总是深度清理,导致rt问题. 每次百度都是没用的解决方法: 今天,再一次清理(Wise Care 365 注冊表深 ...

  10. MyEclipse 对项目进行build path无效

    今天发现昨天从svn下载下来的项目在MyEclipse中无法build path .提示no actions available 在网上找了下,是由于.projects文件的问题,须要在当中的natu ...