資訊專欄INFORMATION COLUMN
摘要：以下示例將阻止所有對的請求。從存儲請求和阻止請求的對象中刪除當(dāng)前選項(xiàng)卡的屬性。收聽消息告知后臺進(jìn)程阻止的列表已被用戶更新。兩者都提供類似的功能和事件處理程序。
前言
當(dāng)我們?yōu)g覽網(wǎng)站時(shí)，都會發(fā)送許多請求來獲取網(wǎng)頁內(nèi)容。這些請求中有些是重要的，而有些是我們不需要，因?yàn)樗鼈兛赡苁菑V告或建議等。在本文中，將創(chuàng)建一個(gè)有助于阻止和取消阻止所選URL的Chrome擴(kuò)展插件，讓你選擇你打開的網(wǎng)址及該打開的網(wǎng)頁中的所有URL，是否需要阻止。
我們注意到，對于某些網(wǎng)站，即使我安裝了AdBlock擴(kuò)展插件，我也還是能看到廣告。這些網(wǎng)站正在向廣告提供商發(fā)出多帶帶的請求，由于某些原因，AdBlock無法接受。解決這個(gè)問題的一個(gè)解決方案是將條目添加到host文件（在Windows上），我發(fā)現(xiàn)它很麻煩。所以，我閱讀了關(guān)于Chrome擴(kuò)展程序，并嘗試自己創(chuàng)建一個(gè)。
免責(zé)聲明
自編寫代碼以來，Chrome API可能已經(jīng)更改。有關(guān)最新信息，請參閱Google的文檔；
此擴(kuò)展程序在64位Windows 10和Chrome版本57.0.2987.133上通過測試；
此擴(kuò)展程序不適用于Google Play商店/網(wǎng)上商店；
相關(guān)代碼
您只需要在計(jì)算機(jī)上安裝一個(gè)文本編輯器和Chrome來查看/修改代碼。Chrome擴(kuò)展程序至少包含以下四個(gè)項(xiàng)目：
Manifest.json文件
HTML頁面
CSS文件
Javascript文件
Manifest文件
Manifest文件可以被認(rèn)為是擴(kuò)展名的定義。它是一個(gè)簡單的JSON文件，具有預(yù)定義的屬性，可以告訴瀏覽器有關(guān)擴(kuò)展名。除此之外，它還有助于設(shè)置擴(kuò)展名的名稱，版本控制，描述，權(quán)限，用戶界面以及與其關(guān)聯(lián)的JS文件。Manifest文件代碼如下：
Manifest文件代碼
在上面的JSON中，
manifest_version 為2，如Google文檔所示。
browser_action 告訴擴(kuò)展程序的圖標(biāo)和包含彈出窗口的HTML頁面。
permissions定義給予擴(kuò)展的一組權(quán)限。在這種情況下，我們分配權(quán)限才能訪問URL和選項(xiàng)卡。我們還需要擴(kuò)展才能跟蹤和阻止請求以及存儲訪問來保存阻止的URL。
background定義我們將運(yùn)行一些JavaScript作為后臺進(jìn)程。Chrome會處理擴(kuò)展系統(tǒng)，并會生成一個(gè)包含此腳本的頁面。在這種情況下，我們不需要任何特定的HTML。如果需要，也可以指定。
有關(guān)Manifest文件中個(gè)關(guān)鍵字的詳細(xì)信息，后面會有專門文章與大家分享，請大家關(guān)注后面的文章。
HTML頁面和CSS文件
此擴(kuò)展程序的HTML頁面相當(dāng)簡單。它只包含一個(gè)列表和幾個(gè)按鈕。彈出的完整HTML如下所示：
HTML代碼
CSS代碼
JavaScript代碼
由于JS代碼較多，這里就不截圖。如Manifest文件和HTML文件所示，這里有兩個(gè)JS文件： background.js和popup.js。正如名字所暗示的那樣，前者處理后臺任務(wù)，后者涉及擴(kuò)展彈出窗口的代碼。
background.js
后臺腳本允許我們維護(hù)狀態(tài)或編寫長時(shí)間運(yùn)行的進(jìn)程。在這種情況下，我們需要跟蹤他們正在訪問的所有標(biāo)簽和URL。因此，此腳本將需要變量來存儲這些詳細(xì)信息，還需要一些事件處理程序來跟蹤C(jī)hrome啟動時(shí)，打開或關(guān)閉選項(xiàng)卡以及何時(shí)發(fā)出請求。使用Chrome的API，我們可以按照以下格式將處理程序綁定到事件：
每個(gè)處理程序必須具有可從文檔中找到的特定定義（參數(shù)的數(shù)量和類型）。例如，如果我們在創(chuàng)建一個(gè)新的選項(xiàng)卡時(shí)觸發(fā)一些代碼，我們可以這樣綁定我們的處理程序（在大多數(shù)情況下，我使用了匿名函數(shù)，我們可以使用一個(gè)具有正確定義的命名函數(shù)）：
一些事件可以異步和同步處理，一些事件也可以返回?cái)?shù)據(jù)。例如，onBeforeRequest
可以同時(shí)處理異步方式。它還可以返回指定請求應(yīng)該做什么的數(shù)據(jù)。以下示例將阻止所有對UglySite的請求。它還指定一個(gè)過濾器，只提到對UglySite的請求，并且VeryUglySite應(yīng)該發(fā)送到擴(kuò)展插件。
該代碼，而如果我們改變上面將阻止在同步方式的要求blocking來asyncBlocking，我們可以做到這一點(diǎn)是異步的。在這種情況下，我們也可以指定一個(gè)回調(diào)函數(shù)。除了聽事件之外，我們還可以注冊回調(diào)來收聽從擴(kuò)展名發(fā)送的自定義消息。例如，當(dāng)用戶打開擴(kuò)展彈出窗口時(shí)，我們需要獲取當(dāng)前選項(xiàng)卡完成的所有請求。這可以這樣實(shí)現(xiàn)：
在上面的示例中，我們使用request.action屬性來收聽更多的消息。以下部分將顯示如何向此偵聽器發(fā)送消息。
在這個(gè)擴(kuò)展插件中，還需處理以下事件：
chrome.tabs.onCreated：將當(dāng)前選項(xiàng)卡的屬性添加到存儲請求和阻止的請求的對象中。
chrome.tabs.onRemoved：從存儲請求和阻止請求的對象中刪除當(dāng)前選項(xiàng)卡的屬性。
chrome.webRequest.onBeforeRequest：攔截所有的請求，并在需要的時(shí)候阻止它們。
chrome.runtime.onMessage：收聽要求當(dāng)前標(biāo)簽的請求的消息。這將使用動作requests。
chrome.runtime.onMessage：收聽消息告知后臺進(jìn)程阻止的URL列表已被用戶更新。這將使用動作resync。
為了保存或獲取數(shù)據(jù)，可以使用chrome.storage.local或chrome.storage.sync。兩者都提供類似的功能和事件處理程序。兩者之間的區(qū)別在于本地將僅存儲當(dāng)前計(jì)算機(jī)上的數(shù)據(jù)。同步將在當(dāng)前用戶登錄并啟用同步的所有瀏覽器之間同步數(shù)據(jù)。如果用戶沒有啟用它，同步也將作為本地使用。
對于這種情況，我們使用get和set函數(shù)來允許我們讀取和寫入數(shù)據(jù)到Chrome的存儲空間。請注意，該數(shù)據(jù)默認(rèn)情況下未加密，因此不得存儲敏感信息。以下片段顯示保存和從存儲中檢索數(shù)據(jù)。
popup.js
此文件包含擴(kuò)展彈出窗口所需的所有代碼。它執(zhí)行兩個(gè)主要任務(wù)：在加載時(shí)獲取標(biāo)簽的請求，并在點(diǎn)擊保存按鈕時(shí)將用戶選擇保存到存儲。要獲取該選項(xiàng)卡的請求，它會將request消息發(fā)送到后臺進(jìn)程。以下內(nèi)容用于發(fā)送消息：
在這里，為了獲取當(dāng)前標(biāo)簽的ID，使用了Chrome的API的以下功能：
：
將擴(kuò)展添加到Chrome
從上面的鏈接下載并提取代碼。
在Chrome上，轉(zhuǎn)到chrome://extensions頁面并選中Developer mode復(fù)選框。
點(diǎn)擊Load unpacked extension并選擇包含代碼下載的文件夾。
擴(kuò)展程序現(xiàn)在應(yīng)該在工具欄中可見。刷新頁面以查看請求。
本文由甲爪日付廣告聯(lián)盟www.jiazhua.com整理編輯！
文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址：http://systransis.cn/yun/91688.html
摘要：簡單高效的自定義方式對于這些情況我們可以使用一個(gè)強(qiáng)大的瀏覽器插件，簡稱，中文俗稱為油猴，支持和瀏覽器。簡單幾行代碼，就可以去除大部分頁面廣告。聲明需要使用的函數(shù)。 會CSS就會去廣告~ 傳統(tǒng)去廣告方法的弊端 我們?yōu)g覽網(wǎng)頁的時(shí)候經(jīng)常不免會看到各種不想看到的廣告內(nèi)容，最簡單的方案就是通過瀏覽器插件來解決，比如大名鼎鼎的AdBlock插件以及國內(nèi)的各種廣告攔截助手。 但這些插件的攔截能力可...
摘要：簡單高效的自定義方式對于這些情況我們可以使用一個(gè)強(qiáng)大的瀏覽器插件，簡稱，中文俗稱為油猴，支持和瀏覽器。簡單幾行代碼，就可以去除大部分頁面廣告。聲明需要使用的函數(shù)。 會CSS就會去廣告~ 傳統(tǒng)去廣告方法的弊端 我們?yōu)g覽網(wǎng)頁的時(shí)候經(jīng)常不免會看到各種不想看到的廣告內(nèi)容，最簡單的方案就是通過瀏覽器插件來解決，比如大名鼎鼎的AdBlock插件以及國內(nèi)的各種廣告攔截助手。 但這些插件的攔截能力可...
摘要：一般而言，擴(kuò)展會對用戶瀏覽的頁面進(jìn)行相應(yīng)的操作和一些數(shù)據(jù)傳遞，本案例的本質(zhì)是，當(dāng)用戶瀏覽網(wǎng)頁版微博時(shí)，擴(kuò)展會向當(dāng)前頁面注入預(yù)先寫好的，這樣便對微博網(wǎng)頁版進(jìn)行了樣式重構(gòu)。采用這樣的方法依次處理所有你不想看到的元素，你的微博便會簡潔很多。 0x00. 前言 微博現(xiàn)在也是變得越來越臃腫，廣告越來越多，早已不再是微博了，這讓微博深度用戶的我感到十分焦灼。由于之前就嘗試寫過 Chrome 插件，...
摘要：新站極簡插件打磨已久，終于上線訪問地址借此機(jī)會，推薦個(gè)最強(qiáng)插件，瞬間開發(fā)效率加倍用于調(diào)試應(yīng)用程序的和擴(kuò)展?？梢越鉀Q擴(kuò)展無法自動更新的問題，同時(shí)可以訪問谷歌搜索，郵箱，等谷歌服務(wù)。 showImg(http://upload-images.jianshu.io/upload_images/15934130-50747924438e3c47.jpg?imageMogr2/auto-orie...
摘要：新站極簡插件打磨已久，終于上線訪問地址借此機(jī)會，推薦個(gè)最強(qiáng)插件，瞬間開發(fā)效率加倍用于調(diào)試應(yīng)用程序的和擴(kuò)展?？梢越鉀Q擴(kuò)展無法自動更新的問題，同時(shí)可以訪問谷歌搜索，郵箱，等谷歌服務(wù)。 showImg(http://upload-images.jianshu.io/upload_images/15934130-50747924438e3c47.jpg?imageMogr2/auto-orie...
閱讀 1720·2021-09-22 10:02
閱讀 1942·2021-09-02 15:40
閱讀 2845·2019-08-30 15:55
閱讀 2255·2019-08-30 15:44
閱讀 3602·2019-08-30 13:18
閱讀 3232·2019-08-30 11:00
閱讀 1955·2019-08-29 16:57
閱讀 571·2019-08-29 16:41
