Image/png is not serving properly by serverless-http

[hanzenlim]

Hi,

Is serverless-http able to serve jpg/png images? I have some image assets that I deployed with my application but it's not rendering the img/png correctly. The content-type shows image/jpeg and it's serving properly, getting 200 but not displaying correctly. Is this an encoding issue.

Any help would be greatly appreciated.

[dougmoscrop]

Yes, this library supports serving assets, however it's not only about this library. You have to set up API Gateway Binary Encoding support.

The documentation isn't very good: https://github.com/dougmoscrop/serverless-http#binary-support

I don't have time this weekend to improve it but the gist of it is you need to take your binary data, encode it in base64, and set the binary flags in your API as well as in this library.

If you want to poke around you can take a look here: https://github.com/dougmoscrop/serverless-http/blob/aa2910e848a0d18d093763edc9674f690a977284/lib/is-binary.js and so on. Otherwise I'll try to improve the docs next week.

[dougmoscrop]

I've updated the integration tests to demonstrate serving a binary image png: https://github.com/dougmoscrop/serverless-http/commit/7228c0b601b2e6b1b505c9f99f732e3a4547e03a

Note that it requires a serverless plugin, and, API gateway has quirks.

If you send "Accept: image/png", it will work. If you send "Accept: image/" it will not, unless you also add image/ to the list of binary media types. It has nothing to do with this plugin, it's an APIg config oddity.

[huksley]

Hi @dougmoscrop ! Can you please clarify. If using regular browser, how can we serve static binary files from lambda? Browser does not send Accept: image/png for images.

UPDATE: I have had checked right now:

wget -S https://custom.domain.lambda/favicon.png result in base64 encoded image file

But calling wget -S --header "Accept: image/png" https://custom.domain.lambda/favicon.png result in proper file.

So binary responses will work only in APIs....

[dougmoscrop]

yeah, API gateway is a bit of a mess. best not to serve assets from APIg tho, use S3, even if it means minting a signed URL.

[huksley]

Hmm, thanks!

I would like to make a hybrid API Gateway endpoint where all dynamic (and possibly unknown beforehand, if using isomorphic rendering in React) paths are handled by Lambda/Express/servlerless-http

and all static resources are automatically uploaded to S3 and API Gateway proxies forwards requests for them to S3

or you recommend to just use CDN uris in HTML generated and never hit API GW with static resources???