3

Originally I think this question is purely a stackoverflow question about AWS S3, javascript and IE11. And I have posted it in stackoverflow but got no answer. Then I realised this might have something to do with Visualforce page setting as it is happening inside a VF page (in a site). It might has something to do with Salesforce about cross domain setting etc. So below is my question:

I am using the below code to try to upload files to AWS S3 server:

  function ajaxUpload(fd, file, signedFormData, nameOfFile) {
      var IsCompletedFired = 0;

      $.support.cors = true;
      var jqXHR=$.ajax({

          xhr: function() {   

              //...
          },
          url: "https://s3-ap-southeast-2.amazonaws.com/"+signedFormData.bucket +"/",
          type: "POST",
          crossDomain: true,
          contentType: false,
          processData: false,
          cache: false,
          async: true,
          dataType: false,
          enctype:"multipart/form-data",
          encoding:"multipart/form-data",
          data: fd,
          error: function(xhr, textStatus, errorThrown) {
              console.log('xhr'+ xhr);
              console.log('textStatus'+ textStatus);
              console.log('errorThrown '+errorThrown);
          },
          success: function(data){

          }(signedFormData) // end of success callback
      });  // end of AJAX*/
      uploadAjaxCalls[uploadAjaxCalls.length] = jqXHR;
  }

This works in Chrome, firefox and Edge. But doesn't work for IE11. I haven't tried any IE versions lower than 11. I have googled about this issue and tried everything I could but none of them worked for me.

So things I have tried include:

  1. Put 1 minisecond before running the ajax call. I have used the below code to call the method:

    setTimeout( function() { ajaxUpload(fd, file, signedFormData, nameOfFile); },1);

  2. Add AWS S3 website and the caller's website into IE's trusted sites list.
  3. Add <meta http-equiv="X-UA-Compatible" content="IE=Edge" /> into the web page.

But currently none of them worked for me yet. Any other thoughts?

1 Answer 1

2

I know this is old but here is to anyone else still dealing with this. Under IE11, Salesforce replaces the built in XMLHttpRequest. This is why you have to specify jQuery.support.cors = true but that alone is not enough. You have to get the right XMLHttpRequest in the ajax configuration. See the updated code below

function ajaxUpload(fd, file, signedFormData, nameOfFile) {
  var IsCompletedFired = 0;

  //Check if the XMLHttpRequest has been overridden and only force cors if it has
  if(Sarissa.originalXMLHttpRequest) {
      $.support.cors = true;
  }
  var jqXHR=$.ajax({

      xhr: function() {   

          //If the XMLHttpRequest has been overridden, we need to
          //use the original one without globaly replacing the one
          //from Sarissa
          return (Sarissa.originalXMLHttpRequest) ?
              new Sarissa.originalXMLHttpRequest() :
              new window.XMLHttpRequest();
      },
      url: "https://s3-ap-southeast-2.amazonaws.com/"+signedFormData.bucket +"/",
      type: "POST",
      crossDomain: true,
      contentType: false,
      processData: false,
      cache: false,
      async: true,
      dataType: false,
      enctype:"multipart/form-data",
      encoding:"multipart/form-data",
      data: fd,
      error: function(xhr, textStatus, errorThrown) {
          console.log('xhr'+ xhr);
          console.log('textStatus'+ textStatus);
          console.log('errorThrown '+errorThrown);
      },
      success: function(data){

      }(signedFormData) // end of success callback
  });  // end of AJAX*/
  uploadAjaxCalls[uploadAjaxCalls.length] = jqXHR;
}

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .