你当前正在访问 Microsoft Azure Global Edition 技术文档网站。 如果需要访问由世纪互联运营的 Microsoft Azure 中国技术文档网站，请访问 https://docs.azure.cn。

Azure Static Web Apps 中通过 Azure API 管理提供 API 支持

Azure API 管理是一项服务，可用于为现有后端服务创建新式 API 网关。

将 Azure API 管理服务链接到静态 Web 应用时，对静态 Web 应用的任何请求（以 /api 开头的路由）都代理到 Azure API 管理服务中的同一路由。

Azure API 管理服务可以同时链接到多个静态 Web 应用。 为每个链接的静态 Web 应用创建 API 管理产品。 添加到产品的任何 API 都可用于关联的静态 Web 应用。

所有 Azure API 管理定价层都可以与 Azure Static Web Apps 配合使用。

Static Web Apps 的 API 选项包括以下 Azure 服务：

• Azure Functions
• Azure API 管理
• Azure 应用服务
• Azure Container Apps

有关详细信息，请参阅 API 概述。

注意

与 Azure API 管理的集成需要静态Web 应用标准计划。

静态Web 应用拉取请求环境中不支持后端集成。

先决条件

若要将 API 管理实例链接到静态 Web 应用，需要具有现有的 Azure API 管理 资源和静态 Web 应用。

资源	说明
Azure API 管理	如果还没有 Azure API 管理服务实例指南中的步骤，请按照创建一个 Azure API 管理 服务实例指南中的步骤操作。
现有的静态 Web 应用	如果还没有，请按照入门指南中的步骤创建无框架静态 Web 应用。

示例

请考虑通过以下位置公开终结点的现有 Azure API 管理 实例。

https://my-api-management-instance.azure-api.net/api/getProducts

链接之后，可以通过静态 Web 应用中的 api 路径来访问相同的终结点，如本示例 URL 所示。

https://red-sea-123.azurestaticapps.net/api/getProducts

这两个 URL 都指向同一 API 终结点。 API 管理 实例上的终结点必须具有/api前缀，因为静态Web 应用与向/api链接资源发出的请求匹配并代理整个路径。

链接 Azure API 管理服务

将API 管理实例链接到静态Web 应用

若要将 Azure API 管理服务作为静态 Web 应用的 API 后端链接，请执行以下步骤：

1. 在 Azure 门户中，转到 Static Web Apps。

2. 从导航菜单中选择“API”。

3. 找到要将 API 管理服务链接到的环境。 选择链接。

4. 在“后端资源类型”中，选择“API 管理”。

5. 在“订阅”中，选择包含要链接的 Azure API 管理服务的订阅。

6. 在“资源名称”中，选择 Azure API 管理服务。

7. 选择链接。

重要

链接过程完成后，对以 /api 开头的路由的请求将被代理到 Azure API 管理服务。 但是，默认情况下不会公开任何 API。 请参阅“配置 API”以接收请求以配置API 管理产品以允许要使用的 API。

配置 API 以接收请求

Azure API 管理具有一项产品功能，用于定义 API 的显示方式。 作为链接过程的一部分，API 管理服务配置了名为 Azure Static Web Apps - <STATIC_WEB_APP_AUTO_GENERATED_HOSTNAME> (Linked) 的产品。

若要使 API 可用于链接的静态 Web 应用，请将其添加到产品。

1. 在门户中的API 管理实例中，选择“产品”选项卡。

2. Azure Static Web Apps - <STATIC_WEB_APP_AUTO_GENERATED_HOSTNAME> (Linked)选择产品。

3. 选择“+ 添加 API”。

4. 选择要从静态Web 应用公开的 API，然后选择“选择”链接。

链接过程还会自动将以下配置应用于 API 管理服务：

• 与链接静态 Web 应用关联的产品配置为需要订阅。
• 创建一个名为 Generated for Static Web Apps resource with default hostname: <STATIC_WEB_APP_AUTO_GENERATED_HOSTNAME> 的 API 管理订阅，并将其范围限定为具有相同名称的产品。
• 将入站 validate-jwt 策略添加到产品中，以仅允许包含来自链接静态 Web 应用的有效访问令牌的请求。
• 链接的静态 Web 应用配置为在将请求代理到 API 管理服务时包括订阅的主密钥和有效访问令牌。

重要

更改 validate-jwt 策略或重新生成订阅的主密钥会阻止 Static Web Apps 将请求代理到 API 管理服务。 链接时，请勿修改或删除与静态 Web 应用关联的订阅或产品。

取消链接 Azure API 管理服务

若要从静态 Web 应用取消链接 Azure API 管理服务，请执行以下步骤：

1. 在 Azure 门户中，转到 Static Web Apps。

2. 找到要取消链接的环境，然后选择 API 管理服务名称。

3. 选择“取消链接”。

取消链接过程完成后，对以 /api/ 开头的路由的请求将不再被代理到 API 管理服务。

注意

不会自动删除与链接静态 Web 应用关联的 API 管理产品和订阅。 可以从 API 管理服务中删除它们。

疑难解答

如果 API 未关联到为静态Web 应用资源创建的API 管理产品，则/api访问静态 Web 应用中的路由会从 API 管理中返回以下错误。

{
  "statusCode": 401,
  "message": "Access denied due to invalid subscription key. Make sure to provide a valid key for an active subscription."
}

若要解决此错误，请在静态Web 应用中配置要公开的 API，如“配置 API 以接收请求”部分中所述。

后续步骤

API 概述