# 外部链接防护 - 退出确认与信任门控

**URL:** https://meta.discourse.org/t/external-link-shield-exit-confirmation-trust-gating/392962
**Category:** Theme component
**Created:** [2026年一月8日 11:21 UTC](https://meta.discourse.org/t/external-link-shield-exit-confirmation-trust-gating/392962 "2026-01-08T11:21:10Z")
**Posts on this page:** 1
**Showing post:** 1

<div class="post-metadata">

### Author: ![Don](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/don/32/228726_2.png) [@Don](https://meta.discourse.org/u/Don)
#### Post date: [2026年一月8日 11:21 UTC](https://meta.discourse.org/t/external-link-shield-exit-confirmation-trust-gating/392962/1 "2026-01-08T11:21:10Z")

</div>

| | | |
| --- | --- | --- |
| ℹ | **摘要** | 此主题组件为已渲染帖子中的外部链接添加了可配置的保护机制。它应用基于信任级别的规则、可选的登录和信息重定向、受信任域的视觉指示器以及可自定义的退出确认模态框。 |
| 👓 | **预览** | [Theme Creator](https://discourse.theme-creator.io/theme/Don/external-link-shield) |
| 🛠 | **代码仓库** | \u003chttps://github.com/VaperinaDEV/external-link-shield\u003e |
| ❓ | **安装指南** | [如何安装主题或主题组件](https://meta.discourse.org/t/how-do-i-install-a-theme-or-theme-component/63682) |
| 📖 | **Discourse 主题新手？** | [Discourse 主题使用入门指南](https://meta.discourse.org/t/beginners-guide-to-using-discourse-themes/91966) |

安装此主题组件

您好 👋

我想分享一个 **主题组件** ，它为已渲染帖子中的 **外部链接** 提供了 **细粒度的控制** ，结合了：

- 基于信任级别的访问控制
- 匿名用户保护
- 自定义 **退出确认模态框**
- 受信任与未知域的视觉指示器

该组件专为那些 **外部链接可能涉及法律、安全或信任影响** 的社区设计。

* * *

## ✨ 特性

### ⚙ 可配置的信任级别规则

所有基于信任级别的行为都 **可通过主题设置完全配置** 。

您可以独立启用或禁用：

- 匿名用户屏蔽
- TL0 信息替换
- TL1 手动显示要求
- 针对更高信任级别的退出确认模态框

这使得该组件能够适应截然不同的社区策略，从严格的链接屏蔽到最小的用户摩擦。

### 🔐 信任级别感知的外部链接

外部链接的行为根据查看者的信任级别而有所不同：

- **匿名用户**
  - 外部链接将被替换为登录链接或设置中定义的自定义 URL。

- **TL0**
  - 链接将被替换为可配置的重定向，例如解释信任级别的帖子或设置中定义的任何其他 URL。

- **TL1**
  - 链接需要 **手动显示** （点击查看），然后点击链接会显示退出确认模态框。

- **TL2+**
  - 链接表现正常，但 **始终显示退出确认模态框** 。

* * *

### 🚪 退出确认模态框

在离开论坛之前，用户会看到一个模态框，该模态框：

- 明确告知他们正在离开社区
- 在 `\u003ccode\u003e` 标签中显示完整的目标 URL
- 尊重用户的 `external_links_in_new_tab` 偏好设置

这对于以下情况特别有用：

- 合规性要求高的社区
- 网络钓鱼缓解
- 教育经验不足的用户

 ![Screenshot 2026-01-08 at 11.14.05](https://global.discourse-cdn.com/meta/original/4X/a/2/3/a239487d34e6d42c555b320a2410a276f2eea539.png)

* * *

### 🔍 基于域的行为（通过设置）

该组件引入了两个主题设置：

```plaintext
internal_domains:
  type: list
  default: ""
  description: "您的论坛和 CDN 域名（例如 example.com|example-cdn.com）。这些将没有图标和模态框。"

excluded_domains:
  type: list
  default: ""
  description: "受信任的外部域名（例如 youtube.com|google.com）。这些将显示一个 LOCK 图标，但会跳过模态框/屏蔽。"

```

- **内部域名**
  - 被视为内部域名 → 没有图标，没有模态框

- **排除（受信任）域名**
  - 显示 🔒 锁形图标
  - 跳过信任级别限制和模态框

- **所有其他外部链接**
  - 显示一个外部链接图标
  - 根据信任级别进行限制和/或确认

* * *

## 🎨 视觉指示器 (SCSS)

图标纯粹通过 CSS 添加：

- **外部未知链接** → external-link 图标
- **受信任的外部链接** → 锁形图标（成功颜色）

这使 DOM 保持整洁，并避免了基于 JS 的图标注入。

 ![Screenshot 2026-01-08 at 11.09.09](https://global.discourse-cdn.com/meta/original/4X/d/6/4/d64f6bd7bffbff4b553ba9626c87a6594a995cba.png)

此截图显示了该组件如何区分：

- **排除的域名** ：受信任的外部链接（锁形图标，无退出确认），
- **内部域名** ：内部链接（无图标，无退出确认），
- _未知_外部链接（带有退出确认的 external-link 图标）。

* * *

## 📌 用例

如果您想实现以下目标，此组件非常有用：

- 保护用户免受不安全或误导性的外部链接的侵害
- 在允许新用户离开论坛之前对其进行教育
- 强制执行社区信任进阶
- 在不破坏用户体验 (UX) 的情况下添加法律/合规性免责声明

---

_[View the full topic](https://meta.discourse.org/t/external-link-shield-exit-confirmation-trust-gating/392962)._
