The Coder
The Coder

Reputation: 343

Return image from aws lambda function

Hey guys I'm trying to return an image as an http response from aws lambda/api-gateway. For some reason my response ends up with an empty image. Here's what I have on aws lambda:

"use strict";

var handler = function (event, context, callback) {
const base64Image = "iVBORw0KGgoAAAANSUhEUgAAAKAAAACgCAAAAACupDjxAAAFPklEQVR42u2ZvWsqTRSH7//0g0UEYQmIIIIEBAtBEAIWFhaBgBCwsBBuEQtBEEHSWKSwCFhYSJoUKQIXLgRsLERSCBYSJFgsct7CndmP2RGi7np5OdtlTtw8mY/nnDn+on/8+cWADMiADMiADMiADMiADMiADMiADMiADMiADMiADMiADMiADMiADMiADMiADMiADMiA/0vAm6tMrliu1hoPncdBv9tq3FVKuXTSTC1pmzaT2WK11mj1Br12s35bKeWzydQnWdmYmc6X7xrtbrfdrFUKaTNWIJoY8atssVp/6PQ6rXq1mDFjudMBU9A8f2hjBAbeaBEwmifqqaPXpwN+NPMBHGa59U30Uksrf/G2vaHd433BMxovtaZEn+27jHvUKDzMz7IHN5NrL0V6aInYvOIO3M3kh2a3cjQzkr++G8t/yehszndIrEHchZFZu2NDF597fCfQ25Z7eBqzl3x+3lP87iL86w21ZeDF+5H9YNf3pvp+EVbn1syzxEjsfNObE5Gxd2cAAG79LxrYJ+nsHpR7SlHDm4j89gwvASD55f/tIQDUQxD1IiaOpOUPid12tXWPvqqrLnZEfBlGJvktJmqiqEhERu7RGoBqgPmVqT4X4KfwYYV0U5h3ja0MwFCP6toAjM9wcnFNTJTyZ99F5NUZawXP1ABALaRi4a/AaCqhoh0pOhMYBxJr9SXXqqfOV82I/JVQcsBEsL+7d2xHfcUbgEJo5ZZ04cAf2YlkWBaOiQHmJlhWo9AAt6aNkd0F2g0APvY/NwD01TcsDSBphVewtgIOg82etCP7zLEwgNSWAiXYCbGiPmCavmCfERHdA3gKKDqSgLEKEZCqWtN8JezIPRHNDCATsJJjOx4e4JveNA+izvvUH4WSs0nDujRda02zNCT7FEBup3546jFlOIADrWnsQg+IrSpBCds+2qOQATcJrWlmgr2skfEm/kPHHHUvbmpN45wgTUE6CKivzw8o50k1zR+H70azf3/mmOM6C2WtaWTJAPzRGOCewgec6E0jQ2XdneEjAkArrTWNLBnSVnAaLlIEgE5SU00zDKz9909HufaFBbiOaU0jSwZV01YSSFmRANK93jR97cVqDKAXUX/wQ28aGSoEXOZiq4gAHZ0oprnTmXr2k9v6yYAjnWlmjqrLahqeRga4vdKY5haaFtMmAZQoMkCnoTVQdqBc/qo/DY8jBJS1n9c0FcBYVDy1v/3kjnLM8YDOWr76LvZNp8tQ83YeehQl4HuQacpAfOWccWPhPtyxdaSAlFNN8w6g7S4ZGu4+Up2iBXxSTXMDmF9EtMvK2t+VhqcRA34n/KZ5A/DoLRke7DSc0lSwYQI67cyBk17sXoIsGezu1lhzhwoXcA6vaV4ADP0lQ1esfdqKHFB2VW3T5IFry99lML/t/Nen6AFfPKaZeJax5V7/JhBfXwBwl3GZZpfzVFgy06Qs2iSOdsxpgPTo+npk5CuwRJcBQ3o63jEnAq7j0jRW1ldfybora+WOd8yJgM40DZ6VG6XsMjROcMypgFM5TRnfN52eLsPxjjkVkEquL6fn+lifLgU4diAaWgud4JiTAa2khFjq650GXQyQOgKipcaegyrrqAFXtpDNgFW0UgcaSVEBintw/4DIXy4KuLdJchsU25gAkN5dFJDyCP7KRl5OH+mygEMAWY2IVzEg/nVhwK154EbeONEx5wCk7oFSYGHG5xcHpOWBU/C9ocsDhvswIAMyIAMyIAMyIAMyIAMyIAMyIAMyIAMyIAMyIAMyIAMyIAMy4D/6/AdhR419vDNESgAAAABJRU5ErkJggg==";
const image = Buffer.from(base64Image, 'base64');

    var response = {
        statusCode: 200,
        headers: {
            "Content-Type": "image/jpeg"
        },
        isBase64Encoded: true,
        body: image.toString('base64')
    };
    callback(null, response);
};
exports.handler = handler;

I have also set Binary Media Types to / Any idea on how to get this working? Heres also what my result after enter image description here

Upvotes: 3

Views: 3733

Answers (2)

SandDev
SandDev

Reputation: 86

if you are using Lambda Proxy integration on your API gateway try the following steps.

  1. under AWS API gateway > Models > create a model name with ImageJPEG and {} as model schema.

  2. under API gateway > Resources > your GET endpoint > click 'Method Response'. create new response status for 200. add new header 'Content-Type' under 'Response Headers for 200'. add 'Response Body for 200' as 'image/jpeg' and select ImageJPEG as modal you previously created.

  3. under API gateway > Settings > 'Binary Media Types'.

add 'image/jpeg' and 'text/html' as supported binary type. 'text/html' is required if you are accessing directly via browser. (otherwise, it should work if you send the 'Accept' header as 'image/jpeg'). If that didn't work add */* as binary media type to allow all types.

Upvotes: 3

Richard Lee
Richard Lee

Reputation: 2245

One solution (that I use) is returning the base64 string of your image, then on API Gateway you convert from base64 string to binary.

aws apigateway update-integration-response \ 
 — rest-api-id <xxx> \
 — resource-id <xxx> \ 
 — http-method GET \ 
 — status-code 200 \ 
 — patch-operations ‘[{“op” : “replace”, “path” : “/contentHandling”, “value” : “CONVERT_TO_BINARY”}]’

Later, you have to add */* as the Binary Media Types, under the Settings option in API Gateway. From the cli:

aws apigateway update-rest-api — rest-api-id XXX — patch-operations ‘[{“op” : “replace”, “path” : “/binaryMediaTypes/*~1*”, “value” : “*~1*”}]’

note: you should redeploy the api gateway

Upvotes: 2

Related Questions