By using AWS re:Post, you agree to the AWS re:Post Terms of Use
AWS re:Postre:Post

Unable to make it work for multiple S3 buckets AWS Serverless Image Handler

0

We start using AWS serverless image handler https://docs.aws.amazon.com/solutions/latest/serverless-image-handler/overview.html and deploy the solution successfully. Our images reside in 3 different S3 buckets and we provided comma separated S3 bucket name in CloudFormation template like bucket1, bucket2, bucket3

We are only able to access from 1st bucket like following https://sample.cloudfront.net/300x0/test.jpg

based on documentation, if we use url like following, it don't return us image. https://sample.cloudfront.net/300x0/bucket1/test.jpg

We aren't sure if we need to update anything in cloudformation or something is missing. We are using latest version V6.2.1.

Will appreciate any help on this.

Topics
ServerlessManagement & GovernanceNetworking & Content Delivery
Tags
ServerlessAWS CloudFormationAmazon CloudFront
Language
English
JVM
asked 9 months ago220 views
1 Answer
1

Hi, thanks for asking this question on re:Post!

In your last URL, you seem to be combining Thumbor filters with a specific Bucket. This is not supported, you can either:

Please note that the supported Thumbor filters are addressing only the quality and appearance of the images. To be able to also specify the bucket, you must use the image request approach.

AWS
Piotrek
answered 9 months ago
  • JVM
    8 months ago

    I understood your answer and realize that thumbor filters won't work with specific bucket. If i need to retrieve image from specific bucket, I need to use image request. In our react application, I am trying this using following code

      const imageRequest = JSON.stringify({
    bucket: "bucket3",
    key: `lg_${imageName}`,

    // bucket: "bucket1",
    // key: `test.jpg`,

    // edits: {
    //     grayscale: true
    // }        
  })  
  console.log('ImageREquest ', imageRequest) 
  // const encodedObject = btoa(imageRequest);
  // let url = `${process.env.REACT_APP_SLS_IMAGE_CLDFRONT}/${encodedObject}`
  let url = `${process.env.REACT_APP_SLS_IMAGE_CLDFRONT}/${Buffer.from(imageRequest).toString('base64')}`
  console.log('URL is --> ', url)

    So URL which i receive as part of above code, when i put this in browser, it don't return me the image. We already have "bucket3" as one of the source bucket.

    Comment line for bucket1 works and uncoded request do return me image but that is the first bucket mentioned in source_buckets.

    I will appreciate any help on this.

You are not logged in. Log in to post an answer.

A good answer clearly answers the question and provides constructive feedback and encourages professional growth in the question asker.

Guidelines for Answering Questions

Relevant content