Greasemonkey: как автоматизировать рутину в браузере с помощью скриптов

Содержание

Наверняка хотя бы раз ловили себя на мысли: «Боже, опять это делать руками». То цену на всех страницах пересчитать, то убрать рекламный баннер, который пол-экрана закрывает, то форму заполнить одними и теми же данными. Браузер — это рабочий инструмент, и он может делать часть работы за вас. Greasemonkey (и его современные аналоги) дают такую возможность. Не магия, не программирование на уровне разработчика — просто небольшие скрипты, которые меняют поведение сайтов под вас.

Что такое Greasemonkey и зачем он нужен

Greasemonkey — это расширение для Firefox, которое позволяет выполнять пользовательские JavaScript-скрипты на веб-страницах. Вы заходите на сайт, страница загружается, и скрипт автоматически вносит свои изменения: убирает лишнее, добавляет кнопки, меняет оформление, подставляет данные.

Изначально Greasemonkey появился именно для Firefox, но идея оказалась настолько живучей, что сейчас есть несколько расширений-наследников для разных браузеров. Суть у всех одна: вы управляете тем, что происходит на странице, без необходимости ждать, пока разработчики сайта что-то исправят.

Где это реально пригождается:

  • Удаление навязчивой рекламы и трекеров, с которыми не справляются блокировщики
  • Автозаполнение форм — адреса, логины, шаблоны ответов
  • Изменение дизайна сайта под себя — шрифты, контрастность, ширина колонок
  • Сбор данных со страниц — цен, контактов, расписаний
  • Добавление нового функционала — кнопок быстрого копирования, сортировки таблиц, горячих клавиш
  • Обход искусственных ограничений — например, скрытие платного барьера на новостном сайте

Какое расширение выбрать

С Greasemonkey не всё просто. Оригинальное расширение для Firefox уже не то, что было раньше — после перехода Firefox на WebExtension API оно потеряло часть функциональности. Сейчас на практике используют другие расширения, которые работают по тому же принципу.

Расширение Браузер Особенности Кому подходит
Tampermonkey Chrome, Firefox, Edge, Opera, Safari Самый популярный вариант. Поддерживает почти все скрипты Greasemonkey. Есть облачное хранение скриптов, проверка обновлений, простой интерфейс. Тем, кто хочет максимум возможностей и не хочет заморачиваться с настройками. Стандарт де-факто.
Violentmonkey Chrome, Firefox, Edge Лёгкий, открытый исходный код, минимум разрешений. Работает быстрее Tampermonkey на слабых машинах. Меньше функций, но для большинства задач хватает. Тем, кто ценит минимализм и не доверяет проприетарным решениям.
Greasemonkey (оригинальный) Firefox Классика. После обновления до WebExtension стал менее гибким. Совместимость со старыми скриптами не полная. Тем, кто привык к оригиналу и не нуждается в продвинутых функциях.
Userscripts (Safari) Safari Простое расширение для пользователей Apple-устройств. Базовый функционал, работает стабильно. Владельцам Mac и iPhone, которым нужно минимум настроек.

Мой совет: если не знаете, что выбрать — ставьте Tampermonkey. Он работает везде, у него самая большая база готовых скриптов, и если что-то пойдёт не так, легко найти решение на форумах. Если принципиально важна открытость кода — Violentmonkey.

Установка и первый скрипт

Процесс установки одинаковый для всех расширений:

  1. Откройте магазин расширений вашего браузера (Chrome Web Store, Firefox Add-ons и т.д.)
  2. Введите «Tampermonkey» в поиск
  3. Нажмите «Установить» и подтвердите добавление
  4. После установки в панели расширений появится иконка — нажмите на неё
  5. Выберите «Создать новый скрипт» — откроется редактор

Перед вами будет шаблон с метаданными. Вот что важно понимать в этом шаблоне:

  • // @match — на каких сайтах запускать скрипт. *://*/* означает «на всех сайтах», но лучше указать конкретный адрес
  • // @grant — какие дополнительные права запрашивает скрипт. Без этого многие функции недоступны
  • // @name — название скрипта, отображается в меню расширения
  • // @namespace — техническое поле, обычно указывают сайт автора или свой ник

Простейший рабочий пример — скрипт, который меняет цвет фона на всех страницах:

// ==UserScript==
// @name         Смена фона
// @namespace    http://tampermonkey.net/
// @version      1.0
// @description  Меняет фон всех страниц на тёмно-серый
// @match        *://*/*
// @grant        none
// ==/UserScript==

(function() {
    'use strict';
    document.body.style.backgroundColor = '#1a1a1a';
})();

Сохраните скрипт (Ctrl+S), обновите любую страницу — фон станет тёмным. Поздравляю, вы написали свой первый юзерскрипт. Дальше — больше.

Где брать готовые скрипты

Писать скрипты с нуля необязательно. Сообщество создало тысячи готовых решений под практически любую задачу.

Greasy Fork (greasyfork.org) — главный репозиторий юзерскриптов. Там есть всё: от убирания рекламы на конкретных сайтах до добавления функционала на форумы и соцсети. Удобная фильтрация по сайтам и тематикам, отзывы пользователей, рейтинги.

OpenUserJS (openuserjs.org) — альтернативный репозиторий. Меньше скриптов, но иногда попадаются уникальные вещи, которых нет на Greasy Fork.

GitHub — некоторые разработчики выкладывают свои скрипты там. Обычно это более сложные и мощные решения с открытым исходным кодом.

При выборе скрипта смотрите на:

  • Дату последнего обновления — если скрипт не обновлялся два года, он может не работать
  • Количество установок — чем больше, тем довереннее
  • Отзывы — там часто пишут о проблемах и конфликтах
  • Открытый исходный код — если скрипт открыт, можно проверить, что он не делает ничего подозрительного

Практические примеры: что можно автоматизировать

Автозаполнение форм

Если каждый день заполняете одну и ту же форму — адрес доставки, контактные данные, шаблон письма — скрипт может делать это за вас:

// ==UserScript==
// @name         Автозаполнение формы
// @match        https://example.com/order
// @grant        none
// ==/UserScript==

(function() {
    document.querySelector('#name').value = 'Иванов Иван';
    document.querySelector('#phone').value = '+79001234567';
    document.querySelector('#city').value = 'Москва';
})();

Скрипт срабатывает только на странице https://example.com/order и заполняет указанные поля. Главное — знать идентификаторы полей (правый клик на поле → «Просмотр кода» → ищем id=).

Удаление элементов со страницы

Рекламные блоки, всплывающие окна, баннеры — всё это можно вырезать через скрипт:

// ==UserScript==
// @name         Убираем баннеры
// @match        https://news-site.com/*
// @grant        none
// ==/UserScript==

(function() {
    // Убираем конкретный баннер
    var banner = document.querySelector('.ad-banner');
    if (banner) banner.remove();

    // Убираем все элементы с классом "sponsor"
    var sponsors = document.querySelectorAll('.sponsor');
    sponsors.forEach(function(el) {
        el.remove();
    });
})();

Изменение внешнего вида

Можно перекроить сайт под себя — увеличить шрифт, изменить ширину контента, убрать боковую панель:

// ==UserScript==
// @name         Улучшаем читаемость
// @match        https://blog-example.com/*
// @grant        GM_addStyle
// ==/UserScript==

(function() {
    GM_addStyle(`
        body { font-size: 18px !important; line-height: 1.8 !important; }
        .sidebar { display: none !important; }
        .content { max-width: 800px !important; margin: 0 auto !important; }
    `);
})();

Обратите внимание на @grant GM_addStyle — без этого директива не сработает. Это одна из частых ошибок новичков.

Парсинг данных со страницы

Нужно собрать цены со всех страниц каталога или контакты компаний? Скрипт может извлечь данные и вывести их в удобном виде:

// ==UserScript==
// @name         Сбор цен
// @match        https://shop-example.com/catalog
// @grant        none
// ==/UserScript==

(function() {
    var prices = document.querySelectorAll('.price');
    var result = [];
    prices.forEach(function(el) {
        result.push(el.textContent.trim());
    });
    console.log('Найдено цен:', result.length);
    console.log(result.join('\n'));
})();

Результат можно посмотреть в консоли разработчика (F12 → Console). Оттуда данные копируются в Excel или Google Sheets.

Что нужно знать про безопасность

Юзерскрипты — это код, который выполняется в вашем браузере. А значит, злоумышленник может написать скрипт, который украдёт ваши данные. Это не теория — на Greasy Fork периодически появляются вредоносные скрипты.

Правила безопасности, которые стоит соблюдать:

  • Не ставьте скрипты с закрытым кодом от неизвестных авторов. Если скрипт обфусцирован (код выглядит как каша из символов) — это красный флаг
  • Проверяйте запрашиваемые разрешения. Если скрипт для смены фона запрашивает доступ ко всем данным на всех сайтах — что-то не так
  • Обновляйте скрипты. Разработчики исправляют уязвимости, но только если вы получаете обновления
  • Используйте @match вместо @include. Это ограничивает область действия скрипта
  • Читайте код перед установкой. Даже беглый взгляд может выявить подозрительные обращения к сторонним серверам

Частые ошибки и как их избежать

Скрипт не запускается

Самая частая причина — неправильно указан @match. Проверьте, совпадает ли шаблон с реальным адресом страницы. Обратите внимание на https vs http, наличие www, поддомены. Шаблон *://*.example.com/* покрывает все варианты.

Скрипт запускается, но ничего не меняет

Элемент, который вы пытаетесь изменить, может ещё не существовать в момент выполнения скрипта. Используйте задержку или ожидание:

function waitForElement(selector) {
    return new Promise(resolve => {
        if (document.querySelector(selector)) {
            return resolve(document.querySelector(selector));
        }
        const observer = new MutationObserver(() => {
            if (document.querySelector(selector)) {
                resolve(document.querySelector(selector));
                observer.disconnect();
            }
        });
        observer.observe(document.body, { childList: true, subtree: true });
    });
}

waitForElement('.dynamic-content').then(el => {
    el.style.display = 'none';
});

Конфликт скриптов

Если установлено несколько скриптов на одну страницу, они могут мешать друг другу. Один добавляет элемент, другой его удаляет. Решение: проверять наличие элемента перед действием и использовать уникальные идентификаторы.

Забыли про @grant

Без @grant GM_setValue не работает сохранение настроек. Без @grant GM_xmlhttpRequest не уходят запросы на сторонние серверы. Без @grant GM_addStyle не применяются стили. Каждая специальная функция требует своего разрешения в метаданных скрипта.

Как написать скрипт под свою задачу

Не обязательно быть программистом. Достаточно базового понимания JavaScript и умения работать с DOM-деревом страницы.

Алгоритм действий:

  1. Определите, что именно нужно изменить. Откройте страницу, нажмите F12, найдите нужный элемент в инструментах разработчика
  2. Запишите селектор элемента. Правый клик на элементе в инспекторе → Copy → Copy selector. Это ваш ключ к элементу
  3. Подумайте, что с ним сделать. Удалить? Изменить текст? Добавить обработчик клика? Изменить стили?
  4. Напишите скрипт в редакторе расширения. Начните с простого варианта, добавьте console.log() для отладки
  5. Протестируйте. Обновите страницу, проверьте консоль на ошибки, поправьте код
  6. Добавьте @match и сохраните. Не забудьте ограничить область действия

Полезные методы для работы с DOM:

  • document.querySelector('.class') — найти первый элемент по селектору
  • document.querySelectorAll('.class') — найти все элементы
  • element.textContent — получить или изменить текст
  • element.style.property — изменить стиль
  • element.addEventListener('click', fn) — добавить обработчик события
  • element.remove() — удалить элемент
  • element.innerHTML — получить или заменить HTML-содержимое

Сценарии выбора под разные ситуации

Если вам нужно просто убрать рекламу на одном сайте — поищите готовый скрипт на Greasy Fork. Скорее всего, кто-то уже решил эту задачу. Установите, проверьте, радуйтесь.

Если нужна автоматизация на рабочем месте (заполнение форм, сбор данных) — пишите скрипт сами. Это не сложно, если задача конкретная. Начните с автозаполнения одного поля и постепенно расширяйте функционал.

Если вы часто работаете с разными сайтами — создайте библиотеку скриптов. Tampermonkey позволяет включать и выключать их по отдельности. Сгруппируйте по задачам: один скрипт для соцсетей, другой для почты, третий для новостных сайтов.

Если важна производительность — используйте Violentmonkey вместо Tampermonkey. Он меньше потребляет память и не тормозит браузер при большом количестве скриптов.

Если не хотите разбираться в коде вообще — используйте готовые сборники скриптов. На Greasy Fork есть подборки для популярных задач: убирание рекламы на YouTube, улучшение интерфейса соцсетей, добавление функционала на форумы.

Продвинутые возможности

Когда базовый функционал освоен, можно задействовать более мощные инструменты:

  • GM_setValue / GM_getValue — сохранять настройки и данные между сессиями. Например, запоминать, какие товары вы уже просмотрели
  • GM_xmlhttpRequest — отправлять запросы к API и сторонним серверам напрямую из скрипта
  • GM_addStyle — внедрять CSS-стили на страницу без редактирования каждого элемента по отдельности
  • GM_registerMenuCommand — добавлять кнопки в меню расширения для быстрого доступа к функциям
  • MutationObserver — отслеживать изменения на странице и реагировать на них (полезно для динамических сайтов)

Пример с сохранением настроек:

// ==UserScript==
// @name         Настраиваемый скрипт
// @match        *://*/*
// @grant        GM_setValue
// @grant        GM_getValue
// @grant        GM_registerMenuCommand
// ==/UserScript==

(function() {
    var color = GM_getValue('bgColor', '#ffffff');
    document.body.style.backgroundColor = color;

    GM_registerMenuCommand('Сменить цвет фона', function() {
        var newColor = prompt('Введите цвет (hex):', color);
        if (newColor) {
            GM_setValue('bgColor', newColor);
            document.body.style.backgroundColor = newColor;
        }
    });
})();

Теперь в меню Tampermonkey появится пункт для смены цвета, и выбранное значение сохранится между перезагрузками.

Итог

Юзерскрипты — это тот инструмент, который один раз настроил и забыл о рутине. Не нужно быть разработчиком, чтобы написать простой скрипт на удаление баннера или автозаполнение формы. А если задача сложнее — готовые решения уже есть на Greasy Fork.

С чего начать:

  1. Установите Tampermonkey или Violentmonkey в свой браузер
  2. Зайдите на Greasy Fork и поищите скрипты под свои задачи
  3. Попробуйте написать один простой скрипт — хотя бы для смены фона
  4. Постепенно расширяйте функционал по мере необходимости

Главное — не гонитесь за сложностью. Лучше десять простых работающих скриптов, чем один нерабочий комбайн. И всегда проверяйте, что чужой скрипт делает, прежде чем дать ему доступ к своим данным.

Dfncfg.ru
© 2026 Dfncfg.ru
Этот сайт использует cookie для хранения данных. Продолжая использовать сайт, Вы даете свое согласие на работу с этими файлами.