andornaut/filter-bubble
GitHub: andornaut/filter-bubble
一款浏览器扩展，允许用户通过CSS选择器自定义隐藏网页中不想看到的主题内容。
Stars: 10 | Forks: 1
# 过滤气泡
过滤气泡是一款浏览器插件/扩展，适用于
[Chrome](https://chromewebstore.google.com/detail/cdfnpgngpkmlogkkeaafpdahppapgnoo) 和
[Firefox](https://addons.mozilla.org/en-CA/firefox/addon/filter-bubble/)，
可让您隐藏网络上不想看到的内容。
- [为Chrome安装过滤气泡](https://chromewebstore.google.com/detail/cdfnpgngpkmlogkkeaafpdahppapgnoo)
- [为Firefox安装过滤气泡](https://addons.mozilla.org/en-CA/firefox/addon/filter-bubble/)
## 工作原理
1. 创建一个您想要从特定网站隐藏或移除的“主题”列表。
2. 通过指定针对可能包含任何目标主题的内容块或信息流项目的
[HTML元素](https://developer.mozilla.org/en-US/docs/Web/HTML/Element) 的
[CSS选择器](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_selectors)，
为这些网站配置规则。
3. 如果在目标网站的目标HTML元素中出现目标主题，则该内容将被隐藏或移除，从视图中消失。
请注意：开箱即用的预配置网站只有少数几个，您需要了解如何使用
[CSS选择器](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_selectors) 来定位
[HTML元素](https://developer.mozilla.org/en-US/docs/Web/HTML/Element)，才能配置其他网站！
## 开发
### 快速入门
1. 安装 [node](https://nodejs.org/en/) （推荐版本请参见 [`.nvmrc`](.nvmrc)）。
2. `npm install`
3. `npm start`
### Android端开发
请遵循 [扩展开发工作坊指南](https://extensionworkshop.com/documentation/develop/developing-extensions-for-firefox-for-android/)：
- [启用安卓“开发者选项”](https://developer.android.com/studio/debug/dev-options)
- 在安卓版Firefox中启用[通过USB远程调试](https://developer.mozilla.org/en-US/docs/Tools/about:debugging)
- 通过USB将设备连接到电脑
- 安装 [安卓平台工具](https://developer.android.com/studio/releases/platform-tools.html)
- 从安卓版Firefox -> 设置 -> 开发者工具中启用“通过USB远程调试”
- 创建包含以下内容的 `/etc/udev/rules.d/50-android-usb.rules` 文件：
SUBSYSTEM=="usb", ATTR{idVendor}=="18d1", MODE="0666", GROUP="plugdev"
将 `idVendor` 的值替换为 `dmesg` 命令输出的对应值，例如：
New USB device found, idVendor=18d1, idProduct=4ee7, bcdDevice= 5.15
```
sudo apt install adb android-sdk-platform-tools-common
# 如果之前手动安装过，您可能需要重启 adb 服务器。
sudo adb kill-server
sudo adb start-server
adb devices
```
您的设备现在会提示您授权此电脑。授权后，请继续按照 [web-ext 说明](https://extensionworkshop.com/documentation/develop/getting-started-with-web-ext/#testing-in-firefox-for-android) 操作：
```
device="$(adb devices 2>&1| awk '/./{device=$1} END{print device}')"
echo Device \"${device}\"
npx web-ext run --target=firefox-android --android-device=${device}
# 如果您安装了多个 Firefox 版本，则可以使用 `--firefox-apk` 标志进行区分。
npx web-ext run \
--target=firefox-android \
--android-device=${device} \
--firefox-apk=org.mozilla.firefox
```
或者，您可以运行：`npm run start:android`
### 发布
标记为发布版本（`v*`）会通过
[GitHub Actions](.github/workflows/ci.yml) 自动生成打包好的扩展。要创建一个发布版本：
1. 同时更新 `package.json` 和 `manifest.json` 中的版本号。
2. 提交版本号更新。
3. 打标签并推送：
```
git tag v0.x.x
git push && git push --tags
```
要在本地构建一个包：
```
npm run package
ls web-ext-artifacts/
```
商店仪表板：
- [Chrome 商店](https://chromewebstore.google.com/devconsole/)
- [Firefox 商店](https://addons.mozilla.org/en-US/developers/addons)
标签：Chrome插件, CMS安全, CSS选择器, Firefox插件, GNU通用公共许可证, HTML元素, JavaScript, MITM代理, Node.js, Redis利用, SEO工具, 主题过滤, 内容隐藏, 多模态安全, 广告屏蔽, 数据可视化, 浏览器扩展, 用户控制, 网络安全, 网络工具, 网页内容管理, 自定义脚本, 隐私保护