您是否厭倦了網站上流行的橫幅,以便您接受第三方 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。
好的,但是如果我刷新頁面怎麼辦?好吧,重新開始... 所以這非常適合新的瀏覽器擴充功能來為我做這件事。
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": "remove-cookiewall@aguilera.soy" } } }
如你所見,content_scripts表示我們要將js注入到所有頁面中。其他擴充只能指示一個站點,其他擴充功能在背景執行 javascript,...
要在 Firefox 中發布,我們只需提供包含擴充功能所需的所有檔案的 zip 即可。為了簡單起見,我創建了一個 build.sh 來簡單地運行 zip:
zip -r -FS ../remove-cookiewall.zip * --排除 '.git' --排除 'build.sh'
在 Firefox 中發布擴充功能沒有任何複雜性,而且是免費的。您的擴充功能唯一必須通過可能需要一天(或幾天)天的初步審核
以上是RemoveCookieWall,Firefox 擴充的詳細內容。更多資訊請關注PHP中文網其他相關文章!