nodejs实现文件上传服务器

2020-05-30 11:11 nodejs 126 0

nodejs实现文件上传服务器

后端部分

安装multer

 npm install --save multer 
1
1
1
1
1
1
1
1
1

使用multer

var multer = require("multer");
// 图片存放路径
var imgPath = path.join(__dirname, './file/imgPath');
// 磁盘存储引擎
var imgStorage = multer.diskStorage({
    // 设置图片存放的路径
    destination: function (req, file, cb) {
        cb(null, imgPath);
    },
    // 设置图片的名称
    filename: function (req, file, cb) {
        var singfileArray = file.originalname.split('.');
        // 得到文件拓展名
        var fileExtension = singfileArray[singfileArray.length - 1];
        cb(null, Date.now() + "." + fileExtension);
    }
})

// 实例化multer
var imgupload = multer({ storage: imgStorage });
router.post('/img', imgupload.single('imgfile'),
    function (req, res, next) {
        // 上传成功后的操作
    }
)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25

前端部分

// 获取文件框,react的方法
let fileField = this.refs.input
// 实例化FileReader
const reader = new FileReader();
reader.onload = (e) => {
    // 实例化FormData
    const formData = new FormData();
    formData.append('imgfile', fileField.files[0])
    let url = '/api/img'
    fetch(url, {
        method: 'POST',
        body: formData,
    })
};
// 读取指定File对象,读取完成触发loadend事件
reader.readAsDataURL(fileField.files[0]);
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16

至此,nodejs上传单文件的方法实现了

暂无评论,我会出手
说点什么
最多上传8张图片,仅支持jpg,png格式图片,单张大小5MB以内!
用户名: