XMLHttpRequest проходит, но мой вызов Jquery Ajax не вызывает то же самое

Question

Я не могу понять, почему первый вызов проходит, а второй вызов я получаю 400 ошибка!

// passes with a 200 success
var data = new FormData();
data.append('file', document.querySelector('#file-box-front').files[0]);
data.append('purpose', 'identity_document');

var oReq = new XMLHttpRequest();
oReq.open("POST", 'https://uploads.stripe.com/v1/files', true);

oReq.setRequestHeader('Authorization', 'Bearer ' + scope.apiKey);

oReq.onload = function(oEvent) {
  if (oReq.status == 200) {
    document.querySelector('#label-results').textContent = 'Success!';
  } else {
    document.querySelector('#label-results').textContent = 'Failure: ' + oReq.status;
  }
  document.querySelector('#upload-results').textContent = oReq.response;
}
oReq.send(data);


// jquery call below fails with 400
var options = {
  url: 'https://uploads.stripe.com/v1/files',
  type: "post",
  headers: {
    "Authorization": "Bearer " + scope.apiKey
  },
  processData: false,
  data: data
};

$.ajax(options)
  .done(function(response) {
    var i = 0;
  })
  .always(function() {

  })
  .fail(function(jqXHR, textStatus) {
    yb.base.eventAlert("Error submitting image. Please contact  help desk.", "error");
  });

Answer 1

В вашем вызове jQuery отсутствует параметр contentType

var options = {
  url: 'https://uploads.stripe.com/v1/files',
  type: "post",
  headers: {
    "Authorization": "Bearer " + scope.apiKey
  },
  processData: false,
  contentType: false, // prevents jQuery from setting the default content type
  data: data
};