Jquery File Upload - Not sending headers in IE9

Question

I'm using jQuery Fileupload to upload files. Its not sending headers that I set to the server. Why is the Authorization header missing only in IE but passed in chrome?

Here is the code:

upload_photo: function(){
  var url =  '/api/v1/upload';
  $('#photoupload').fileupload({
      url: url,
      dataType: 'json',
      paramName: 'uploadFile',
      beforeSend: function ( xhr ) {
          setHeader(xhr);
          $("#check_progress").html('true');
      },                    
      done: function (e, responseJSON) {
          var id = responseJSON.result.id;
          url = responseJSON.result.url;
          var photo_ids = $("#photo_ids");
          var val = photo_ids.val();
          photo_ids.val(val + id.toString() + ",");
          $(".photothumb-wapper").append('<div class=\"photothumb\" id="post_photo_'+id+'"><div><img  src=\"'+url+'\" /></div><img class=\"thumb-delete photo_delete\" id=\"'+id+'\" title=\"Remove\" src=\"/assets/delete-red.png\"></div>');
          $("#check_progress").html("");
      },
      start: function (e, data) {
          $(".photothumb-wapper").append('<div class="photothumb photoprogress" style="border:none"><img src="/assets/ajax-loader.gif" /></div>');
      },
      always: function (e, data) {
          $(".photoprogress").remove();
      }
  });
}

var setHeader = function (xhr) {
    xhr.setRequestHeader('Authorization', 'Bearer fdf49c4f1cfgc176eb952f18eeefaec3e7');
};

Headers passed in IE:

Request             : POST /api/v1/upload HTTP/1.1 
Accept              : text/html, application/xhtml+xml, \*/\* 
Referer             : url
Accept-Language     : en-US
User-Agent          :Mozilla/5.0 (compatible; MSIE 9.0; Windows NT 6.1; Trident/5.0) 
Content-Type        :multipart/form-data; boundary=---------------------------7de2dfe037204f6 
Accept-Encoding     :gzip, deflate 
Host                :url 
Content-Length      :776595 
DNT                 :1 
Connection          :Keep-Alive 
Cache-Control       :no-cache       
Cookie              :sitecookies

Headers passed in Chrome:

ResponseHeaders
  date : Tue, 04 Mar 2014 07:32:20 GMT
  Connection: Keep-Alive
  content-length:225
  content-type:application/json; charset=utf-8
  cache-control:no-cache
RequestHeaders
  Accept: application/json, text/javascript, \*/\*; q=0.01
  Authorization: Bearer fdf49c4f1cfgc176eb952f18eeefaec3e7
  X-Requested-With: XMLHttpRequest

Why is the Authorization header missing in IE?

Mulkey

Dupilcate of #7687327 – Hereat

@Jibi - No. Passing header manually doesn't help. Still Authorization is not passed in IE9, where as it works fine in IE10, chrome, FF – Mulkey

Answer 1

This answers my question,

Only browsers with support for XHR file upload support setting custom headers.

Mulkey

So, you couldn't set a header at all? Did you find a workaround? I've got the same issue: all of our requests need an authorization header to upload files. – Chromous

Answer 2

As a workaround in old browsers like our dear IE, you could set a cookie with the authentication token when the user authenticate and then get it in the server and verify it the same way you verify the header one. I know that it is not the most elegant solution but it works.

Spindle