2

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?

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;
}
| improve this answer | |

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.