Lambda@Edge 仅对某些图像提供 502

Question

我们所做的是请求像“media/catalog/product/3/0/30123/768x/lorem.jpg”这样的图像，然后我们使用位于“media/catalog/product/3/0/”的原始图像30123.jpg”，如果浏览器支持，则将其调整为 768px 和 webp，然后返回新图像（如果尚未缓存）。

如果您要求：wysiwyg/lorem.jpg 它将尝试创建最大 1920 像素（无放大）的 webp。

这似乎在 <= 1420 像素宽的图像内工作得很好。然而上面我们只得到HTTP 502: The Lambda function returned invalid json: The json output is not parsable.

SO 上有一个与 GZIP 相关的类似问题，但是据我所知，您不应该真正使用 GZIP 图像：https : //webmasters.stackexchange.com/questions/8382/gzipped-images-is-it-worth/57590# 57590

但原始图像可能已经上传到 S3 GZIPPED。但是 gzip 可能会导致错误，因为为什么它适用于较小的图像呢？我们在 Cloudfront 中禁用了 GZIP。

我给了 Lamda@Edge Resize 函数最大资源 3GB 内存和 30 秒超时..这对于更大的图像还不够吗？

我已经删除了已经生成的图像，使 Cloudfront 无效，但它的行为仍然相同..

编辑：更新：

我只是尝试了一个不同的图像，然后它工作正常..我不知道为什么以及如何解决损坏的图像然后......我猜Cloudfront现在已经缓存了502..我已经使用“*”无效但没有没有帮助..两个原始文件都是jpg。

工作图像的原始源图像是 6.1 MB，如果重要的话，非工作图像是 6.7 MB。

他们有这些限制：https : //docs.aws.amazon.com/lambda/latest/dg/limits.html

response.body 停止工作时大约为 512 MB。

Answer 1

Lambda 中存在一些低限制，尤其是在 Lambda@Edge 中对响应大小的限制。整个响应、标头和正文的限制为 1 MB。如果 lambda 函数返回更大的响应，它将被截断，这可能导致 HTTP 500 状态。请参阅文档。

您可以通过在 S3 上保存结果图像（或者可能首先检查它是否已经存在）来克服这个问题，然后而不是将其返回，只需将 301 重定向到与该存储桶集成的 CloudFront 分配 - 这样图像请求将被重定向到结果图像。

例如在带有 Origin-Response 触发器的 node.js 中：

'use strict';
exports.handler = (event, context, callback) => {
    // get response
    const response = event.Records[0].cf.response;
    const headers = response.headers;

    // create image and save on S3, generate target_url
    // ...

    // modify response and headers
    response.status = 301;
    response.statusDescription = 'Moved Permanently';
    headers['Location'] = [{key: 'Location', value: target_url}]; 
    headers['x-reason'] = [{key: 'X-Reason', value: 'Generated.'}]; 

    // return modified response
    callback(null, response);
};

简单 Lambda 网关的版本（没有源响应，替换标头）：

exports.handler = (event, context, callback) => {
    // create image and save on S3, generate target_url
    // ...
    var response = {
      status: 301,
      headers: {
        Location: [{
          key: 'Location',
          value: [],
        }],
        'X-Reason': [{
          key: 'X-Reason',
          value: '',
        }],
      },
    };
    callback(null, response);
}