Node.js + ajax，上传文件

我一直在尝试使用node.js和ajax上传文件，但我不能让它工作。我没有收到错误，但我的存储文件夹中没有任何内容。

index.js：

app.post('/newFlavour', function(req, res){
console.log("[INFO] New flavour request: " + req.body.name);

let form = new formidable.IncomingForm();
form.uploadDir = path.join(__dirname, '/storage');

form.on('file', function(field, file) {
    fs.rename(file.path, path.join(form.uploadDir, file.name));
});

form.on('error', function(err) {
    console.log('An error has occured: \n' + err);
});

form.on('end', function() {
    console.log('success');
});

form.parse(req); });

我的函数与ajax请求：

function createFlavour() {
let file = $('#upload-input').get(0).files;
const formData = new FormData();
formData.append('uploads', file, file.name);

console.log(file)

$.ajax({
    url: "http://localhost:3000/newFlavour",
    type: "POST",
    dataType: "json",
    data: JSON.stringify({
        name: $('#name').val(),
        file: file
    }),
    contentType: "application/json",
    success: function (data) {
        console.log(data);
    },
    error: function () {
        alert("Error occured");
    },
    complete: function () {
        console.log("complete")
    }
});

clearModal();  }

输入标签：

<input id="upload-input" type="file" name="upload"></br>

我不知道我在这里失踪了什么。

提前致谢！

你应该在开始时解析你的req。也是根据formidable documentation

fileBegin

在上载流中检测到新文件时发出。如果要在缓冲文件系统上载的同时将文件流式传输到其他位置，请使用此事件。

form.on（'fileBegin'，function（name，file）{}）;

所以这样做应该保存你的文件

app.post('/newFlavour', function (req, res){
    var form = new formidable.IncomingForm();

    form.parse(req);

    form.on('fileBegin', function (name, file){
        file.path = __dirname + '/storage/' + file.name;
    });

    form.on('file', function (name, file){
        console.log('Uploaded ' + file.name);
    });

    res.status(200);
});

另外你ajax Post错了，这应该有效

    var data = new FormData();
    $.each($('#upload-input')[0].files, function(i, file) {
        data.append('file-'+i, file);
    });

    $.ajax({
        url: 'http://localhost:3000/newFlavour',
        data: data,
        cache: false,
        contentType: false,
        processData: false,
        method: 'POST',
        type: 'POST', // For jQuery < 1.9
        success: function(data){
            alert(data);
        }
    });

Node.js + ajax，上传文件

我一直在尝试使用node.js和ajax上传文件，但我不能让它工作。我没有收到错误，但我的存储文件夹中没有任何内容。

index.js：

app.post('/newFlavour', function(req, res){
console.log("[INFO] New flavour request: " + req.body.name);

let form = new formidable.IncomingForm();
form.uploadDir = path.join(__dirname, '/storage');

form.on('file', function(field, file) {
    fs.rename(file.path, path.join(form.uploadDir, file.name));
});

form.on('error', function(err) {
    console.log('An error has occured: \n' + err);
});

form.on('end', function() {
    console.log('success');
});

form.parse(req); });

我的函数与ajax请求：

function createFlavour() {
let file = $('#upload-input').get(0).files;
const formData = new FormData();
formData.append('uploads', file, file.name);

console.log(file)

$.ajax({
    url: "http://localhost:3000/newFlavour",
    type: "POST",
    dataType: "json",
    data: JSON.stringify({
        name: $('#name').val(),
        file: file
    }),
    contentType: "application/json",
    success: function (data) {
        console.log(data);
    },
    error: function () {
        alert("Error occured");
    },
    complete: function () {
        console.log("complete")
    }
});

clearModal();  }

输入标签：

<input id="upload-input" type="file" name="upload"></br>

我不知道我在这里失踪了什么。

提前致谢！

你应该在开始时解析你的req。也是根据formidable documentation

fileBegin

在上载流中检测到新文件时发出。如果要在缓冲文件系统上载的同时将文件流式传输到其他位置，请使用此事件。

form.on（'fileBegin'，function（name，file）{}）;

所以这样做应该保存你的文件

app.post('/newFlavour', function (req, res){
    var form = new formidable.IncomingForm();

    form.parse(req);

    form.on('fileBegin', function (name, file){
        file.path = __dirname + '/storage/' + file.name;
    });

    form.on('file', function (name, file){
        console.log('Uploaded ' + file.name);
    });

    res.status(200);
});

另外你ajax Post错了，这应该有效

    var data = new FormData();
    $.each($('#upload-input')[0].files, function(i, file) {
        data.append('file-'+i, file);
    });

    $.ajax({
        url: 'http://localhost:3000/newFlavour',
        data: data,
        cache: false,
        contentType: false,
        processData: false,
        method: 'POST',
        type: 'POST', // For jQuery < 1.9
        success: function(data){
            alert(data);
        }
    });