AWS API Gateway and Lambda to return image

Question

Say I have this HTML:

What I would like to do is have example.com/pic map to an AWS API Gateway end

Answer 1

Just to be clear, the client does two different requests:

1. The first to get the HTML (including the image url).
2. The second to fetch the image data from the url.

In other words, the image data is not inlined in the HTML.

Based on this knowledge you can have a Lambda (behind the API gateway) as you suggest. The Lambda implementation can have some logic that determines the url to the image stored in S3. However, the Lambda returns JSON data and not HTML (there are workarounds such as return the html in a variable) which makes things trickier, especially for large HTML pages.

I suggest a slightly different approach, since just receiving an image tag will not get you far. I assume you will inline the image tag in a HTML document, probably by using JavaScript. Then you might as well let the API Gateway / Lambda request return a JSON document with the image url and let the JavaScript either update an existing image tag with the new url or generate the tag for you.