在 Azure 静态 Web 应用中托管数据 API 生成器(预览版)

部署指南序列中当前位置(“发布”)的关系图。

部署指南序列图,包括以下位置:概述、计划、准备、发布、监视和优化。 当前突出显示了“发布”位置。

使用配置文件在 Azure 静态 Web 应用中快速托管数据 API 生成器。 本指南包含将数据 API 生成器与静态 Web 应用集成的步骤。

在本指南中,逐步讲解如何生成 DAB 配置文件、将文件作为应用程序的一部分托管,然后在 Azure 静态 Web 应用中使用数据库连接。

先决条件

重要

使用数据库连接的 Azure 静态 Web 应用中对数据 API 生成器(DAB)的支持处于预览状态。 Azure 静态 Web 应用使用 DAB 引擎的固定版本,该版本可能与最新稳定版 DAB 不同。 若要访问最新的 DAB 功能,请考虑使用 GitHub、Microsoft 容器注册表(Docker Hub)或 NuGet 中最新版本的引擎的 DAB 备用主机。

  • 可从 Azure 寻址的现有数据库。

创建静态 Web 应用

首先,使用 Azure 门户在 GitHub 中使用 Web 应用程序创建新的 Azure 静态 Web 应用。

  1. 登录到 Azure 门户(https://portal.azure.com)。

  2. 创建新的资源组。 你将使用此资源组来获取本指南中的所有新资源。

    Azure 门户中“创建资源组”页的“基本信息”选项卡的屏幕截图。

    提示

    建议 msdocs-dab-swa命名资源组。 本指南中的所有屏幕截图都使用此名称。

  3. 创建 Azure 静态 Web 应用。 使用这些设置配置静态 Web 应用。

    设置 价值
    资源组 选择之前创建的资源组
    名称 输入全局唯一名称
    计划类型 为工作负荷选择最佳选项
    选择 GitHub
    GitHub 帐户 配置有权访问 Web 应用程序存储库的 GitHub 帐户
    组织 为存储库选择父组织或用户
    存储库 选择存储库名称
    Branch 选择主分支

    Azure 门户中“创建静态 Web 应用”页的“基本信息”选项卡的屏幕截图。

  4. 等待静态 Web 应用程序部署完成。 GitHub Actions 工作流会自动添加到存储库,每次推送到主分支时,该工作流都会将应用程序部署到 Azure 静态 Web 应用。

    注意

    此初始部署可能需要几分钟时间。 始终可以在 Azure 门户或存储库中的 GitHub Actions 选项卡中检查部署的状态。

  5. 在 Azure 门户中导航到新的静态 Web 应用。

  6. 在“Essentials”部分中,使用 URL 超链接导航到正在运行的 Web 应用程序。 验证应用程序是否按预期运行。

添加 DAB 配置文件

现在,使用 DAB 和 SWA 命令行接口创建新的 DAB 配置文件并将其添加到 Web 应用程序存储库。

  1. 在所选集成开发人员环境(IDE)中打开 Web 应用程序的 GitHub 存储库。

    提示

    可以使用所需的任何 IDE。 如果要在本地处理应用程序,可以将存储库克隆到本地计算机。 如果想要在浏览器中工作,可以使用 GitHub Codespaces。 确保在开发环境中安装 SWA 和 DAB CLIs。

  2. 在存储库的根目录中打开终端。

  3. 使用 SWA CLI 中的 swa db 命令,使用指定的数据库类型初始化新的 DAB 配置文件。 该命令将在 swa-db-connections 文件夹中创建名为 staticwebapp.database.config.json 的新文件。

    swa db init --database-type "<database-type>"
    

    重要

    某些数据库类型需要初始化时的其他配置设置。

  4. 使用 dab add 命令将至少一个数据库实体添加到配置中。 配置每个实体以允许匿名用户的所有权限。 对实体重复 dab add 次数。

    dab add "<entity-name>" --source "<schema>.<table>" --permissions "anonymous:*" --config "swa-db-connections/staticwebapp.database.config.json"
    
  5. 打开并查看 swa-db-connections/staticwebapp.database.config.json 文件的内容。

  6. 将更改提交到存储库,并将其推送到主分支。 这会自动触发 Web 应用程序的新部署。 请等待此最新部署完成,然后继续学习本指南。

配置数据库连接

接下来,在 Azure 门户中配置数据库连接,以允许静态 Web 应用访问数据库。

  1. 在 Azure 门户中再次导航到静态 Web 应用。

  2. 在资源菜单的 设置 部分中,选择“数据库连接” 选项。 然后,为 生产 环境选择 链接现有数据库

    Azure 门户的 Azure 静态 Web 应用页中“数据库连接”选项的屏幕截图。

  3. 链接数据库 对话框中,使用这些设置配置数据库连接。

    设置 价值
    数据库类型 选择创建 DAB 配置文件时使用的相同数据库类型
    资源组 选择本指南前面创建的资源组
    资源名称 选择要链接到静态 Web 应用的数据库资源
    数据库名称 输入数据库的名称
    身份验证类型 选择要使用的身份验证类型

    Azure 门户的 Azure 静态 Web 应用页中数据库连接的“链接数据库”对话框的屏幕截图。

    提示

    建议使用不包含授权密钥的连接字符串。 请改用托管标识和基于角色的访问控制来管理数据库和主机之间的访问。 有关详细信息,请参阅 使用托管标识的 Azure 服务

测试数据 API 终结点

最后,验证静态 Web 应用上是否提供数据 API 终结点。

  1. 在 Azure 门户中再次导航到静态 Web 应用。

  2. 使用 Essentials 部分中的 URL 字段再次浏览到静态 Web 应用的网站。

  3. 导航到当前正在运行的应用程序的 /data-api 路径。 请注意,响应仍指示 DAB 容器 正常

    { Healthy }
    
  4. 导航到当前正在运行的应用程序的 https://<your-static-web-app-url>/data-api/<your-rest-path>/<your-entity-name> 路径。 这 针对该组实体发出 HTTP GET 请求。 观察 JSON 响应。

清理资源

不再需要示例应用程序或资源时,请删除相应的部署和所有资源。

  1. 使用 Azure 门户导航到 资源组

  2. 命令栏中,选择 删除