uBlock Origin过滤规则对RoyalRoad推广系统的技术分析

背景概述

RoyalRoad作为网络小说平台，其推广系统采用了独特的运营模式。平台允许作者购买推广位展示自己的作品，这种内部推广机制与传统的第三方推广网络存在本质差异。近期uBlock Origin对该平台的推广过滤策略引发了技术社区的讨论，本文将深入分析其中的技术细节。

推广系统技术架构

RoyalRoad的推广系统具有以下技术特征：

1. 采用响应式设计，根据视口宽度展示1-2个推广位
2. 推广容器使用动态生成的CSS类名（如dKKumhSnWiFq75vPUVtmTanQ）
3. 推广链接分为两类：
   • 内部推广：指向平台内作品页面的链接
   • 外部推广：通过重定向服务（如geni.us）跳转的第三方链接

过滤策略演变

uBlock Origin团队基于EasyList政策制定了以下过滤方案：

初始方案

采用通用型过滤规则，全面屏蔽推广容器元素。这种方法虽然有效，但存在以下问题：

• 同时屏蔽了内部推广内容
• 影响评论区功能加载
• 在移动端布局出现空白区域

优化方案

经过技术评估后，开发团队实现了更精细的过滤逻辑：

royalroad.com##.dKKumhSnWiFq75vPUVtmTanQ:has(a[href^="https://www.royalroad.com/a/r?promo="]:not([href*="&url=https%3A%2F%2Fwww.royalroad.com"]))

该规则的技术特点：

1. 使用CSS属性选择器精准定位推广容器
2. 通过:has伪类实现条件过滤
3. 仅屏蔽包含外部推广链接的推广单元
4. 保留纯内部推广内容

技术挑战与解决方案

动态类名处理

平台采用随机生成的CSS类名增加过滤难度。解决方案：

• 通过DOM结构特征进行定位
• 结合子元素属性作为锚点

混合推广场景

当同一容器同时包含内外推广时，处理策略：

1. 优先保证功能完整性
2. 在技术可行范围内实现最大程度的隐私保护
3. 通过视口检测优化移动端体验

用户自定义方案

技术用户可扩展以下过滤逻辑：

// 仅屏蔽外部推广但保留推广位框架
royalroad.com##div:has(>a[href^='https://www.royalroad.com/a/r?promo=']):has(>a:not([href*='https%3A%2F%2Fwww.royalroad.com%2Ffiction']))

// 完全禁用推广过滤（需谨慎）
@@||www.royalroad.com^$document

技术建议

1. 平台方可考虑将内外推广分离展示
2. 避免在内部推广中使用第三方跟踪服务
3. 用户可根据实际需求调整过滤强度
4. 开发者将持续监控过滤效果并优化规则

该案例展示了推广过滤技术在特定场景下的平衡艺术，需要在用户体验、内容生态和技术可行性之间找到最佳实践方案。