Question

I’m working on a project in NodeJS which involves file upload. The upload is done on the client side with the code:

$('#file-upload').bind('change focus click', function() {
    var file = jQuery(this)[0].files[0];
    if (file && file.fileName) {
        var xhr = new XMLHttpRequest();
        xhr.upload.addEventListener('progress', onProgressHandler, false);
        xhr.upload.addEventListener('load', transferComplete, false);
        xhr.open('POST', '/upload', true);
        xhr.setRequestHeader('X-Requested-With', 'XMLHttpRequest');
        xhr.setRequestHeader('X-File-Name', encodeURIComponent(file.fileName));
        xhr.setRequestHeader('Content-Type', 'application/octet-stream');
        xhr.send(file);


        function onProgressHandler(evt) {
            var percentage = event.loaded/event.total*100;
            console.log(percentage);
        }
        function transferComplete(evt) {
            console.log('Done');
        }
    }
});

And on the server-side, I use:

app.post('/upload', function(req, res, next) {
    if(req.xhr) {
        console.log('Uploading...');
        var fName = req.header('x-file-name');
        var fSize = req.header('x-file-size');
        var fType = req.header('x-file-type');
        var ws = fs.createWriteStream('./'+fName)

        req.on('data', function(data) {
            console.log('DATA');
            ws.write(data);
        });
        req.on('end', function() {
            console.log('All Done!!!!');
        });
    }
});

This code does work alone, but when combined with the rest of my much larger project, it seems to chop of the beginning of large files, and ignore small files all together. If I upload a small file, the console.log(‘DATA’) never fires and it does fire for large files, but not for the beginning of the file. I believe for some reason it is sending the file early and by the time my function picks it up the beginning (or in the case of a small file, the entire thing) has already sent. I don’t know what would be causing this, though.

Thanks!

Answer 1

I figured it out. There was so much logic between my route being defined and the actual file upload code running that it wasn’t ready listening for the file.