danialfarid / ng-file-upload

Lightweight Angular directive to upload files with optional FileAPI shim for cross browser support

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Upload Error Gives ("Unhandled Rejection") even when "catched"

filipe-carvalho opened this issue · comments

Hello community
I am using the upload function in my code with the function to handle errors, like in the example above

        self._Upload.upload({
            method: 'POST',
            url: url
            data: {file: this.image, _method: 'PATCH'}
        }).success(function success() {
            console.log("sucesso");
        }).error(function error() {
            console.log("error");
        }).catch(function (error) {
            console.log("catcher");
        });

When the response from server is 400 the error should be catched and no unhandled rejection should be triggered, however in my console i am obtaining this

### CONSOLE

CONSOLE.LOG
error -> console.log

EXCEPTION
Possibly unhandled rejection: {"data":{"code":400,"message":"Validation Failed","errors":{"children":{"file":{"errors":["The document uploaded cannot be bigger than 2 MB"],"error_codes":[2000]}}}},"status":400,"config":{"method":"POST","transformRequest":[null],"transformResponse":[null],"jsonpCallbackParam":"callback","url":"api/processes/232/tasks/1387/documents/4670","data":{"file":{},"_method":"PATCH"},"_isDigested":true,"chunkSize":null,"headers":{"Accept":"application/json, text/plain, /","Authorization":"Bearer eyJ0eXAiOiJKV1QiLCJhbGciOiJSUzI1NiJ9.eyJpYXQiOjE1NTYxMjQzODIsImV4cCI6MTU1ODcxNjM4Miwicm9sZXMiOlsiUk9MRV9DVVNUT01FUiIsIlJPTEVfVVNFUiJdLCJ1c2VybmFtZSI6ImN1c3RvbWVyMUB0ZXN0LmNvbSJ9.LZGAId_W_Gpb7uMNzr2LcsJZHdlt3oge-IsP5f_UlbClGNd68fOsZuk-2YkswpModyFMFYbujYQo_eWGmdtVfH5EMkPhXgaRazUZ9O8PO2v1X-y4bs8jTsdMv0hwS6AcBqJ8BN2NL5IZTMsI3_2aMtlMn_GIYk2wI2ujx8BKHKY5clunNNcfVHJiHOtz6LBiK6wvj6OPe1UbqpPPuuE20kVIyRhLBX9srzCddvSuDhRdi8SqFkCQ_d-iu7lH58-D7Asv6ayVn3IPtAABogGGwuHyFwm2OY6iIh5nKnaMDu12nNd0hLw3LxTNH1ljEm_nlzoOsdGbX0MfU3UGLvyluVLdutkRJ6IoyLdkgj0ea0JWl_VDpDAZf9wS5jDfPOp_CjzlCSLlZ08KDDA_eTG6OH7MW8GSAUukcUCh0cKY3GwtVCpmLVfR6i2T2M6DDh_T_6mZOCYS0cKV4HjXSdPIPEMNad1UacqXaLL9xBxUiy_UTyjVcIpd1i8gFrlH4IyELth3zWC5-roImpEc2sW_sD9MrwQEbwsh2U3uOlyEGWhgmEqvZjGvLU18DzkzgJA8rVwj9Xw2qdP4nG05F6XqCvbUpnej739UDHyOK6UiTLJaHXj8EXePTTsgO0m1KGixJmIu0aGwaSTEYA7KwJsR5Xc2EH6_JkhTddSWaVm5ek"},"_deferred":{"promise":{}}},"statusText":"Bad Request","xhrStatus":"complete"}

Can you help me , i am doing something wrong ?

Thank you in advance

I have the same problem.
I have noticed that if you remove the following code, it will work.

if (promise['finally'] && promise['finally'] instanceof Function) {
promise['finally'](function () {
upload.promisesCount--;
});
}

But I don't understand why this piece of code is a problem.

commented

@SirKlaus This call to finally creates a promise chain with the unhandled rejection. It needs to have a catch chained to it (either before or after).

An ugly workaround is to give a new deferred in config._deferred that does not have a finally function. So for @filipe-carvalho 's example:

       const _deferred = $q.defer();
       _deferred.promise
           .catch(angular.noop)
           .finally(() => self._Upload.promisesCount--);
       _deferred.promise['finally'] = false;

       self._Upload.upload({
            method: 'POST',
            url: url
            data: {file: this.image, _method: 'PATCH'},
            _deferred
        }).success(function success() {
            console.log("sucesso");
        }).error(function error() {
            console.log("error");
        }).catch(function (error) {
            console.log("catcher");
        });