使用AWS re:Post即您表示您同意 AWS re:Post 使用条款

如何通过 API Gateway 将图片或 PDF 文件上传到 Amazon S3?

4 分钟阅读
0

我想通过 Amazon API Gateway 将图片或 PDF 文件上传到 Amazon Simple Storage Service(Amazon S3)。 我还想检索图片或 PDF 文件。

简短描述

要通过 API Gateway 将图片或 PDF 作为二进制文件上传到 Amazon S3 桶,请激活二进制支持

要授予您的 API 访问您的 S3 桶的权限,请创建 AWS Identity and Access Management(IAM)角色。这个 IAM 角色必须包含 API Gateway 在您的 S3 桶上执行 PutObjectGetObject 操作的权限。

解决方法

为 API Gateway 创建 IAM 角色

  1. 打开 IAM 控制台

  2. 在导航窗格中,选择角色

  3. 选择创建角色

  4. 选择可信实体类型部分中,选择 AWS 服务

  5. 选择应用案例部分中,选择 API Gateway

  6. 选择您的应用案例部分中,选择 API Gateway

  7. 选择下一步: 权限
    **请注意:**本部分显示允许 API Gateway 将日志推送到用户账户的 AWS 托管服务。稍后您会为 Amazon S3 添加权限。

  8. (可选)选择下一步: 标签以添加标签。

  9. 选择下一步: 审核

  10. 对于角色名称,输入您的策略的名称。例如:api-gateway-upload-to-s3

  11. 选择创建角色

创建 IAM policy 并将其附加到 API Gateway 角色

  1. 打开 IAM 控制台

  2. 在导航窗格中,选择角色

  3. 在搜索框中,输入您创建的新 API Gateway 角色的名称。然后,从角色名称列中选择该角色。

  4. 角色详细信息页面选项卡上,选择添加权限

  5. 选择创建内联策略

  6. 可视化编辑器选项卡的选择服务部分中,选择选择服务

  7. 输入 S3,然后选择 S3

  8. 指定 S3 中允许的操作框中,输入 PutObject,然后选择 PutObject

  9. 输入 GetObject,然后选择 GetObject

  10. 展开资源,然后选择特定

  11. 选择添加 ARN

  12. 桶名称中,输入您的桶的名称。包括前缀(如果适用)。

  13. 对象名称中,输入对象名称。
    **请注意:**桶名称会指定上传文件的位置。对象名称指定了该对象必须遵循的策略调整模式。有关更多信息,请参阅桶命名规则Amazon S3 对象概述

14.选择添加

  1. (可选)选择下一步: 标签以添加标签。

  2. 选择下一步: 审核

  3. 名称中,输入您的策略的名称。

  4. 选择创建策略

  5. 在策略搜索框中,输入您在步骤 17 中创建的策略的名称,然后选择该策略。

  6. 选择策略操作,然后选择附加。系统将显示 IAM 角色列表。

  7. 搜索您之前创建的 API Gateway 角色。然后,选择该角色。

  8. 选择附加策略

创建 API Gateway REST API

创建 API 来服务您的请求

  1. 打开 API Gateway 控制台

  2. 在导航窗格中,选择 API

  3. 选择创建 API

  4. 选择 API 类型部分中,对于 REST API,选择构建

  5. API 名称中,输入您的 API 的名称,然后选择下一步

  6. 选择创建 API

为您的 API 创建资源

  1. 在 API 页面的资源面板中,选择 /

  2. 操作中,选择创建资源

  3. 资源名称中,输入文件夹

  4. 对于资源路径,输入 {folder}

  5. 选择创建资源

  6. 资源面板中,选择您在步骤 5 中创建的 /{folder} 资源。

  7. 选择操作,然后选择创建资源

  8. 资源名称中,输入对象

  9. 资源路径中,输入 {object}

  10. 选择创建资源

为您的 API 创建用于上传图片或 PDF 的 PUT 方法

  1. 选择操作,然后选择创建方法

  2. 从下拉列表中选择 PUT,然后点击选中标记图标。

  3. 集成类型类别下,选择 AWS 服务

  4. AWS 区域中,选择 us-east-1 或您在桶属性页面上看到的 AWS 区域。

  5. AWS 服务中,选择 Simple Storage Service (S3)

  6. 保持 AWS 子域为空。

  7. 对于 HTTP 方法,选择 PUT

  8. 对于操作类型,选择使用路径覆盖

  9. 对于路径覆盖(可选),输入 {bucket}/{key}

  10. 对于执行角色,输入您之前创建的 IAM 角色的 ARN。创建 ARN 是创建 IAM Policy 并将其附加到 API Gateway 角色的一部分。

  11. 对于内容处理,选择直通

  12. 选择保存

配置 PUT 方法的参数映射

  1. 在 API 页面的资源面板中,选择 PUT

  2. 选择集成请求

  3. 展开 URL 路径参数

  4. 选择添加路径

  5. 名称中,输入

  6. 映射来源中,输入 method.request.path.folder

  7. 点击行末尾的选中标记图标。

  8. 重复步骤 4 到 7。在步骤 5 中,将名称设置为密钥。在步骤 6 中,将映射来源设置为 method.request.path.object

为用于检索图片的 API 创建 GET 方法

  1. 在 API 页面的资源面板中,选择 /{object}

  2. 选择操作,然后选择创建方法

  3. 从下拉列表中选择 GET,然后点击选中标记图标。

  4. 集成类型类别下,选择 AWS 服务

  5. AWS 区域中,选择 us-east-1 或您在桶属性页面上看到的区域。

  6. AWS 服务中,选择 Simple Storage Service (S3)

  7. 保持 AWS 子域为空。

  8. 对于 HTTP 方法,请选择 GET

  9. 对于操作类型,选择使用路径覆盖

  10. 对于路径覆盖(可选),输入 {bucket}/{key}

  11. 对于执行角色,输入您之前创建的 IAM 角色的 ARN。创建 ARN 是创建 IAM Policy 并将其附加到 API Gateway 角色的一部分。

  12. 对于内容处理,选择直通

  13. 选择保存

为 GET 方法配置参数映射

  1. 在 API 页面的资源面板中,选择 GET

  2. 选择集成请求

  3. 展开 URL 路径参数

  4. 选择添加路径

  5. 名称中,输入

  6. 映射来源中,输入 method.request.path.folder

  7. 点击行末尾的选中标记图标。

  8. 重复步骤 4 到 7。在步骤 5 中,将名称设置为密钥。在步骤 6 中,将映射来源设置为 method.request.path.object

设置响应映射以在浏览器中查看图片或 PDF

  1. 在 API 页面的资源面板中,选择 GET

  2. 选择方法响应

  3. 扩展 200

  4. 200 的响应正文下,删除 application/json

  5. 200 的响应标头下,选择添加标头

  6. 名称中,输入 content-type

  7. 选择选中标记图标进行保存。

  8. 选择方法执行,返回方法执行窗格。

  9. 选择集成响应

  10. 展开 200,然后展开标头映射

  11. 在名为 content-type 的行,点击行末尾的铅笔图标。

  12. 输入 'image/jpeg' 以查看图片文件
    -或-
    输入 'application/pdf' 以查看 PDF 文件

为 API 设置二进制媒体类型

  1. 在 API 页面的导航窗格中,选择设置

  2. 二进制媒体类型部分中,选择添加二进制媒体类型

  3. 在文本框中,添加以下字符串:*/*
    **请注意:**不要给这个字符串加上引号。您可以将通配符替换为要作为二进制媒体类型处理的特定多用途互联网邮件扩展(MIME)类型。例如,要让 API Gateway 将 JPEG 图片视为二进制媒体类型,请选择 'image/jpeg'。如果您添加 */*,则 API Gateway 会将所有媒体类型都视为二进制媒体类型。

  4. 选择保存更改

使用 API 的二进制设置解决 CORS 错误

  1. 如果您在 Web 应用程序中使用前面提到的 API(PUT 和 GET),那么您可能会遇到 CORS 错误。有关更多信息,请参阅 Mozilla 网站上的 CORS 错误

  2. 对于开启二进制设置情况下出现的 CORS 错误,要解决这个问题,请从 API Gateway 控制台启动 CORS

  3. 在 API 页面的资源面板中,选择**/{object}**。

  4. 操作中,选择启用 CORS

  5. 选择启用 CORS 并替换现有的 CORS 标头

  6. 要更新内容处理属性,请运行 update-integration CLI 命令。这一更新允许二进制内容处理与模拟集成的预检 OPTION 请求。

  7. 更新 API ID、资源 ID 和 AWS 区域以运行以下两个 CLI 命令。要获取 API ID 和资源 ID,请从网关 API 控制台顶部选择 {object} 资源。

aws apigateway update-integration --rest-api-id API_ID --resource-id RESOURCE_id --http-method OPTIONS --patch-operations op='replace',path='/contentHandling',value='CONVERT_TO_TEXT' --region AWS_REGION
aws apigateway update-integration-response --rest-api-id API_ID --resource-id RESOURCE_id --http-method OPTIONS --status-code 200 --patch-operations op='replace',path='/contentHandling',value='CONVERT_TO_TEXT' --region AWS_REGION

部署 API

  1. 在 API 页面的导航窗格中,选择资源

  2. 资源窗格中,选择操作,然后选择部署 API

  3. 部署 API 窗口中,为部署阶段选择 [New Stage]

  4. 对于阶段名称,输入 v1

  5. 选择部署

  6. 在导航窗格中,选择阶段

  7. 选择 v1 阶段。系统将显示用于向已部署的 API 快照发送请求的调用 URL

  8. 复制该调用 URL。

**请注意:**有关更多信息,请参阅在 Amazon API Gateway 中部署 REST API

调用 API 将图片文件上传到 S3

将桶名称和对象的文件名附加到 API 的调用 URL。然后,用您选择的客户端发送 PUT HTTP 请求。例如,使用 Postman 外部应用程序,从下拉列表中选择 PUT 方法。选择 Body,然后选择 binary。出现 Select File 按钮时,选择要上传的本地文件。

有关更多信息,请参阅在 Amazon API Gateway 中调用 REST API

发送 PUT HTTP 请求以上传图片或 PDF 的 curl 命令示例

在以下示例中,abc12345 是您的 API ID,testfolder 是您的 S3 桶,testimage.jpeg 是您上传的本地文件:

curl -i --location --request PUT 'https://abc12345.execute-api.us-west-2.amazonaws.com/v1/testfolder/testimage.jpeg' --header 'Content-Type: text/plain' --data-binary '@/Path/to/file/image.jpeg'

**重要信息:**如果二进制媒体类型列表中是 */*,则您可以发送 PUT 请求来上传文件。如果二进制媒体类型列表中是 image.jpeg,则您必须在 PUT 请求中添加 Content-Type 标头。您必须将 Content-Type 标头设置为 'image/jpeg'

现在,您可以在 Web 浏览器中使用相同的 URL 查看图片或 PDF。这是因为 Web 浏览器发出 GET 请求。

相关信息

使用 API Gateway REST API 激活二进制支持