Node.js + ajax,上传文件

时间:2017-12-19 15:50:37

标签: javascript jquery 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>

我不知道我在这里缺少什么。

提前致谢!

1 个答案:

答案 0 :(得分:3)

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

  

<强> fileBegin

     

在上传流中检测到新文件时发出。用这个   如果要在缓冲时将文件流式传输到其他位置,请执行event   在文件系统上传。

     

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);
        }
    });