imageUpload.js

export function putToS3(file, signedRequest) {
  return new Promise((resolve, reject) => {
    const xhr = new XMLHttpRequest();
    xhr.open('PUT', signedRequest);
    xhr.setRequestHeader('x-amz-acl', 'public-read');
    xhr.onload = () => {
      if (xhr.status === 200) {
        resolve('ok');
      }
    };
    xhr.onerror = () => {
      reject('Could not upload file.');
    };
    xhr.send(file);
  });
}

sagas.js

export function* uploadImages(images, signedUrls) {
  try {
    yield put(uploadingImages('test'));
    if (images.size !== signedUrls.length) {
      throw new Error('images and signed requests nog consistent');
    }
    const uploadImages = images.map((image, index) => {
      const blob = dataURItoBlob(image);
      return putToS3(blob, signedUrls[index].signed_request);
    });
    yield Promise.all(uploadImages);
    yield put(uploadedImages());
  } catch (err) {
    console.error(err);
    yield put(uploadingImagesError('err'));
  }
}