使用 Cloudflare Zero Trust 和 GitHub 组织保护网站后台登录

使用 Cloudflare Zero Trust 和 GitHub 组织保护网站后台登录

所谓诚其意者 毋自欺也

在部署了诸如 Telegraph-Image 图床 这样的自托管应用后,保护其后台管理界面的安全至关重要。直接暴露登录页面可能会面临暴力破解等风险。Cloudflare Zero Trust 提供了一个强大的 Access 功能,允许我们基于多种身份验证方式来保护特定的 URL 路径。

本文将详细介绍如何结合 Cloudflare Access 和 GitHub Organization(组织)成员身份验证,为你的网站后台(以 Telegraph-Image 为例)添加一层安全、便捷的登录保护。用户需要通过 GitHub 登录,并且是指定 GitHub 组织的成员,才能访问受保护的后台页面。

前提条件

  • 你拥有一个 Cloudflare 账户,并且你的网站域名已接入 Cloudflare 并开启代理(橙色云朵)。
  • 你拥有一个 GitHub 账户。
  • 你的自托管应用程序(如 Telegraph-Image)已部署,并通过 Cloudflare 代理的域名可以访问。
  • 你能够访问 Cloudflare Zero Trust 仪表板。

配置步骤

步骤 1:获取 Cloudflare 团队域 (Team Domain)

在配置 GitHub OAuth App 时,需要用到 Cloudflare 的认证回调 URL,这个 URL 基于你的 Cloudflare 团队域。

  1. 登录 Cloudflare 仪表板。
  2. 导航到左侧菜单的 Zero Trust
  3. 进入 Settings -> Custom Pages
  4. Authentication 部分,找到并 复制 你的 Authentication domain(例如 your-team-name.cloudflareaccess.com)。记下这个域名,后续步骤会用到。

步骤 2:创建 GitHub Organization (可选但推荐)

使用 GitHub Organization 可以方便地通过管理组织成员来控制访问权限。如果你只是为自己或少数几个人设置访问,也可以考虑直接使用 GitHub 个人账户认证(配置会略有不同),但本教程重点介绍组织认证方式。

  1. 登录 GitHub。
  2. 访问用户 Settings -> Organizations
  3. 点击 New organization 创建一个新的组织(可以选择免费计划)。
  4. **记下你创建的 Organization 的名称 (Login/Slug)**,后续配置 Cloudflare Access 策略时需要用到。

步骤 3:创建 GitHub OAuth App

为了让 Cloudflare 能够代表你的用户向 GitHub 请求身份验证,你需要在 GitHub 中注册一个 OAuth Application。

  1. 访问 GitHub Settings -> Developer settings -> OAuth Apps
  2. 点击 New OAuth App
  3. 填写应用程序信息:
    • Application name: 任意名称,例如 Cloudflare Access for MySite
    • Homepage URL: 填入你在 步骤 1 中获取的 Cloudflare 团队域,格式为 https://<your-team-domain>.cloudflareaccess.com
    • Authorization callback URL: 填入 Homepage URL 后面加上 /cdn-cgi/access/callback。最终格式为 https://<your-team-domain>.cloudflareaccess.com/cdn-cgi/access/callback
  4. 点击 Register application
  5. 注册成功后,页面会显示 Client ID。点击 Generate a new client secret 生成一个 Client Secret
  6. 务必记下并妥善保管 Client ID 和 Client Secret,马上要在 Cloudflare 中使用。

步骤 4:在 Cloudflare 中添加 GitHub 登录方式

现在,将刚刚创建的 GitHub OAuth App 信息添加到 Cloudflare Access 的登录方式中。

  1. 回到 Cloudflare Zero Trust 仪表板。
  2. 导航到 Settings -> Authentication
  3. Login Methods 部分,点击 Add new
  4. 选择 GitHub 作为登录方式。
  5. 关键:不要直接点击开启默认的 GitHub 集成,而是要填入你刚刚在 步骤 3 中获取的 Client IDClient Secret。这表示你正在使用自定义的 OAuth App,以便后续与特定的 GitHub Organization 关联。
  6. 点击 Save

步骤 5:授权 GitHub OAuth App (针对 Organization)

保存 Cloudflare 配置后,或者在首次尝试使用此登录方式时,GitHub 会请求授权。为了让 Cloudflare 能够检查用户是否属于你在 步骤 2 创建的组织,你需要明确授予权限。

  1. 在 GitHub 的授权页面上,找到你的 OAuth App 请求的权限。
  2. 特别注意 Organization access 部分,找到你在 步骤 2 中创建的组织,点击 Grant 按钮。
  3. 确认授权,点击 Authorize <your-github-username-or-org>

步骤 6:创建 Cloudflare Access 应用 (Self-Hosted Application)

这是将所有配置整合起来,实际保护你的网站后台路径的核心步骤。

  1. 在 Cloudflare Zero Trust 仪表板中,导航到 Access -> Applications
  2. 点击 Add an application 并选择 Self-hosted 类型。
  3. 配置 Application:
    • Application Name: 给这个受保护的应用起个名字,例如 Telegraph Admin Access
    • Session Duration: 设置用户登录一次后会话保持有效的时间(例如 24 hours)。
    • Application Domain: 从下拉列表中选择你的网站域名(例如 your-telegraph-domain.com)。
    • Path: 输入你需要保护的 具体 URL 路径。例如,如果后台地址是 https://your-telegraph-domain.com/admin/login,你可能需要保护 /admin/** 是通配符,表示 /admin/ 下的所有路径)。根据你的应用实际后台路径填写。
    • Identity providers: 确保 GitHub (你在 步骤 4 中配置的那个) 被选中。取消勾选其他不需要的登录方式(如 One-time PIN)。
  4. 配置 Policy (访问策略):
    • 点击 Next 进入策略配置页面。
    • Policy Name: 给策略起个名字,例如 Allow GitHub Org Members
    • Action: 设置为 Allow,表示满足条件的用户将被允许访问。
    • Configure Rules (配置规则): 这是决定 可以访问的关键。
      • 点击 Add a rule
      • Selector: 从下拉菜单中选择 GitHub organization
      • Value: 输入你在 步骤 2 中创建并记下的 GitHub Organization 名称
      • 你可以根据需要添加更多规则:
        • 使用 Require 连接符:用户必须 同时满足 所有 Require 规则。
        • 使用 Include 连接符:用户满足 任意一个 Include 规则即可(通常与 Require 结合使用)。
        • 使用 Exclude 连接符:满足此规则的用户 将被拒绝 访问,即使他们满足了 Allow 规则。
  5. 保存设置: 点击 Next 然后 Add application 完成创建。

步骤 7:验证登录

现在,你的网站后台路径应该已经被 Cloudflare Access 保护起来了。

  1. 打开一个新的浏览器窗口或使用隐身模式。
  2. 尝试访问你配置的受保护的后台 URL 路径(例如 https://your-telegraph-domain.com/admin/)。
  3. 你应该会被重定向到 Cloudflare Access 的登录页面,并提示使用 GitHub 登录。
  4. 点击使用 GitHub 登录,完成 GitHub 的身份验证。
  5. 如果你的 GitHub 账户是 步骤 2 中指定的那个组织的成员,Cloudflare Access 会验证通过,并将你重定向回你最初尝试访问的后台页面。如果不是该组织的成员,访问将被拒绝。

总结

通过以上步骤,我们成功地利用 Cloudflare Zero Trust Access 和 GitHub Organization 认证,为自托管的 Telegraph-Image 图床(或其他任何网站)的后台管理页面建立了一道坚固的安全屏障。这种方式不仅显著提高了安全性,防止了未授权访问,同时也利用熟悉的 GitHub 登录,为授权用户提供了便捷的访问体验。

  • Title: 使用 Cloudflare Zero Trust 和 GitHub 组织保护网站后台登录
  • Author:
  • Created at : 2024-02-01 09:49:00
  • Updated at : 2025-04-29 19:23:57
  • Link: https://xblog.aptzone.cc/2024/02/01/Cloudflare-Zero-Trust-保护网站后台登录/
  • License: All Rights Reserved © 凡
Comments