Stripe Browser-Only File Upload

by Leland

HTML

<script src="https://code.jquery.com/jquery-3.1.0.min.js"></script>
<div>
  <form method="post" id="fileinfo" name="fileinfo" ajax="true">
    <label>Select a file:</label>
    <br>
    <input type="file" id="file-box" name="file" required />
    <input type="submit" value="Upload" />
  </form>
</div>

<div>
  <div id='label-results'>...</div>
  <pre id="upload-results"></pre>
</div>

JavaScript

$('#fileinfo').submit(function(event) {
    event.preventDefault();

    var data = new FormData();

    var publishableKey = 'pk_test_***';

    data.append('file', $('#file-box')[0].files[0]);
    data.append('purpose', 'identity_document');

    $.ajax({
      url: 'https://uploads.stripe.com/v1/files',
      data: data,
      headers: {
        'Authorization': 'Bearer ' + publishableKey,
        // 'Stripe-Account': 'acct_STRIPE-ACCOUNT-ID'
      },
      cache: false,
      contentType: false,
      processData: false,
      type: 'POST',
    }).done(function(data) {
      $('#label-results').text('Success!');
      $('#upload-results').text(JSON.stringify(data, null, 3));
    }).fail(function(response, type, message) {
      $('#label-results').text('Failure: ' + type + ', ' + message);
      $('#upload-results').text(JSON.stringify(response.responseJSON, null, 3));
    });

    return false;
  });