Upload file to server

Web端

Html

1
2
3
4
5
6
<form action="/upload" id="form" method="post" enctype="multipart/form-data">
<div class="input-group">
<span class="input-group-addon" id="basic-addon5">Attach File</span>
<input type="file" id="files" name="files" multiple aria-describedby="basic-addon5"/>
</div>
</form>
  • multiple是否支持多个

Ajax

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
$.ajax({
url: "/upload",
type: "POST",
data: formData,
async: false,
cache: false,
contentType: false,
processData: false,
success: function (response) {
if (response === 'success') {
resolve();
} else {
reject();
}
}
});

服务端

依赖

npm install multiparty --save

Upload Files

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
let form = new multiparty.Form({uploadDir: path.join(__dirname, 文件上传位置)});
form.parse(req, function (err, fields, files) {
if (err) {
console.log('parse error: ' + err);
} else {
var inputFile = files.files[0];
var uploadedPath = inputFile.path;
var dstPath = path.join(__dirname, 文件上传位置) + inputFile.originalFilename;
fs.rename(uploadedPath, dstPath, function (err) {
if (err) {
res.json(err);
} else {
res.json('success')
}
});
}
});

Read Files List

1
2
3
4
5
6
7
8
9
10
11
12
13
//返回文件和子目录的数组
let files = fs.readdirSync(文件存放位置);
files.forEach(function (itm, index) {
//fs.statSync同步读取文件夹文件,如果是文件夹,在重复触发函数
if (fs.statSync(文件存放位置 + itm).isDirectory()) {
readFileList(文件存放位置 + itm + "/", filesList)
} else {
let obj = {};
obj.path = 文件存放位置 + itm;
obj.filename = itm
filesList.push(obj);
}
})

Delete files

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
//判断给定的路径是否存在
if (fs.existsSync(文件路径)) {
//返回文件和子目录的数组
let files = fs.readdirSync(文件路径);
files.forEach(function (file, index) {
let curPath = path.join(文件路径, file);
//fs.statSync同步读取文件夹文件,如果是文件夹,在重复触发函数
if (fs.statSync(curPath).isDirectory()) { // recurse
deleteFolderRecursive(curPath);
} else {
fs.unlinkSync(curPath);
}
});
} else {
console.log("给定的路径不存在,请给出正确的路径");
}