Report this

What is the reason for this report?

Cant upload files to DO space with Signed Urls.

Posted on June 15, 2022

-----------------BACK-END - CONFIG FILE---------------

import aws from 'aws-sdk'
import { authConfig } from '../appConfig/auth'

const regionName = authConfig.FILE_STORAGE.DO_FILES_REGION-----> //sgp1
const spacesEndpoint = new aws.Endpoint(`${regionName}.digitaloceanspaces.com`)

const doS3Client = new aws.S3({
  endpoint: spacesEndpoint,
  accessKeyId: authConfig.FILE_STORAGE.DO_FILES_KEY,
  secretAccessKey: authConfig.FILE_STORAGE.DO_FILES_REGION,
  region: authConfig.FILE_STORAGE.DO_FILES_REGION,
  signatureVersion: 'v4',
})

export { doS3Client }

--------------BACK-END - SIGNED URL GENERATION------------

const s3Params = {
  Bucket: DOBucket,
  Key: data[i]?.fileName,
  ContentType: data[i]?.fileType,
  ACL: 'public-read',
  Expires: 60,
}

const signedRequest = await doS3Client.getSignedUrl('putObject', s3Params)

------FRONT-END(REACT-NATIVE) -FILE UPLOAD-------

const uploadToDOSpaces = async (data: FileUploadInput[], signedUrls: any) => {

console.log('--signedUrls--', signedUrls[0].signedRequest);
console.log('--data--', data[0].file);
console.log('--data--', data[0].fileType);

Signed url
-------------
https://development.sgp1.digitaloceanspaces.com/products/905f9-20220614T144822607Z-beeimage.jpg?Content-Type=image%2Fjpg&X-Amz-Algorithm=AWS4-HMAC-SHA256&X-Amz-Credential=OL42EYV5C64X6D5RJI7E%2F20220614%2Fsgp1%2Fs3%2Faws4_request&X-Amz-Date=20220614T144822Z&X-Amz-Expires=60&X-Amz-Signature=9aedf1fad0ba57a47e618c3d0e575973f39f03532c1e3e4132c6611fd4447fbe&X-Amz-SignedHeaders=host%3Bx-amz-acl&x-amz-acl=public-read

File to Upload
-------------
file:///Users/drgrey/Library/Developer/CoreSimulator/Devices/5B16C844-7447-443A-AC8A-5F66D3729A45/data/Containers/Data/Application/623EA2EA-B9FA-490F-B966-8D78C3C6FC96/Library/Caches/5DFC3AD3-8DA3-4C29-87E9-06D36AC56BDF.jpg

File Type
-----------------
image/jpg


    try {
      for (let i = 0; i < data.length; i++) {
        await fetch(signedUrls[i].signedRequest, {
          headers: {
            'Content-Type': data[i].fileType,
            'Cache-Control': 'public,max-age=31536000,immutable',
            'x-amz-acl': 'public-read',
          },
          method: 'PUT',
          body: await upload(data[i].file),
        });
      }
    } catch (error) {
      console.log('error', error);
    }
};

const upload = (file: string): any => {
    try {
      return new Promise((resolve, reject) => {
        const xhr = new XMLHttpRequest();
        xhr.onerror = reject;
        xhr.onreadystatechange = () => {
          if (xhr.readyState === 4) {
            resolve(xhr.response);
          }
        };
        xhr.open('GET', file);
        xhr.responseType = 'blob'; // convert type
        xhr.setRequestHeader('x-amz-acl', 'public-read');
        xhr.send();
      });
    } catch (error) {
      console.log('error', error);
    }
};

The developer cloud

Scale up as you grow — whether you're running one virtual machine or ten thousand.

Start building today

From GPU-powered inference and Kubernetes to managed databases and storage, get everything you need to build, scale, and deploy intelligent applications.