- AdBlock: особенности работы и продвинутые методы блокировки
- Рынок блокировщиков
- Браузерные расширения
- Как читать/писать фильтры
- Блокировка с помощью JavaScript
- X-Path
- Perceptual Image Hash
- DNS фильтрация
- HTTPS фильтрация
- Нейронные сети для блокирования рекламы GCNN
- AdGraph
- Вместо итогов
- Как заблокировать рекламу в Google Chrome, FireFox и других браузерах
- Содержание
- Содержание
- Как работают блокировщики рекламы
- Какая реклама не блокируется
- Война рекламодателей с разработчиками блокировщиков
- Обзор популярных плагинов блокировки рекламы
- Adblock Plus
- AdBlock
- AdGuard Антибаннер
- uBlock Origin
- Ghostery
AdBlock: особенности работы и продвинутые методы блокировки
Привет, Хабр! Часто по работе сталкиваюсь с вопросами вроде: как же работают блокировщики рекламы?
Хочу поделиться с вами некоторыми интересными, но порой сомнительными решениями, которые можно встретить в работе расширений, и обсудить в комментариях работу блокировщиков.
В своей статье расскажу о самых интересных и необычных решениях по блокировке рекламы с помощью JavaScript’a и не только. Также посмотрим на новые направления разработки блокировщиков и куда все движется.
Статья будет полезна прежде всего веб-разработчикам, так как пользователи с блокировщиками могут столкнуться с проблемами на их проектах. А также тем, кто в данный момент ими пользуется, для более глубокого понимания работы.
Рынок блокировщиков
На данный момент самыми популярными решениями являются различные браузерные расширения, однако ими все не заканчивается. На картинке указаны основные, хотя, например, в Chrome Web Store можно найти еще сотню других.
В некоторых мобильных браузерах есть специальные опции для включения блокировки (например, Opera), некоторые изначально работают как браузеры – со встроенным блокировщиком рекламы и отслеживания (AdBlock Browser, Brave).
В некоторых мобильных браузерах есть специальные опции для включения блокировки (например, Opera), некоторые изначально работают как браузеры – со встроенным блокировщиком рекламы и отслеживания (AdBlock Browser, Brave).
Отдельным списком можно выделить следующие инструменты:
VPN серверы с функцией блокировки рекламы;
DNS серверы с блокировкой рекламы
мобильные операторы с услугами блокировки рекламы.
Браузерные расширения
Многие представляют, как работают браузерные расширения, у блокировщиков тот же принцип. Подробнее почитать про устройство расширений под Chrome.
Основными действующими лицами в AdBlock* расширениях являются background.js скрипты, которые позволяют фильтровать различные ресурсы, загружаемые по сети с помощью специального API для расширений, и content-script.js , которые позволяют работать с DOM-деревом страницы: скрывать элементы и не только.
Стоит упомянуть, что каждый из скриптов работает в отдельном фрейме, который общается с другими за счет API chrome.runtime.sendMessage и chrome.runtime.onMessage.addListener .
Перейдем к общей схеме работы расширения на примере AdBlock Plus.
Почти все блокировщики основаны на списках фильтрации, это такие файлы https://easylist-downloads.adblockplus.org/ruadlist+easylist.txt, которые содержат список правил для фильтрации контента на определенных сайтах. Также в них есть общая часть, которая относится к фильтрации на всех ресурсах, так что вы ненароком тоже можете случайно попасть под фильтрацию одного из общих фильтров (которые работают на всех сайтах).
Например, вы создали на своем сайте какой-то
На основе этих файлов и происходит вся фильтрация контента сайта. Изменениями в этих списках занимаются конкретные форумы и модераторы (например: RuAdList https://forums.lanik.us/viewforum.php?f=102), некоторые можно найти и на github’e https://github.com/abp-filters/abp-filters-anti-cv.
Браузерные расширения сами обновляют эти списки путем простого скачивания, в начале файла указано, как часто нужно обновлять фильтр, например у RuAdList указано: ! Expires: 1 days , что означает период обновления раз в день.
Как читать/писать фильтры
Для общего понимания стоит разобрать, как выглядят типичные фильтры. Слева указывается блокируемый адрес, а справа, после разделителя, идут особые параметры: какие запросы блокировать и на каком домене это нужно делать. Подробнее можно почитать здесь.
С помощью подобных фильтров можно заблокировать почти любой, загружаемый на странице ресурс. Среди которых могут быть:
Блокировка с помощью JavaScript
Сниппеты (в некоторых блокировщиках называются скриплеты) — это функция JavaScript, которая содержится в исходном коде расширения и исполняется в content-script.js , что позволяет исполнять JavaScript прямо на странице конкретного сайта.
Для примера возьмем snippet hide-if-shadow-contains , основная идея которого заключается в добавлении дополнительного поведения через дескрипторы (подробнее) для прототипов глобальных браузерных объектов или JavaScript объектов.
В данном случае, если мы успели переписать стандартное значение метода attachShadow у каждого элемента до исполнения другого JS кода на странице (что позволяет сделать Chrome Extension API), мы сможем контролировать Shadow DOM через MutationObserver , подписываясь на любое изменение внутри него.
Давайте рассмотрим на примере:
На живом примере мы видим, что блокировщик успешно справился с задачей блокировки закрытого Shadow DOM на основании его внутреннего контента.
Следующий пример — это сниппет abort-on-property-read из AdBlock Plus (код немного упрощен):
В данном сниппете используется аналогичная идея, которая заключается в переписывании стандартных свойств. Функция wrapPropertyAccess() реализует вызов Object.defineProperty() , который позволяет навесить специальный getter и вызывать исключения вместо нормальной работы функции.
В данном примере рассмотрено создание типичного класса, который прогнали, например, через Babel.
Таким образом, если блокировщик переписал глобально Object.prototype.testMethod , то наш класс успешно наследует getter который начнет возвращать исключения вместо нормального исполнения кода функции.
X-Path
Возможно, некоторые уже сталкивались с языком запросов X-Path, но немногие знают, что его можно применять в вебе (зачастую он используется парсерами страниц). Тут отличный справочник, если кого-то заинтересовало.
В браузере также существует особое API для исполнения следующих выражений, что позволяет блокировщикам избирательнее выбирать элементы для блокировки.
Perceptual Image Hash
Еще одно интересное направление работы – это работа с изображениями, так как во многих рекламных объявлениях можно встретить одинаковые картинки с логотипом рекламной сети, по этим картинкам зачастую можно найти расположение всего объявления и целиком заблокировать.
Начнем с начала – есть такая библиотека blockhash.js, которая реализует хеширование изображений по их значению на основе алгоритма из исследования «Block Mean Value Based Image Perceptual Hashing» by Bian Yang ,Fan Gu and Xiamu Niu.
Алгоритм примерно следующий:
Нормализуем размер картинки под общий пресет;
Разделяем картинку на I1, I2 … In не перекрывающихся блоков, где N – кол-во блоков, равных длине финальной hash bit строки;
Зашифровываем I1, … In блоки с помощью секретного ключа K в новую последовательность блоков;
Для каждого этого блока вычисляем его среднее M1….Mn, а затем вычисляем общее среднее Md = median(Mi), где I = 1…N;
Создаем 64-битный хэш на основании того, находится значение выше или ниже среднего (подробнее).
Давайте рассмотрим на примере этих двух изображений:
Если мы сравним 2 хэша, получившиеся из двух изображений, то увидим, что дистанция Хэмминга между этими хэшами равна 3, что означает схожесть изображений.
На этом примере мы можем видеть, что блокировщик проходится по всем картинкам и ищет среди них похожие на рекламу, что позволит найти похожую даже если по url об этом догадаться нельзя.
DNS фильтрация
Для начала напомню, что DNS позволяет нам, кроме всего прочего, по имени хоста получить IP адрес.
DNS фильтрация работает в том случае, если вы укажете в качестве DNS адресов для вашего устройства, например адреса AdGuard’a. Далее AdGuard по своему усмотрению предоставляет для обычных доменных имен их реальные IP адреса, а для рекламных – IP адреса, которые возвращают заглушки.
Минус в том, что они пропускают все или ничего, зато DNS серверы можно установить прямо на свой роутер и убрать часть рекламы со всех устройств (или получить проблемы со всеми сайтами/приложениями, которые начнут некорректно работать). Ну и конечно никто не может гарантировать, что данные ваших посещений никто не сольет.
HTTPS фильтрация
Итак, есть еще один тип блокирования, когда вы устанавливаете к себе на устройство специальное приложение (например AdGuard). И взамен получаете рутовый сертификат AdGuard к себе на устройство, который позволяет перехватывать ваш HTTPS трафик еще до того, как он попал в браузер и вырезать оттуда рекламу. (А может и не только рекламу).
Как по мне, способ очень экстремальный и экстравагантный, доверять кому-то весь свой трафик я не готов.
Нейронные сети для блокирования рекламы GCNN
Ну и конечно куда уж в 2021 году без Machine Learning в вебе. Сразу оговорюсь, что разбираюсь в теме на уровне новичка и эксперты в комментариях, надеюсь, меня если что поправят.
Одним из развивающихся направлений по блокировке рекламы с помощью нейронных сетей являются Graph Convolutional Neural Networks , которые уже с некоторыми оговорками можно запускать и на клиенте с помощью Tensorflow.js . Поэтому давайте рассмотрим примерную схему работы.
Итак, в качестве входных данных для нейронной сети выступает часть DOM модели исходного веб-сайта.
Например возьмем следующую простую DOM структуру.
Начнем с верхнего HTML элемента и вычислим все его соседние элементы. В последствии необходимо будет пройтись по всем элементам.
Затем нам необходимо составить вектор фич для каждого элемента. В качестве примера можно использовать любые свойства элементов. Например, мы обозначили, что элемент с типом div обозначается числом 29 и т.д. Тоже самое повторяет с названиями атрибутов у элементов, возможно, их размерами и т.д.
Затем с помощью любого подходящего алгоритма, например, вычисление среднего или поиск максимума, получаем среднее по выборке соседних векторов фич элементов.
После этого полученные значения попадают в обученную нейронную сеть, которая на входе имеет количество нейронов, соответствующее размерности вектора после получения среднего. Может иметь любое количество скрытых слоев, и на выходе иметь несколько коэффициентов, которые нам пока ни о чем не говорят.
Но конечно же, вся мощь открывается после того, как мы создадим несколько подобных слоев. Это необходимо, чтобы наша нейронная сеть ориентировалась не только на первых соседей заданного элемента, но и смотрела глубже, в зависимости от того, как мы хотим ее обучить.
На втором слое в нашем примере, будет происходить все то же самое, за исключением того, что входом для сети будут коэффициенты, полученные на первом слое.
В конце концов, мы должны получить какой-то конечный коэффициент, позволяющий нам говорить о наличие или отсутствии в данном элементе рекламы.
AdGraph
AdGraph – это такой необычный набор патчей для Chromium в движок Blink и JavaScript движок V8, которые позволяют на основе загружаемых ресурсов выстраивать граф зависимостей на основе трех слоев HTML, HTTP и JavaScript.
Затем AdGraph, с помощью натренированной нейронной сети Random Forest, классифицирует граф. В качестве исходной информации для обучения были использованы фильтры блокировки, о которых мы говорили ранее.
Подробнее можно посмотреть тут:
Вместо итогов
Пользоваться блокировщиками или нет – личное дело каждого пользователя. Про себя скажу, что не пользовался и не пользуюсь, а сталкиваюсь с этим в основном по работе в департаменте рекламных технологий.
Для всех тех, кто пользуется, считаю полезным знать и понимать как ваши инструменты работают. Для остальной части аудитории если вы занимаетесь веб-разработкой, то вы скорее всего не раз и не два столкнетесь с проблемами пользователей на ваших проектах при включенном блокировщике рекламы.
Источник
Как заблокировать рекламу в Google Chrome, FireFox и других браузерах
Содержание
Содержание
Реклама в Интернете процветает, с каждым годом ее становится все больше. Многочисленные навязчивые объявления приносят дискомфорт пользователям, потребляя излишний трафик, отвлекая внимание и мешая просмотру контента. Практически у каждого человека рано или поздно возникает желание избавиться от них навсегда. Для этого существуют расширения, функции браузеров и альтернативные решения. Избавиться от проблемы помогают специальные плагины с блокировкой рекламы, реже — VPN/DNS-сервисы (
Как работают блокировщики рекламы
Отсеять рекламные блоки от полезного контента — непростое мероприятие, но вполне осуществимое усилиями энтузиастов и отдельных компаний. Для этого используют фильтры, на основе правил. Как это выглядит на примере расширения (Extension), показано на схеме:
Расширения могут блокировать как алгоритмическую, так и спонсорскую рекламу. VPN/DNS-сервисы работают проще, блокируя запросы на известные рекламные серверы. Со спонсорскими блоками этот вариант не работает.
Как блокировщики различают рекламу? Для этого существуют списки правил, целью которых является блокировка любого нежелательного содержимого на странице. Самым обширным из этих списков является EasyList. Вебмастера изучают блокировщики рекламы, ведь от этого зависит их доход, и стараются замаскировать рекламные блоки, чтобы обойти ограничения, а рекламодатели создают новые рекламные сервера. Энтузиасты сообщества снова заносят все это в списки. На текущий момент в базе набралось более 70 тысяч правил.
Какие списки используются в блокировщиках рекламы, и каково их назначение.
- EasyList — блокировка рекламы во всех ее проявлениях. Блокирует и скрывает рекламные блоки. База регулярно расширяется благодаря активному сообществу.
- EasyPrivacy — аналогичный список, но предназначен для блокировки систем слежения.
Множество региональных списков, например, RUAdlist. - Fanboy’s SocialList — фильтр кнопок и виджетов соцсетей.
- AdGuard Annoyances — специальный фильтр, созданный разработчиками AdGuard. Предназначен для борьбы с всплывающими окнами, включая запросы cookie, чат с оператором сайта и другими раздражителями.
- AdGuard Filters имеет около 40 тыс. правил. Чуть ли не единственный разработчик блокировщика рекламы с собственным репозиторием.
- Acceptable Ads Standards — список разрешенной рекламы. Если пользователь не отключил функцию в блокировщике рекламы, то рекламные объявления от компаний из списка будут отображаться, даже если включена блокировка.
К плюсам блокировщиков рекламы можно отнести:
- блокировку рекламы;
- фильтрацию нежелательного контента;
- снижение времени загрузки страницы;
- снижение потребляемых ресурсов и трафика;
- защиту конфиденциальности;
- защиту от вредоносного софта (особенно для устройств на Android).
Реализовать плагины с блокировкой рекламы для мобильных устройств сложнее, поэтому чаще встречаются готовые браузеры со встроенным блокировщиком или отдельные приложения.
Какая реклама не блокируется
Стандартные способы избавляют не от всей рекламы. Во-первых, на крупных площадках может использоваться собственная реклама, например, платная подписка, акции, скидки и другие предложения. В этом случае могут помочь собственные фильтры.
На сайте может использоваться антиблокировщик рекламы, который, обнаружив плагины или приложения категории AdBlock, попросит отключить защиту, подменит внешнюю рекламу внутренней, попытается заблокировать доступ к контенту или замаскирует рекламный контент. В борьбу с ними могут вступить блокировщики антиблокировщиков рекламы. В общем, битва энтузиастов и рекламодателей в самом разгаре.
Еще одна категория рекламы, с которой довольно сложно бороться, — нативная реклама. Это могут быть спонсорские блоки (блокируются), но статьи или видео со скрытой рекламой скрыть просто невозможно. В качестве примера можно привести платные обзоры. Некоторые компании заходят дальше и создают действительно креативные вирусные ролики.
Также здесь будет уместно вспомнить про «надежных букмекеров», реклама которых отзывается болью в сердцах многих любителей сериалов. Истошные вопли героев рекламы вряд ли можно назвать приятными, особенно, когда громкость вставки намного выше громкости сериала, и слова персонажей просто не слышно.
Увы, блокировщики тут не помогут, ведь реклама «вшита» в само видео. Там, где вставка записана в начале серии, можно просто отключить звук и перемотать на нужное место. В таких случаях можно отключить автовоспроизведение, а о том, как это сделать говорилось в этой статье. Еще один вариант — скачать серию, и используя видеоредакторы, отредактировать фрагмент. Это долго и сложно — не у всех хватает терпения. Альтернатива — перейти на платные сервисы, и забыть о букмекерах, как о страшном сне.
А можно ли заблокировать рекламу в видео, например, на Ютубе? Как правило, это отдельные вставки в начале ролика. С ними без труда справляются блокировщики для YouTube, которые пользуются таким же спросом, как и расширения для сайтов. В популярных дополнениях блокировщики рекламы для сайта и Ютуба идут в комплекте.
Война рекламодателей с разработчиками блокировщиков
Первый блокировщик появился еще в 1980-х годах, и был разработан специально для сервиса Prodigy. К 2010 году появились практически все популярные сейчас решения, но востребованы они стали уже в 2015 году, когда Apple внедрила функцию блокировки рекламы. Всего за год количество пользователей, установивших расширения или приложения, выросло на 70% и продолжает стремительный рост.
Самый популярный браузер Хром принадлежит Google, львиная доля доходов которой поступает от рекламы. Сейчас, когда продукт находится на пике популярности, корпорация собирается ограничить блокировщики рекламы, мотивируя это снижением производительности, угрозами конфиденциальности и другими причинами.
Речь идет о Manifest v3, который анонсирован еще в 2018 году и в будущем будет внедрен в браузер. Интеграция изменений затянулась, во многом благодаря шумихе, которую подняли разработчики блокировщиков рекламы. Если коротко, то Manifest v3 ограничит количество фильтров. Изначально было объявлено о 5000 правил. Этого не хватит даже для региональных списков, не говоря уже об их совмещении. Сейчас Google обещает расширить поддержку до 100-150 тысяч позиций, но это еще ничего не означает.
В защиту разработчиков браузеров и поисковых систем нужно сказать, что алгоритмы отсеивания сайтов с нежелательным контентом постоянно совершенствуются. Поисковики занижают рейтинг площадок с обилием рекламы, а в браузерах, включая Chrome и его аналоги, вводятся новые алгоритмы блокировки нежелательного содержимого. Собственно, так и появились внутренние блокировщики.
Новые алгоритмы блокировки разрешают отображение рекламы из белого списка. Кстати, такая же функция есть и в Adblock Plus, где по умолчанию должны отображаться объявления от доверенных источников.
Примечательно, что Google и Adblock Plus сотрудничают. Чтобы попасть в белый список рекламодателей, нужно заплатить комиссию и соответствовать требованиям. Кстати, создателем списка Acceptable Ads является AdBlock Plus.
Еще один интересный момент: Manifest v3 уже реализован в Safari от Apple. Список правил Safari имеет ограничение в 50 КБ. Для сравнения, список EasyList «весит» 70 КБ.
Обзор популярных плагинов блокировки рекламы
Учитывая популярность этой категории, в магазинах браузеров можно встретить огромное количество решений. Чтобы перейти в интернет-магазин Chrome, перейдите по этой ссылке, а чтобы открыть Дополнения для Firefox, перейдите по этой ссылке. Рассмотрим самых популярных из них, и заодно проверим функциональность в деле.
Adblock Plus
Считается самым популярным расширением для борьбы с надоедливой рекламой. Пользователь может настроить работу блокировщика под себя.
Используемые списки для фильтрации представлены на скриншоте ниже
Что блокирует при базовой настройке:
- рекламные объявления во всех проявлениях;
- баннеры;
- всплывающие окна;
- отслеживание через кнопки соцсетей;
- рекламное видео на YouTube.
Разработчики также обещают дополнительную защиту от вредоносных элементов на сайтах, а также существенное ускорение скорости загрузки.
При тестировании с базовой настройкой не замечено ни одно рекламное объявление. Пример — ролик с Ютуба. Для сравнения представлен скриншот экрана со включенным и отключенным блокировщиком.
Для настройки работы дополнения нужно нажать значок расширения, выбрать шестеренку в появившемся окне, а дальше выбрать нужное. На скриншоте ниже приведен пример того, как отключить отслеживание и доверенную рекламу.
AdBlock
Несмотря на схожее название, это разные продукты от разных разработчиков. В магазине Chrome он так и называется «AdBlock», а для браузера Mozilla предложен «AdBlock for Firefox».
Количество автоматически подгружаемых списков по умолчанию больше:
Исходя из этого, можно сказать, что функциональность блокировщика выше. На деле оказалось, что это не так. Во-первых, реклама Яндекс.Директ все-таки периодически пробивалась, а автовоспроизведение видео на сайте не отключалось. Также появлялись всплывающие окна с предложением подписаться на рассылку. В Ютубе все работает отлично.
Не помогла даже активация всех доступных фильтров в настройке расширения.
AdGuard Антибаннер
Расширение от Adguard Software Ltd. По заявлению разработчиков, эффективно справляется с любыми видами рекламы. Отдельное преимущество удобный современный интерфейс и многообразие настройки.
- текстовую, анимированную и видеорекламу;
- баннеры и всплывающие окна;
- инсталляторы программ-шпионов;
- трекеры;
- фишинговые сайты.
С функциями блокировки справляется на отлично. Не отключает автовоспроизведение видео на страницах, за исключением рекламы.
Разработчики также предлагают приложения для ПК, iOS и Android.
uBlock Origin
Один из ярых борцов с внедрением Manifest v3. Преимущество uBlock Origin — гибкость настройки и огромный потенциал.
Для удобства пользователя в меню расширения предложена быстрая настройка работы расширения, которая в развернутом виде выглядит так:
Отключив все лишнее, можно заметить, как с сайта исчезла вся реклама и даже прикрепленное видео.
Таким образом у пользователя есть выбор того, что нужно заблокировать на сайте. Функциональность решения оценят продвинутые пользователи.
Ghostery
Блокировщик интересен интеллектуальными функциями блокировки. В бесплатной версии расширения сразу после установки хорошо блокирует рекламу на страницах, не мешая автовоспроизведению и отображению блоков с соцсетей. Поигравшись с настройкой, можно заблокировать и это.
Как видим на примере скриншота, хорошо справляется со своими задачами после внесения корректировок.
И напоследок, небольшой лайфхак. Если блокировщик неожиданно начал пропускать рекламу — удалите его, перезапустите браузер, и заново установите расширение. Во многих случаях это решает проблему.
Источник