Как сделать расширение для браузера яндекс

Делаем своё расширение для браузера за 10 минут

В конце 2020 года мы делали проект со снежинками — писали специальный скрипт, который запускал падающий снег на сайтах. Если бы мы хотели сделать такой снег на любом своём сайте, это не составило бы труда: добавляешь скрипт в код страницы, и готово.

А вот на чужих сайтах была проблема. Скрипт нужно было вставлять через консоль. А если на сайте была настроена политика безопасности, которая запрещает запуск внешних скриптов, то магия не срабатывала.

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

�� Что такое расширение

Расширение для Chrome — это небольшая программа, которая выполняется внутри браузера и помогает расширить возможности сайтов. Сила расширения в том, что оно может выполняться прямо из меню браузера и не зависит от политик безопасности.

Примеры того, что может сделать расширение:

• Сохранить ваши пароли и другие личные данные,
• Выдрать из страницы скрытые данные (например, ссылку на скачивание музыки).
• Менять что-то на странице, например, отключать рекламу, переводить текст, удалять ненужное.
• Собирать статистику вашей работы в интернете.
• Подключаться к другим сервисам (почте, чатам, файлообменникам) и взаимодействовать с ними из браузера.

В этой статье

Мы сделаем самое простое расширение для браузера Chrome, которое позволит запускать скрипт со снежинками на любом сайте, независимо от настроенной политики безопасности. Для этого воспользуемся официальным руководством Google по созданию расширений.

Манифест

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

• как называется расширение;
• к чему расширение может получить доступ;
• какие скрипты будут работать в фоне;
• как должна выглядеть иконка расширения;
• что показать или что выполнить, когда пользователь нажмёт на иконку расширения.

Манифест задаёт общие правила для всего расширения, поэтому манифест — единственный обязательный компонент. Можно обойтись без иконок и скриптов, но манифест обязательно должен быть.Каждый манифест хранится в файле manifest.json — создадим пустой файл с таким именем и напишем внутри такое:

«name»: «Запускаем снежинки на любом сайте»,
«description»: «Проект журнала Код»,
«version»: «1.0»,
«manifest_version»: 3
>

Первые две строчки — это название и подробное описание расширения. Третья отвечает за номер версии расширения, а последняя говорит браузеру, какая версия манифеста используется в описании. На момент выхода статьи в феврале 2021 года используется третья версия.

Сохраняем файл и всё, расширение готово. Оно ничего не умеет, ничего не делает, зато мы уже можем добавить его в браузер. Для этого запускаем Хром и в адресной строке пишем:

Мы попадаем на страницу, которая нам покажет все установленные расширения:

Чтобы добавить своё расширение, в правом верхнем углу включаем режим разработчика, а затем нажимаем «Загрузить распакованное расширение»:

Теперь выбираем папку, в которой лежит наш манифест:

Отлично, мы только что добавили в браузер новое расширение:

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

Чтобы было проще работать и тестировать расширение, закрепим его на панели браузера:

Иконки

У расширения есть две иконки, которыми мы можем управлять:

1. Картинка в карточке расширения на странице настроек.
2. Иконка на панели браузера.

Чтобы не рисовать всё с нуля, скачаем папку с иконками из того же руководства Google и положим её в ту же папку, что и манифест:

Теперь добавим иконки в манифест. За картинку в карточке отвечает блок icon, а за иконку на панели — блок action. Разные размеры картинки нужны для того, чтобы на разных мониторах с любой плотностью пикселей иконки выглядели хорошо:

 < "name": "Запускаем снежинки на любом сайте", "description": "Проект журнала Код", "version": "1.0", "manifest_version": 3, "action": < "default_icon": < "16": "/images/get_started16.png", "32": "/images/get_started32.png", "48": "/images/get_started48.png", "128": "/images/get_started128.png" >>, "icons": < "16": "/images/get_started16.png", "32": "/images/get_started32.png", "48": "/images/get_started48.png", "128": "/images/get_started128.png" >>

Сохраняем манифест, обновляем расширение на странице настроек и смотрим результат:

Настраиваем разрешения

Разрешения — это то, что браузер позволяет делать расширению со страницами и с их содержимым. Для запуска снежинок нам нужно сделать две вещи:

1. Понять, какая вкладка сейчас активная, чтобы запустить снежинки именно на ней.
2. Запустить наш скрипт со снежинками.

Чтобы получить доступ к активной вкладке и к запуску скриптов, добавим в манифест такую строку:

«permissions»: [«activeTab», «scripting»],

Показываем меню

Если мы сейчас нажмём на иконку расширения на панели браузера, то ничего не призойдёт, потому что мы ничего не запрограммировали. Исправим это — сделаем так, чтобы при нажатии расширение показывало кнопку запуска. Когда расширение будет уметь больше, вместо одной кнопки можно будет показать целое меню.

Чтобы сделать всплывающее меню, добавим в манифест в раздел action такую строку:

Она означает, что при нажатии на иконку мы увидим рядом с ней мини-страничку, на которой что-то будет.Создадим в той же папке расширения файл popup.html и добавим в него такой код:

     /* задаём размеры кнопки и размер текста на кнопке */ button   

Чтобы браузер не ругался, что у нас нет файла popup.js , создадим пустой файл с таким названием и положим его в ту же папку:

Сохраняем манифест, обновляем его на странице настроек и видим, что у нашего расширения появилось меню с кнопкой:

Запускаем снежинки

Вся магия будет происходить в файле popup.js — откроем его и добавим такой код:

// получаем доступ к кнопке let snow = document.getElementById("snow"); // когда кнопка нажата — находим активную вкладку и запускаем нужную функцию snow.addEventListener("click", async () => < // получаем доступ к активной вкладке let [tab] = await chrome.tabs.query(< active: true, currentWindow: true >); // выполняем скрипт chrome.scripting.executeScript(< // скрипт будет выполняться во вкладке, которую нашли на предыдущем этапе target: < tabId: tab.id >, // вызываем функцию, в которой лежит запуск снежинок function: snowFall, >); >); // запускаем снег function snowFall()

Последнее, что нам осталось сделать, — положить в функцию snowFall() полный код скрипта из проекта со снежинками и сохранить файл.

Проверка

В прошлый раз мы не смогли запустить скрипт на любой странице Яндекса — мешала политика безопасности. Теперь всё работает:

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

Как ускорить любое видео в браузере

Привет, друзья! Я, как и все пользователи интернета, люблю смотреть видеоролики с полезным обучающим или информационным контентом. Но многие ролики имеют большую длительность, да и авторы не очень-то быстро рассказывают в своем видео. Иногда смотришь такой видеоролик и практически засыпаешь, вот бы прибавить темпу такому видео. Сегодня я поделюсь с вами советом, как ускорить видео в браузере при серфинге в интернете .

Как ускорить любое видео в браузере

На Youtube есть возможность изменять скорость воспроизведения ролика в различных пределах, как в сторону замедления так и в сторону ускорения. Это очень удобная функция, она экономит время без ущерба воспринимаемой информации. Для любого ролика можно подобрать скорость, при которой речь закадрового голоса будет разборчива. Но все это замечательно для Youtube. А вот для других видеохостингов такая возможность может быть не предусмотрена.

Например, vimeo. Так уж пришлось, что многие интересные видеоуроки, вебинары авторы выкладывают на vimeo. Их продолжительность может быть более часа и чтобы вспомнить какой-то момент урока нужно пересмотреть его заново, что достаточно неудобно. Сам не понимаю, почему мысль использовать расширение для браузера пришла ко мне не сразу. А ведь это очень удобная вещь — этот плагин называется Video Speed Controller.

Расширение для ускорения видео

Расширение Video Speed Controller есть для браузеров Firefox, Chrome, Yandex. Для других не знаю, если вы в курсе поделитесь в комментариях. Итак, расскажу немного о данном расширении.

Скачать расширение для Chrome и Яндекс браузера можно здесь

Скачать расширение для для Firefox качайте здесь

Рассмотрим пример установки в Google Chrome. Выбираем пункт Настройки и управление Google Chrome — Дополнительные инструменты — Расширения.
На открывшейся странице переходим в самый низ и кликаем ссылку Ещё расширения (смотри картинку).

Откроется вкладка магазина расширений и здесь в поле поиска вбиваем название плагина. Он появиться в списке, нажимаем Установить. Подтверждаем наши действия.

После установки вы увидите всплывающее сообщение для активации расширения.

При нажатии на данную кнопку можно зайти в меню настроек этого дополнения. Ниже на картинке указано, какие действия будут происходить во время просмотра ролика, при нажатии соответствующих букв на английской раскладке. Вы можете задать свои символы, если предложенный вариант вас не устраивает. После изменения настроек не забудьте сохранить их нажатием кнопки Save.

Теперь заходим на любой видеохостинг и запускаем воспроизведение видео. В верхнем левом углу, на полупрозрачном фоне, в прямоугольнике будет отображаться текущая скорость воспроизведения. Кликните по нему и раскроется панель с кнопками управления.

Вот таким нехитрым способом можно просматривать обучающие ролики, лекции, вебинары, размещенные на различных видеохостингах: яндекс видео, rutube, youtube, vimeo. Уменьшив скорость ролика можно законспектировать важные сведения, а увеличив — быстро вспомнить уже просмотренную ранее информацию. Друзья, это действительно полезное расширение. Расскажите своим знакомым, поделитесь информацией в социальных сетях.

Видео: как работает video speed controller

• Как разместить ярлык сайта на Рабочем столе
• Яндекс-браузер — безопасность серфинга в Интернет

Дорогой читатель! Вы посмотрели статью до конца. Получили вы ответ на свой вопрос? Напишите в комментариях пару слов. Если ответа не нашли, укажите что искали или откройте содержание блога.

ОЧЕНЬ ВАЖНО! Оцени лайком или дизлайком статью!

18 41 586 views
Вам также может быть интересно

Работаем в Интернет 9 2 194 views
Что такое Яндекс Диск и зачем он нужен? Яндекс Диск — это облачное хранилище,

Работаем в Интернет 7 5 047 views
Вход через браузер компьютера Для того, чтобы зайти в ВКонтакте, нужно выполнить следующие действия:

Работаем в Интернет 10 6 537 views

Pro100tak.com интуитивно-понятный онлайн конструктор открыток. В нем можно создать открытку со своим фото, со

Работаем в Интернет 9 156 784 views

Приветствую, друзья! Недавно озаботился таким вопросом – как проверить фото на совпадение в интернете?

Работаем в Интернет 4 1 306 views

Краткое объяснение понятия фриланса Фриланс – это сфера деятельности, которая за последние годы стала

uTorrent для Яндекс Браузера

Расширение uTorrent для Яндекс.Браузера – специальный плагин, позволяющий просматривать историю и регулировать список задач для клиента торрент. Это упрощенный функционал, который дает возможность следить за загрузками, не отрываясь от серфинга в сети.

Функционал расширения uTorrent для браузера

Функционал плагина Торрент довольно широк:

• прямо в браузере дает информацию о состоянии загрузок без необходимости сворачиваться и отвлекаться на программу;
• позволяет регулировать процесс загрузки, выставлять параметры и ставить паузу;
• предлагает дополнительный список настроек, где можно указать нужные торрент-трекеры для использования (правда, понадобится дополнительная регистрация);
• позволяет управлять скоростью загрузки;
• дает возможность напрямую удалять и добавлять трекеры;
• предоставляет полную статистику о количестве загруженных данных.

Установить расширение для Яндекс.Браузера Торрент несложно, достаточно скачать специальный файл, запустить его, и можно смело пользоваться доступным функционалом.

Ключевые достоинства плагина

Разработка uTorrent обладает следующими особенностями:

• не требует дополнительных мощностей компьютера;
• может полностью работать без основного клиента;
• экономит время для установки файлов для скачивания;
• позволяет скачивать данные без использования браузера, контролируя загрузку больших файлов ;
• имеет функцию установки паузы и повторной активации загрузки;
• единый аккаунт для применения всех возможностей;
• расширенные настройки для регулировки функционала программы.

Список особенностей весомый, особенно для пользователей, которые любят контролировать всю активность и не терять загрузки.

Постоянные улучшения

В отличие от полноценной программы, для uTorrent загрузка обновлений не требуется, они автоматические, достаточно просто продолжать пользоваться расширением. В качестве улучшений предлагается решение проблем с функционированием, расширение списка сайтов для загрузки контента и стабилизация работы при интенсивной нагрузке. Этот плагин улучшается не так часто, как сам клиент, но разработчики стараются уделять ему столько же внимания.

Нужно ли пользоваться расширением

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

Перед активным использованием обязательно установите антивирусную защиту, чтобы случайно не заразить компьютер вредоносным ПО.

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

12 полезных расширений для «Яндекс.Браузера»

Расширения для браузера — это программы, которые дополняет его функционал. После установки они появляются на боковой панели, где их можно быстро найти и легко использовать: не нужно искать сервисы в поисковиках или закладках. РБК Life составил подборку полезных приложений, которые упростят работу в «Яндекс.Браузере».

12 расширений для «Яндекс.Браузера»

1. Lightshot

Lightshot помогает быстро сделать скриншот. Если вы часто делаете снимки экрана именно в браузере, удобнее будет использовать расширение, а не искать нужную программу на компьютере. В Lightshot также можно выбрать нужный фрагмент для снимка и отредактировать картинку, например добавить текст.

2. Todoist

Todoist помогает вести список дел. К каждой задаче можно добавить описание, выбрать приоритетность, установить дедлайн. В карточку прикрепляются ссылки на сайты, поэтому расширение можно использовать, чтобы сохранять понравившийся контент. После того как задача выполнена, одним щелчком мышки ее можно закрыть, и карточка с описанием исчезнет.