Hi there,

I am trying to upload assets through the getSignedUrl method that the aws-sdk provides, a NodeJS backend with Axios where the upload happens from a VueJS 2 frontend. Now whatever combination i try, or the file is able to upload but always sets it to private and the wrong Content-Type, or i get 403 permission errors.

What i want to do is that the upload has an ACL that is public-read and the correct Content-Type.

The following is the code that i use:

To get a signed Url

const s3 = new AWS.S3({
    accessKeyId: keys.spacesAccessKeyId,
    secretAccessKey: keys.spacesSecretAccessKey,
    signatureVersion: 'v4',
    endpoint: 'https://fra1.digitaloceanspaces.com',
    region: 'fra1'
});

app.get('/api/upload/image', (req, res) => {
        const type = req.query.type;

        s3.getSignedUrl('putObject', {
            Bucket: 'vondel',
            ContentType: type,
            ACL: 'public-read',
            Key: 'random-key'
        }, (error, url) => {
            if (error) {
                console.log(error);
            }
            console.log('KEY:', key);
            console.log('URL:', url);
            res.send({ key, url });
        });
    });

This provides a signed url that looks like:

https://BUCKET.REGION.digitaloceanspaces.com/images/e173ca50-fafe-11e9-b18c-d3cfd4814069.png?Content-Type=image%2Fpng&X-Amz-Algorithm=AWS4-HMAC-SHA256&X-Amz-Credential=NSX3EZOFXE57BAFSKDIL%2F20191030%2Ffra1%2Fs3%2Faws4_request&X-Amz-Date=20191030T102022Z&X-Amz-Expires=900&X-Amz-Signature=f6bcdcd35da5dc237f881a714ec9ca09cb7aa3f3ffbd2389648a7c30808ab56e&X-Amz-SignedHeaders=host%3Bx-amz-acl&x-amz-acl=public-read

Then for actually uploading the file i use the following:

await UploadService.uploadImage(uploadConfig.data.url, file, {
          'x-amz-acl': 'public-read',
          'Content-Type': file.type
      });

With the service looking like:

  async uploadImage (url, file, headers) {
    await axios.put(url, file, headers.headers);
  }