Angularjs, file upload and IE9

Question

Problems downloading files in an Angularjs / Nodejs application.

I implemented this angular-file-upload directive . Using it, file downloading works in all modern browsers, but it does not work in IE9. "Failure" I mean that it works as if it works ... I can register the file upload process and see that it gradually reaches 100%, the successful log message is launched in the success handler (nothing starts in the error handler ), but the file never appears in the download directory (on the same computer).

There are no console errors of any type, and I set the permissions for the download directory to 777 to rule this out.

What I found are disabled ... first, the files downloaded in IE9 never trigger the log messages that I put in my uploadPhoto function so that the route doesn’t seem to get there (I thought the files downloaded in modern browsers, run these log messages). In addition, after loading the developer tools in the Network panel, the value for the type should not be text / html, as shown below.

(displayed below:) URL, Method, Result, Type, Received:

/path/to/upload-dir/filename.jpg GET 200 text/html 20.7kb

Here is my file upload handler:

$scope.onFileSelect = function ($file) {
    $scope.ajaxVisible = true;
    $scope.uploadError = false;
    var photo = $file[0];
    $scope.upload = $upload.upload({
        url: '/upload/photo',
        file: photo,
        method: 'POST'
    }).progress(function (evt) {
        }).success(function (data, status, headers, config) {
            $scope.toggleUploadForm();
            $scope.imgsrc = 'path/to/upload/dir/' + photo.name;
            User.currentUser.profile_image = photo.name;
            User.updateUser();
            $scope.ajaxVisible = false;
        }).error(function (err) {
            $scope.uploadError = true;
            $scope.ajaxVisible = false;
        });
};

Here is the handler for this route (expressjs / node):

app.post('/upload/photo', userAPI.uploadPhoto);

Here is the uploadPhoto referenced by the route handler:

exports.uploadPhoto = function(req, res) {
    logger.info('inside uploadPhoto'); // <-- never reached using IE9
    var callbacks = {};

    callbacks.uploadSuccess = function(){
        res.json('success');
    };

    callbacks.uploadFailure = function(err){
        res.json(400, 'Error uploading image.');
    };

    user.handlePhotoUpload(req.files, callbacks);
};

Who finally handed out things:

this.handlePhotoUpload = function(params, callbacks) {
        logger.log('inside handlePhotoUpload'); // <-- never reached using IE9
        if(params.file.mime !== 'image/png' && params.file.mime !== 'image/jpeg' && params.file.mime !== 'image/gif') {
            callbacks.uploadFailure('Wrong file type');
            return;
        }
        fs.readFile(params.file.path, function(err, data){
            if(err){
                callbacks.uploadFailure(err);
            }
            var newPath = path.resolve("./path/to/upload/dir/" + params.file.filename);
            fs.writeFile(newPath, data, function(err) {
                if(err){
                    callbacks.uploadFailure(err);
                }

                callbacks.uploadSuccess();
            });
        });
    };

FileAPI library , Flash . , Flash . - , , .

, ( ) , , . IE9 .

, .

Answer 1

, . (... ) :

if(params.file.mime !== 'image/png' && params.file.mime !== 'image/jpeg' && params.file.mime !== 'image/gif') {
    callbacks.uploadFailure('Wrong file type');
    return;
}

flash ( , crummy, , IE <= 9), mime application/octet-stream... mime , . , , mime flash ( , IE <= 9).

, " " . :

callbacks.uploadFailure = function(err){
    res.json(400, 'Error uploading image.');
};

, err , , " ".