如何通过 API 网关公开存储在 aws lambda 代码中的静态目录？

Question

我正在尝试仅使用 aws lambda 提供静态 React 应用程序包。 我在捆绑期间使用了

NodejsFunction

并应用了

commandHooks

将 React 构建与我的代码捆绑在一起，如下所示。如你所见，我还将它附加到 API 网关。

  private uiLmbda = new NodejsFunction(this, "renderer", {
    entry: path.join(__dirname, "..", "handlers", "ui-handler.ts"),
    handler: "handler",
    bundling: {
      commandHooks: {
        beforeBundling(inputDir: string, outputDir: string) {
          const staticAssets = path.join(__dirname, "..", "build");
          const relativePath = path.relative(inputDir, staticAssets);
          return [`cp -r ${relativePath} ${outputDir}`];
        },
        afterBundling(inputDir: string, outputDir: string) {
          return [];
        },
        beforeInstall() {
          return [];
        },
      },
    },
  });

  private scanAPI = new RestApi(this, "scan-api");
  private uiGatewayIntegration: LambdaIntegration = new LambdaIntegration(
    this.uiLmbda
  );

在构造函数中我称之为：-

 this.scanAPI.root.addMethod("GET", this.uiGatewayIntegration, {});

现在，我有一个

index.js

作为我的 lambda 处理程序和一个包含

index.html

和其他引用的静态文件的构建文件夹，如下所示。

处理程序代码如图所示：-

import * as fs from "fs";
import * as path from "path";

export const handler = async (event: any) => {
  try {
    console.log(path.resolve("./build/index.html"));
    return {
      statusCode: 200,
      headers: {
        "content-type": "text/html",
      },
      body: fs
        .readFileSync(path.join(__dirname, "build", "index.html"))
        .toString("utf-8"),
      isBase64Encoded: false,
    };
  } catch (error) {
    console.log(error);
  }
};

所以我可以使用上面的处理程序发送 html。 但不是相关文件，因为 api 网关似乎不知道我希望从 get 方法渲染子目录。对我如何做到这一点有任何帮助吗？附上屏幕截图，您可以在其中看到 main.js （通过 html 引用为

<script src='/task/var/build/main'><script/>

）从 api 网关给出 403。

Answer 1

好吧，事实证明我需要在两个地方处理这种情况，一个是 api 网关，另一个是 lambda 处理程序。 我使用

express.static

附加了 lambda 来提供静态文件，并在 api 网关中启用了代理，并且它起作用了。

编辑：哎呀！我想我只从处理程序返回

index.html

，这样我只能渲染 html，我需要做的是通过读取

event.resource

键检查事件本身的 url 路径，然后发送相应的路径文件静态文件夹，还需要根据文件扩展名设置

content-type

标头