Issue with AngularJS 1.4 and transformRequest and uploading to S3

[darkmavis1980]

I have an issue today when I updated my project from Angular 1.3 to 1.4, and it's probably because now you can't modify the request header with transformRequest anymore (or at least according to this article).
Essentially before I was calling the upload function with these parameters:

        url: my-bucket-url,
        headers: {'Content-Type': file.type},
        method: 'POST',
        transformRequest: function (data, headersGetter) {
          // Headers change here
          var headers = headersGetter();
          delete headers.Authorization;
          return data;
        },
        fields: fieldsData,
        ...

As I had to remove the Authorization token from the header I had to transform my headers before sending the file to S3. But now I see that the Authorization is not getting removed from the headers.
Any idea how to fix it? Did anybody test ng-file-upload with Angular 1.4?

[danialfarid]

If you don't need the Authorization headers then don't add them to the request in first place.

[darkmavis1980]

Unfortuantely it's not that easy, the Token is added to all the request as it's needed for authentication with the API, the only case where I don't need it is when I have to upload a file from the client directly to S3

[darkmavis1980]

Found a solution, not beautiful, but it works.
Essentially I removed the transformRequest as is not working anymore in AngularJS 1.4, and I've added this code before I call the upload method

 // we store the auth token
 var storeAuth = $http.defaults.headers.common.Authorization;
 // we remove it temporarily from the headers
 delete $http.defaults.headers.common.Authorization;

Upload.upload({
...
});

// we restore the auth Token in the $http headers
$http.defaults.headers.common.Authorization = storeAuth;

Again, not a beautiful solution, but at least now I have the upload on S3 back working on my project

[nukulb]

Better to replace transform request with just this

-                    transformRequest: function (data,headersGetter) {
-                        //Headers change here
-                        var headers = headersGetter();
-                        delete headers['Authorization']; //jshint ignore:line
-                        return data;
+                    headers: {
+                       'Authorization': undefined
                     },

[nukulb]

@danialfarid I suggest closing this.

[galenp]

This helped me but I think referencing the repo at nukulb/s3-angular-file-upload is a bit confusing as It feels like its outdated. Maybe update README?

[galenp]

Specifically that example uses the transformRequest technique for removing the Authorization header.

[paulwithap]

Seems like more of an issue with your auth implementation than this library. I store my tokens elsewhere and set the auth header on the fly if the request url contains my API base url. Who knows what other services you may have issues with later? I doubt you want this transformRequest code in every single place you're hitting an endpoint other than your API.

[nukulb]

@paulwithap Good point on checking the base URL before adding the auth header.
Most people I suspect are adding to auth header all the time. You would never run into this issue with your approach.

Thanks for the idea.

[darkmavis1980]

@paulwithap All the calls to my API has to contain the token in the header, it would be silly to do a control every time in my opinion.
This was the only call in the entire application where I needed to remove the header simply because I wasn't sending the data to my API, but to Amazon S3, which refuses any connection if I send the token in the header.

[darkmavis1980]

The point was not how my app should work, but the simple fact that the transformRequest doesn't work anymore with AngularJS 1.4 onwards, that's it

[Deklin]

We are having an issue with angular transform request and ADDING a header. This is a deprecation since angular 1.2.x which we upgraded from.