[ADBlock/广告屏蔽提示]希望增加一个广告检测功能和提示结果组件

kwooshung commented 1 year ago

这个功能解决了什么问题

广告如果被浏览器插件 “诸如此类广告屏蔽插件” 屏蔽了，提醒组件；它可以显示在模态框，抽屉等组件中，这个就看开发者喜欢了。

这个提示呢，我认为应该左侧有插件列表，右侧是gif或视频，告诉用户如何关闭，默认可以是一张普通的操作流程jpg图，每个插件都有对应的图或视频；

你建议的方案是什么

api很简单，就是配置对应插件的媒体资源，假设组件叫做AdPlugin，

import adGuardImage from 'xxxx.jpg'

<AdPlugin open={这个是控制显示的} config={{
    adblockplus:{
        title:'AdBlock，这里可自定义名称是右侧内容的标题，否则使用默认的名称，具体可以看下方图片'
        media:'xxx/xxx.jpg'
    },
    adguard:{
        media:adGuardImage.src
    }
}}

其实API差不多就是：

open/visable: 可控模式显示，如果不设置，则内部自动检测是否被屏蔽了，如果可以的话，最好显示后，自动定位展开对应的tab。 wrap:'modal' | ‘drawer’ | null，分别表示是模态框、抽屉、null不传则表示外层什么也不包裹，开发者自己自由设置位置。 simple:boolean，默认false，简化模式，就是检测到是什么插件屏蔽的，就自动展示对应的提示就好了。 default/children:html|react node，这个就是如果上述的屏蔽插件没有检测到，默认显示的内容。

以下是ChatGpt提供的浏览器广告屏蔽插件，不一定准确，因为我以前用过的就是前几个：

Adblock Plus：非常受欢迎的广告拦截器，支持多种浏览器。 uBlock Origin：轻量级的广告拦截工具，支持Firefox、Chrome、Edge等。 AdGuard AdBlocker：为多种浏览器提供的广告拦截扩展。 Ghostery：提供广告拦截和阻止网站跟踪功能。 Poper Blocker：专门针对弹出和悬浮广告的拦截器。 AdBlock：另一个流行的广告拦截插件。 Nano Adblocker：基于uBlock Origin的广告拦截器，有一些额外功能。 Fair AdBlocker：提供广告拦截及一些额外功能。 AdNauseam：同时拦截广告并模拟点击，混淆广告跟踪器。 Privacy Badger：由电子前沿基金会（EFF）开发，专注于阻止隐私侵犯的广告和跟踪器。 Disconnect：提供广告拦截和阻止跟踪功能。 uMatrix：为高级用户提供的广告拦截和内容过滤工具。 NoScript (for Firefox)：除广告拦截外，还可以限制页面上的JavaScript执行。 DuckDuckGo Privacy Essentials：著名的隐私搜索引擎DuckDuckGo开发的广告拦截和跟踪保护扩展。 Wipr (for Safari)：主要为Safari设计的广告拦截扩展。 AdBlocker Ultimate：拦截所有广告，没有“白名单”广告。 RedMorph Browser Controller：广告拦截和隐私保护工具。 1Blocker (for Safari)：专为Safari设计的广告拦截插件。 ClearURLs：除了拦截广告，还可以清除URL中的追踪参数。 Brave Browser：虽然是一个完整的浏览器，但其内置的广告拦截功能非常受欢迎。 StopAd for Web：简单易用的广告拦截工具。 EasyList & EasyPrivacy：这些是广告拦截插件使用的主要过滤列表，但某些用户也直接添加这些列表来自定义广告拦截效果。 AdBlock for YouTube：专为YouTube设计的广告拦截插件。 Pop Up Blocker Pro：专门针对弹窗广告。

此问题，我已在同类产品：AntDesign，ArcoDesign 的 issues 中提交： https://github.com/ant-design/ant-design/issues/45426 https://github.com/arco-design/arco-design/issues/2298

github-actions[bot] commented 1 year ago

👋 @kwooshung，感谢给 TDesign 提出了 issue。请根据 issue 模版确保背景信息的完善，我们将调查并尽快回复你。

uyarn commented 1 year ago

不考虑

Tencent / tdesign-react