您是否厌倦了网站上流行的要求您接受第三方 cookie 或结帐的横幅？在这篇文章中，我解释了如何制作（并发布）一个 Firefox 扩展以避免大多数网站出现这种情况

信息

此扩展的代码发布在 https://github.com/jagedn/removecookiewall-addon 您可以从 https://addons.mozilla.org/es/firefox/addon/removecookiewall/

在 Firefox 中（也可以在移动设备上）安装它

几个月来，由于欧洲的要求（我认为），大多数网站在您第一次访问它们时都会向您显示一个横幅，该横幅不允许您继续，直到您在以下两者之间做出决定：

• 我将在您的浏览器中放置数千个第三方 cookie，以监视您浏览的内容

• 去结账处付钱让我不要这样做

大多数这些库会在页面加载后立即执行 javascript 来读取您的 cookie。如果他们发现您尚未签出，他们会向您显示一个 HTML 对话框，并通过将样式更改为“阻止”（或类似）来阻止正文

这个对话框不允许您阅读下面的内容，但是...​它仍然是 HTML 的 DOM 元素，因此，由于浏览器允许您打开开发控制台并检查 HTML，所以我想到了​​手动删除对话框（您只需单击“检查”，查看定义它的 HTML，然后单击“删除”）和 chimpón，对话框就会消失。然后，我查找“body”声明，并通过双击样式属性，删除阻止它的属性，现在可以滚动。

小魔法。

然后发生了什么？好吧，javascript 代码只是一直等待用户事件到达，告诉它您按下了哪个按钮，但这些按钮不再存在，因此它永远不会到达，也不会安装第三方 cookie。

好的，但是如果我刷新页面怎么办？好吧，重新开始...​所以这非常适合新的浏览器扩展为我做这件事。

删除 CookieWall 扩展

Firefox 扩展，简而言之，是一个保留的浏览器内存空间，其中执行可以与之对话的 javascript 代码。

它可以（如果用户授予权限）将代码注入您访问的页面、打开选项卡、关闭选项卡、与远程服务通信……​

RemoveCookieWall 是一个 Firefox 扩展，它“唯一”需要的是浏览器向用户访问的所有页面注入一个小的 JavaScript 代码。

当页面加载时，这个 javascript 将检查是否有一个 DOM 元素与我调查过的他们正在使用的任何元素相匹配。如果检测到它，它将使用标准 Javascript 函数将其删除。

由于横幅有时会在我们的代码执行后（毫秒）秒出现，因此脚本所做的就是重复搜索几秒钟。此后，如果横幅尚未出现，则扩展程序假定该页面没有 CookieeWall 并结束

这就是全部。剩下的就是打包代码，添加一个清单文件来指示我们的扩展所需的权限，并将其发布在 Firefox 中

代码

JS代码基本上是：

var readyStateCheckInterval;
var counter = 0;

function sanitizeBody() {
    document.body.style.overflow = "unset"
    document.body.classList.remove('sxnlzit')
    document.body.classList.remove('didomi-popup-open')
    document.body.parentNode.classList.remove('sp-message-open')
}

function removeMe(element) {
    element.remove();
    sanitizeBody();
}

readyStateCheckInterval = setInterval(function() {
    if (document.readyState === "complete") {
        counter  ;
        const removeParent = ['div.pmConsentWall']; //elpais
        [...removeParent].forEach(s => {
            var divs = document.body.querySelectorAll(s);
            [...divs].forEach(element => {
                removeMe(element.parentNode);
            });
        });
        const removeThis = [
            'div[data-nosnippet="data-nosnippet"]',
            '#mrf-popup',
            '#didomi-popup',
            '[id^="sp_message_container_"]',
            '#cl-consent',
            'dialog.cookie-policy'
        ];
        [...removeThis].forEach(s => {
            var divs = document.body.querySelectorAll(s);
            [...divs].forEach(element => {
                removeMe(element);
            });
        });
        if (counter > 30) {
            clearInterval(readyStateCheckInterval);
        }
    }
}, 100);

代码注入页面后，每隔 100 毫秒开始一个间隔

该脚本会查看 document.body.querySelectorAll 是否找到任何元素，例如 #mrf-popup、#didomi-popup 等。如果找到它，只需使用 element.remove()

经过几次尝试，最终删除了间隔

每个扩展都必须有一个 Manifest 文件。此扩展的内容很简单：

{

    "description": "Remove CookieWall",
    "manifest_version": 2,
    "name": "RemoveCookieWall",
    "version": "0.11",
    "homepage_url": "https://github.com/jagedn/removecookiewall-addon",
    "icons": {
        "48": "icons/border-48.png"
    },
    "content_scripts": [{
        "matches": [
            "*://*/*"
        ],
        "js": ["removeCookieWall.js"]
    }],
    "browser_specific_settings": {
        "gecko": {
            "id": "[email protected]"
        }
    }
}

如你所见，content_scripts表示我们要将js注入到所有页面中。其他扩展只能指示一个站点，其他扩展在后台执行 javascript，...

构建并发布

要在 Firefox 中发布，我们只需提供一个包含扩展所需的所有文件的 zip 文件。为了方便起见，我创建了一个 build.sh 来简单地运行 zip:

zip -r -FS ../remove-cookiewall.zip * --排除 '.git' --排除 'build.sh'

在 Firefox 中发布扩展程序没有任何复杂性，而且是免费的。您的扩展必须通过可能需要一天（或几天）天的初步审核