Cloudflare Access 集成

Cloudflare Access 允许您通过应用已配置的身份感知访问策略来限制谁可以访问您的应用程序，从而保护您的 Web 应用程序。Cloudflare Access 是 Cloudflare 的零信任 产品的一部分。

NuxtHub 在 NuxtHub 管理员、模块和 CLI 中完全支持 Cloudflare Access。

设置 Cloudflare Access

这些步骤涵盖了为已部署的 NuxtHub 项目设置 Cloudflare Access。

1. 在 Cloudflare 零信任仪表盘 中创建一个 Cloudflare Access 服务令牌
   1. 在 零信任 中，转到访问 → 服务身份验证 → 服务令牌
   2. 选择创建服务令牌
   3. 为服务令牌命名。例如，NuxtHub 项目的名称
      • 此名称可让您轻松地在日志中识别与该令牌相关的事件
   4. 选择服务令牌期限。这将设置令牌的过期日期
   5. 选择生成令牌。您将看到为服务令牌生成的客户端 ID 和客户端密钥
      这是 Cloudflare Access 唯一显示客户端密钥的时刻。如果您丢失了客户端密钥，您将需要轮换服务令牌
2. 在 NuxtHub 管理员 中配置 Cloudflare Access 集成
   1. 在 NuxtHub 管理员 中，转到项目 → 设置 → 常规 → Cloudflare Access
   2. 提供在上一步中生成的客户端 ID 和客户端密钥
3. 在 Pages 项目上启用 Cloudflare Access
   1. 在 Cloudflare 仪表盘 → Workers & Pages → 您的 Pages 项目中
   2. 转到设置 → 常规 → 访问策略
   3. 选择启用以创建 Cloudflare Access 应用程序。
      默认策略涵盖 pages.dev 子域上的预览环境，添加一个允许策略，其中包含帐户的所有成员，并使用电子邮件一次性密码 IdP。
4. 添加一个访问策略以允许服务令牌
   1. 在 零信任 中，转到访问 → 应用程序，并选择该应用程序
   2. 创建一个名为“NuxtHub”的新策略，其操作为服务身份验证
   3. 启用 401 响应布尔值
   4. 在配置规则中，将选择器设置为服务令牌，并将值设置为之前创建的服务令牌
   5. 保存策略
5. 可以选择编辑您的允许访问策略
   在 Cloudflare 的文档中了解有关 Cloudflare Access 策略的更多信息。
6. 可以选择将其他域添加到您的访问应用程序
   1. 在 零信任 中，转到访问 → 应用程序，并选择该应用程序
   2. 从标题中选择概述
   3. 添加其他应用程序域，例如生产域或分配给项目的任何自定义域

导入 Pages 项目

我们计划在未来直接支持导入已使用启用的 Cloudflare Access 保护的现有 Pages 项目。

目前，您需要暂时创建一个访问应用程序，该应用程序为项目默认 pages.dev 域和路径 /api/_hub/manifest 上的每个人设置一个绕过策略。

服务令牌过期和轮换

服务令牌过期

当服务令牌过期时，可以从 Cloudflare 仪表盘中对其进行轮换。

1. 在 零信任 中，转到访问 → 服务身份验证 → 服务令牌
2. 在过期的令牌上点击 ...
3. 选择轮换

服务令牌轮换

如果服务令牌被轮换，则需要在 NuxtHub 管理员 中提供新的客户端密钥。

1. 在 NuxtHub 管理员 中，转到项目 → 设置 → 常规 → Cloudflare Access
2. 点击禁用集成
3. 提供在上一步中生成的客户端 ID 和客户端密钥
4. 点击启用集成

远程存储

这些步骤将涵盖使用受 Cloudflare Access 保护的环境的 远程存储。

1. 打开 .env
2. 使用您的服务令牌的客户端 ID 和客户端密钥设置以下变量
   • NUXT_HUB_CLOUDFLARE_ACCESS_CLIENT_ID
   • NUXT_HUB_CLOUDFLARE_ACCESS_CLIENT_SECRET

CLI

以下环境变量可以传递给 CLI

• NUXT_HUB_CLOUDFLARE_ACCESS_CLIENT_ID
• NUXT_HUB_CLOUDFLARE_ACCESS_CLIENT_SECRET

export NUXT_HUB_CLOUDFLARE_ACCESS_CLIENT_ID=""
export NUXT_HUB_CLOUDFLARE_ACCESS_CLIENT_SECRET=""
npx nuxthub database migrations list --preview

nuxt.dev 子域与 Cloudflare Access

由于 Cloudflare 的技术限制，当您将 Cloudflare Access 与 NuxtHub 结合使用时，nuxt.dev 子域不可用。

如果 nuxt.dev 子域是主域，启用 Cloudflare Access 集成将为主域设置为 pages.dev 子域。