javascript - 使用 lambda 发送 html 文件会产生语法错误，但只是有时

Question

编辑:所以当我注意到网络中只有当我的 .ico 图像未发送时页面才不会加载时，我正在摆弄开发工具，也许这有问题。

我对使用 React 很陌生，对使用 Lambda/API 网关等也很陌生。我遇到了一个问题，有时我的网站会出现语法错误，例如:

语法错误: 后缺少名称。运算符

或

语法错误:: 运算符后缺少名称

但如果我继续刷新，可能会出现另一个错误，或者网站只会加载。有时它不会加载 css，或者有时其他内容无法正确加载。最多可能需要 2-3 次刷新才能使网站达到完整状态。

是的，我不使用 API 网关来处理这一切是有充分理由的。

有什么想法吗？

代码有点乱，但应该可读。

我不太确定从哪里开始调试这样的东西。 lambda 函数所做的就是打开 s3 存储桶，获取 react 生成的编译后的 css/js 文件，并将其发送给发出请求的人。

if(event.path === '/')
  {
    let bucket = process.env.CODE_S3_BUCKET;
    let key = path.join(process.env.ADDITIONAL_ARTIFACTS_S3_PATH, 'index.html');

    let dataBody; 

    var params = {
      Bucket: bucket,
      Key: key
    };

    return s3.getObject(params, (err, data) => {
      if (err) {
        console.error('Error getting object: ' + bucket + ':' + key);
      } else {

        dataBody = data.Body.toString();

        callback(null, {
          statusCode: 200,
          isBase64Encoded: false,
          body: dataBody,
          headers: {
            'Content-Type': 'text/html'
          }
        });
      }
    }).promise();
  }
  else
  {

    let bucket = process.env.CODE_S3_BUCKET;
    let key = path.join(process.env.ADDITIONAL_ARTIFACTS_S3_PATH, event.path);

    let mimeType = mime.lookup(key);

    let dataBody; 

    var params = {
      Bucket: bucket,
      Key: key
    };


// Checks if its in the included file types

    if(textMimes.includes(mimeType))
    {

      return s3.getObject(params, (err, data) => {
        if (err) {
          console.error('Error getting object: ' + bucket + ':' + key);
        } else {

          dataBody = data.Body;

          callback(null, {
            statusCode: 200,
            isBase64Encoded: false,
            body: dataBody.toString(),
            headers: {
              'Content-Type': mimeType
            }
          });
        }
      }).promise();

    } else {

      return s3.getObject(params, (err, data) => {
        if (err) {
          console.error('Error getting object: ' + bucket + ':' + key);
        } else {

          dataBody = data.Body;

          callback(null, {
            statusCode: 200,
            isBase64Encoded: true,
            body: dataBody.toString('base64'),
            headers: {
              'Content-Type': mimeType
            }
          });
        }
      }).promise();

    }

Answer 1

不是答案，但也许这个版本会让你更容易思考重要的部分，而不是专注于重复:

const is_at_root = event.path === '/';
const s3_params = {
        Bucket: process.env.CODE_S3_BUCKET,
        Key: path.join(process.env.ADDITIONAL_ARTIFACTS_S3_PATH, is_at_root ? event.path : 'index.html')
    };
const mime_type = mime.lookup(key);
const requires_base64 = textMimes.includes(mime_type);
const callback_params = {
    statusCode: 200,
    isBase64Encoded: requires_base64,
    body: requires_base64 ? data.Body.toString('base64') : data.Body.toString(),
    headers: {
        'Content-Type': requires_base64 ? mime_type : 'text/html'
    }
}

return s3.getObject(s3_params, (err, data) => {
    if (err) {
        console.error('Error getting object: ' + s3_params.Bucket + ':' + s3_params.Key);
    } else {
        callback(null, callback_params);
    }
}).promise();