node express 文件上传

主要使用multer来实现文件上传。顺便记录一下multer的API插件： multer：文件上传中间件，multercors:解决跨域中间件 corsconst app = require('express')()const cors = require('cors')const fs = require('fs')const multer = require('multer'...

Mrceel

299人浏览 · 2019-09-03 12:01:35

Mrceel · 2019-09-03 12:01:35 发布

主要使用multer来实现文件上传。顺便记录一下multer的API
插件： multer：文件上传中间件，multer
cors: 解决跨域中间件 cors

前端代码

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <script src="e:/accumulate/plugin/jquery/jquery-3.3.1.min.js"></script>
</head>

<body>
    <input type="file" id="inp">
    <button>submit</button>
    <script>
        $('button').click(()=>{
            const file_ = $('#inp').get(0).files[0]
            let formdata = new FormData()
            formdata.append('avatar', file_)
            var xhr = new XMLHttpRequest();

            xhr.open("post", 'http://localhost:3001/', true);

            xhr.onreadystatechange=function(){
            	// readyState == 4说明请求已完成
	            if(xhr.readyState==4){
	                if(xhr.status==200 || xhr.status==304){
	                    console.log(xhr.responseText);
	                }
	            }
	        }
            xhr.send(formdata);
        })
    </script>

</body>

</html>

单个文件上传，

upload.single(fieldname) : 接受一个以 fieldname 命名的文件。这个文件的信息保存在 req.file。

const app = require('express')()
const cors = require('cors')
const fs = require('fs')
const multer = require('multer')
const upload = multer({ dest: 'update/' })  // 指定上传文件的存放位置，如果不存在则会新建一个（文件夹）。
app.use(cors())
app.use('/', upload.single('avatar'),function (req, res) {   //这里single('avatar') 指定前端所使用的avatar字段。如果不对应，则会报错
    // fs.rename('旧文件路径','新文件路径',回调函数)
    // console.log(req.file) 这里存放了上传的文件信息。
    let old_path = req.file.path  //储存的路径  不带后缀名
    let new_path = req.file.path + '.' + req.file.originalname.split('.')[1]  // 新路径 + uuid + 后缀名
    fs.rename(old_path, new_path, (err) => {
        if(err) return
        console.log('重命名成功')
        res.send('上传成功')
    })
})

 app.listen('3001',()=> console.log('run 3001'))

磁盘存储引擎

const app = require('express')()
const cors = require('cors')
const fs = require('fs')
const multer = require('multer')
const bodyParser = require('body-parser')
app.use(cors())

let storage = multer.diskStorage({
    destination: (req, file, cb)=>{
        cb(null, './files/') //指定文件存储路径，
    },
})
const upload = multer({storage: storage}) //表示用硬盘的储存方式

app.use(upload.single('avatar'));  //单个文件上传

app.use('/', function (req, res) { 
    console.log(2, req.file);
    let old_path = req.file.path  //储存的路径  不带后缀名
    let new_path = req.file.path + '.' + req.file.originalname.split('.')[1]  // 新路径 + uuid + 后缀名
    fs.rename(old_path, new_path, (err) => {
        if(err) return
        console.log('重命名成功')
        res.send('上传成功')
    })
})

 app.listen('3001',()=> console.log('run 3001'))

有两个选项可用，destination 和 filename。他们都是用来确定文件存储位置的函数。

destination 是用来确定上传的文件应该存储在哪个文件夹中。也可以提供一个 string (例如 '/tmp/uploads')。如果没有设置 destination，则使用操作系统默认的临时文件夹。

注意: 如果你提供的 destination 是一个函数，你需要负责创建文件夹。当提供一个字符串，multer 将确保这个文件夹是你创建的。
filename 用于确定文件夹中的文件名的确定。如果没有设置filename，每个文件将设置为一个随机文件名，并且是没有扩展名的。

注意: Multer 不会为你添加任何扩展名，你的程序应该返回一个完整的文件名。

内存存储引擎 (MemoryStorage)

内存存储引擎将文件存储在内存中的 Buffer 对象，它没有任何选项。

当使用内存存储引擎，文件信息将包含一个 buffer 字段，里面包含了整个文件数据。

警告: 当你使用内存存储，上传非常大的文件，或者非常多的小文件，会导致你的应用程序内存溢出。

var storage = multer.memoryStorage()
var upload = multer({ storage: storage })

多个文件上传

const app = require('express')()
const cors = require('cors')
const fs = require('fs')
const multer = require('multer')
const bodyParser = require('body-parser')
app.use(cors())

let storage = multer.diskStorage({
    destination: (req, file, cb)=>{
        cb(null, './files/')
    },
})
const upload = multer({storage: storage}) //表示用硬盘的储存方式

app.use(upload.array('avatar'));  //与单个文件上传的区别关键在于这里
app.use('/', function (req, res) { 
    console.log(2, req.files);
})
 app.listen('3001',()=> console.log('run 3001'))

多个文件上传的时候文件对象保存在 req.files 数组里；输出如下
在这里插入图片描述

single(fieldname)
接受一个以 fieldname 命名的文件。这个文件的信息保存在 req.file。
.array(fieldname[, maxCount])
接受一个以 fieldname 命名的文件数组。可以配置 maxCount 来限制上传的最大数量。这些文件的信息保存在 req.files。
.fields(fields)
接受指定 fields 的混合文件。这些文件的信息保存在 req.files。
fields 应该是一个对象数组，应该具有 name 和可选的 maxCount 属性。

Example:
```
[
  { name: 'avatar', maxCount: 1 },
  { name: 'gallery', maxCount: 8 }
]
```
.none()
只接受文本域。如果任何文件上传到这个模式，将发生 “LIMIT_UNEXPECTED_FILE” 错误。这和 upload.fields([]) 的效果一样。
.any()
接受一切上传的文件。文件数组将保存在 req.files。

警告: 确保你总是处理了用户的文件上传。永远不要将 multer 作为全局中间件使用，因为恶意用户可以上传文件到一个你没有预料到的路由，应该只在你需要处理上传文件的路由上使用。

CSDN学习社区

CSDN联合极客时间，共同打造面向开发者的精品内容学习社区，助力成长！

更多推荐

嵌入式作业（七）：基于Ardunio的STM32串口通信

嵌入式作业（七）0作业要求1Ardunio 完成STM32的串口通信（1）安装Ardunio IDE（2）stm32串口通信2关于 stduino IDE0作业要求安装 Ardunio IDE 和相关软件支持库，在Ardunio 完成STM32板子的串口通信程序：（1）持续向串口输出“Hello world！”；（2）当接收到“stop!”时，停止输出。网上有一个国人版的MCU集成开发平台， st

CSDN学习社区

JDBC详解

JDBC文章目录JDBC什么是JDBC?JDBC驱动程序:Java使用JDBC访问数据库的步骤:设置classpath:Oracle连接字符串的书写格式:简单的例子:常用数据库的驱动程序及JDBC URL:Oracle数据库:SQL Server数据库MySQL数据库Access数据库PreparedStatement接口:JNDI-数据源（Data Source）与连接池（Connection

CSDN学习社区

“模式识别与机器学习”学习笔记no2.再谈感知机

接**上篇：上篇主要进行了PLA，Pocket算法的理论过程分析和在给定数据集上利用pocket算法对数据集进行分类学习，得到错分数量最少的分类面。上篇中pocket算法的过程已经进行了编程和测试，框架已经建立了起来，这一篇主要上篇中没有提到或涉及不深的几个问题。1.数据集的构造。上篇是直接使用了题目给的向量，这次来根据正态分布来产生数据集。np.random.normal函数可以根据均值和方差生

CSDN学习社区

所有评论(0)

查看更多评论

Mrceel

@Mrceel

已为社区贡献3条内容