【node】---multer模块实现图片上传---【巷子】
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模块实现图片上传---【巷子】的更多相关文章
- node应用通过multer模块实现文件上传
multer用于处理文件上传的nodejs中间件,主要跟express框架搭配使用,只支持表单MIME编码为multipart/form-data类型的数据请求. 如果要处理其他编码的表单数据可以通过 ...
- 利用layui的load模块解决图片上传
首先肯定要参考layui官网的upload模块文档:http://www.layui.com/doc/modules/upload.html 讲讲思路:在一份添加表单中,我们有个图片上传的模块,然后我 ...
- 从零开始学习Node.js例子三 图片上传和显示
index.js var server = require("./server"); var router = require("./router"); var ...
- nodejs -formidable模块实现图片上传。
var form = new formidable.IncomingForm(); form.uploadDir="/localnonobank/test/images/"; ...
- 使用express+multer实现node中的图片上传
使用express+multer实现node中的图片上传 在前端中,我们使用ajax来异步上传图片,使用file-input来上传图片,使用formdata对象来处理图片数据,post到服务器中 在n ...
- Node.js实现图片上传功能
node接口实现 const express = require('express') const mysql = require('mysql') const cors = require('cor ...
- multer实现图片上传
multer实现图片上传: ejs代码: <!DOCTYPE html> <html lang="en"> <head> <meta ch ...
- 基于Node的React图片上传组件实现
写在前面 红旗不倒,誓把JavaScript进行到底!今天介绍我的开源项目 Royal 里的图片上传组件的前后端实现原理(React + Node),花了一些时间,希望对你有所帮助. 前端实现 遵循R ...
- HTML5移动端图片上传模块
上传图片的功能是极为常用的,之前做过一个移动端上传文件的功能(基于jquery的),总结梳理一下. html <div class="uploadPic clearBox"& ...
随机推荐
- 普通windows版本安装winServer的特色功能 以dedup功能为展示点
安装 Windows 功能角色 1.选择安装源 在 Windows 8.1 系统上不存在重复数据删除功能,需要从对应的服务器版本,即 Windows Server 2012 R2 上提取相关文件. 2 ...
- 关于jsp,javascript,php等语言
技术一 jsp: java植入html 技术二 javascript(js)植入html 技术三早期php植入html 弱类型语言和强类型语言 弱类型语言无法实现函数重载,没办法
- 关于Cocos2d-x物理引擎用到的类和使用
其实就是这三类PhysicsWorld类,PhysicsBody类,PhysicsShape类. 1.PhysicsWorld类 PhysicsWorld对象代表Cocos2d-x中的物理世界,这个世 ...
- e660. 用一组像素创建图像
This example demonstrates how to convert a byte array of pixel values that are indices to a color ta ...
- Java运行时,各种类型存储介绍
Java的内存分配 Java程序运行时的内存结构分成:方法区.栈内存.堆内存.本地方法栈几种. 方法区 存放装载的类数据信息,包括:基本信息:每个类的全限定名.每个类的直接超类的全限定 ...
- ubuntu环境JDK安装(转至 http://hi.baidu.com/leo_lovato/item/31d1150d31a06d8002ce1bec)
ubuntu安装jdk 1.首先去官网http://www.oracle.com/technetwork/java/javase/downloads/index.html 下载最新版的jdk.我下载了 ...
- [ACM] POJ 3349 Snowflake Snow Snowflakes(哈希查找,链式解决冲突)
Snowflake Snow Snowflakes Time Limit: 4000MS Memory Limit: 65536K Total Submissions: 30512 Accep ...
- hdu 1281 棋盘游戏 (二分匹配)
//是象棋里的车 符合二分匹配 # include<stdio.h> # include<algorithm> # include<string.h> using ...
- 《Java程序猿面试笔试宝典》之组合与继承有什么差别
组合和继承是面向对象中两种代码复用的方式. 组合是指在新类里面创建原有类的对象,反复利用已有类的功能.继承是面向对象的主要特性之中的一个,它同意设计人员依据其他类的实现来定义一个类的实现. 组合和继承 ...
- windows 下安装perl Tk 模块
首先,安装activeperl ,安装过程中勾选自动添加PATH环境变量,这样安装后就不需要自己手动修改PATH环境变量: 通过cmd 调出命令行窗口,输入ppm ,然后回车,就开启了perl 的包管 ...
