1

I have a bucket where i save all my user related files and i want the user to be able to download those files, the problem i have is that i need to proxy the petition via an api url like

https://myproject.com/api/file/:key

where :key is the object key in the s3, that way i hide the s3 bucket to my user and the url is more friendly.

the result should be something like this if i click the link, it opens a browser tab and display the image

i have tried this

  const s3 = new AWS.S3();
  const s3Params = {
    Bucket: Bucket,
    Key: Key,
  };
  const data = s3.getObject(s3Params).promise();
  res.download(data, 'file.jpg'); // does not work as the file is not in fs
  res.attachment(data) // does not work, i always get timeout
  res.sendFile(data) // same as download

  res.set('Content-type', mime); // the console show the response broken 
  res.send(data) // the console show the response broken and the page is blank

I also tried fetching the file from a signed url

const signingParams = {
    keypairId: Id,
    privateKeyString: Key,
    expireTime: expireTime,
  }
  // Generating a signed URL
  const signedUrl = cfsign.getSignedUrl(
    `https://${url}.cloudfront.net/${params.key}`,
    signingParams,
  );
  axios.get(signedUrl).then(({ data }) => {
    res.set('Content-Type', 'image/png')
    res.send(data);
  }).catch((error) => {
    console.log(error);
  })

But the response return this enter image description here

How could i achieve this? i out of ideas.

John Rotenstein
  • 241,921
  • 22
  • 380
  • 470
Carlos Salazar
  • 1,818
  • 5
  • 25
  • 48

1 Answers1

0

Base on your screen. I believe the issue comes from NodeJs/Express but not S3 or AWS

The solutions to your issues can be partially found here How to serve an image using nodejs

I made a small working version for you here, essentially piping the response directly

axios({
  method: 'get',
  url: "https://cdn.sstatic.net/Sites/stackoverflow/Img/apple-touch-icon@2.png?v=73d79a89bded",
  responseType: 'stream'
})
  .then(function(response) {
    response.data.pipe(res)
});

https://runkit.com/qkhanhpro/test

Click on "endpoint" to test if the image will be displayed correctly

qkhanhpro
  • 4,371
  • 2
  • 33
  • 45