Question

我无法理解为什么我没有收到文件，我在浏览器上有这个代码（拖放）：

function dropZone(){
    //drop zone
    var dropZone = $('#dropZone'),
        maxFileSize = 1000000000000000000000; // max size -

    if (typeof(window.FileReader) == 'undefined') {
        dropZone.text('Use recent browser to upload files');
        dropZone.addClass('error');
    }


    //events
    dropZone[0].ondragover = function() {
        dropZone.addClass('hover');
        return false;
    };

    dropZone[0].ondragleave = function() {
        dropZone.removeClass('hover');
        return false;
    };


    //class hack
    dropZone[0].ondrop = function(event) {
        event.preventDefault();
        dropZone.removeClass('hover');
        dropZone.addClass('drop');

        //size
        var file = event.dataTransfer.files[0];

        if (file.size > maxFileSize) {
           dropZone.text('Big file!');
           dropZone.addClass('error');
           return false;
        }

      //ajax


      $.ajax({
         type: 'post',
         url: 'upload',
         data: file,
         success: function () {
            alert('success!');
         },
         xhrFields: {
        // add listener to XMLHTTPRequest object directly for progress
            onprogress: uploadProgress
         },
         processData: false,
         contentType: file.type
        });

        //progress

        function uploadProgress(event) {
            var percent = parseInt(event.loaded / event.total * 100);
            dropZone.text('Donloading: ' + percent + '%');
        }

        //check result

        function stateChange(event) {
            if (event.target.readyState == 4) {
                if (event.target.status == 200) {
                    dropZone.text('Downloaded successfuly!');
                } else {
                    dropZone.text('Error!');
                    dropZone.addClass('error');
                }
            }
        }
    };
}

我无法接收文件，我使用中间件＆＃39; connect-multiparty＆＃39;但我不知道它是否仍适用于此代码，因为当我尝试获取文件列表：

 console.log(req.files);

我收到：

{}

我需要一些不同的东西来解析这个请求吗？

Answer 1

需要使用formData构造函数来上传文件：https://developer.mozilla.org/en-US/docs/Web/API/FormData

工作例子：

$.ajax({
    xhr: function(){
    var xhr = new window.XMLHttpRequest();
    //Upload progress
    xhr.upload.addEventListener("progress", function(evt){
        console.log('up');
        uploadProgress(evt);
    }, false);
    //Download progress
    xhr.addEventListener("progress", function(evt){
        console.log('down');
    }, false);
    return xhr;
    },
    url : 'upload',
    type: 'POST',
    data: data,
    cache: false,
    dataType: 'xml',
    processData: false, // Don't process the files
    contentType: false, // Set content type to false as jQuery wil
    success: function (result) {
        alert(result);
        alert('success!');
    },
    error: function(err){
        alert('err');
        console.log(err);
    }
});

为什么我无法在nodeJS服务器上接收文件？

1 个答案: