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

UPD: новая ссылка на документацию по API



В наших текстах мы периодически упоминаем некую «экосистему Skyeng». Настала пора разобраться, что же мы понимаем под этим термином. В этой статье мы расскажем, что такое экосистема и почему ее создатели заинтересованы в том, чтобы на ней зарабатывало как можно больше сторонних разработчиков. Ну и, конечно, покажем, где найти открытые методы нашего API, чтобы вы уже сейчас начали прикручивать наш словарь к своему приложению. И еще будет конкурс!

У школы Skyeng есть расширение для веб-браузеров «Vimbox Переводчик», умеющее переводить английские тексты веб-страниц на русский язык. На первый взгляд, ничего особенного в этом нет, а подобных сервисов – пруд пруди, но в реальности эта штука очень важна для экосистемы школы, и мы надеемся, что она окажется полезна не только для наших учеников, но и для сторонних пользователей. Сегодня мы расскажем, почему мы так думаем, как мы разрабатывали это расширение, что оно умеет и над чем работает его команда в настоящий момент.

И снова здравствуйте!

Безумно много времени прошло с момента нашей последней публикации, приуроченной к возрождению российской Pro-сборки K-meleon. Конечно, многие воспримут наши новости с иронией и неизбежными ухмылками.

Увы, разработка K-Meleon'a стагнировала по ряду объективных причин, главная из которых — зависимость от единственного разработчика. У нашего «отца-разработчика» Дориана случилось подряд несколько проблем, что самым негативным образом повлияло на разработку, вкупе с бурными революциями в коде движка Мозилла, о которых сообщество уже давно отбурлило и теперь продолжает лишь тихо подвывать.

Тем не менее, нельзя сказать, что разработка встала совсем — наша сборка основана на коде, выпущенном в декабре 2016 года. Правда, это по-прежнему релиз-кандидат 76-й версии, основанной на Gecko 38 ESR, так что браузер заведомо перешел в разряд олдфагового инструментария, актуального для обладателей устаревшего и слабого оборудования.

Нет, он по-прежнему прекрасно работает и на современном оборудовании, но модерн-вебдизайн стремительным домкратом обрушивает на нас все новые и новые фишки популярных сайтов (часто написанные вопреки всем веб-стандартам), которые разработчикам браузеров просто ПРИХОДИТСЯ поддерживать. Ибо куда им (даже таким как Google) бодаться с тем же фейсбуком — себе дороже. Проше вставить в код костыль.

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

UPD: Заголовок был изменен с «IDE – зло. Давайте использовать Notepad» на более адекватный.

Иногда кажется, что разработчики некоторых крупных интернет-проектов до сих пор пишут код в Блокноте и думают, что все остальные должны поступать также. Шутка, конечно, но почему в большинстве популярных CMS до сих пор отсутствуют удобные инструменты для редактирования кода, я понять не могу. Как ни стараюсь.

Если вам иногда не хватает подсветки синтаксиса при редактировании кода в браузере — добро пожаловать под кат.

Недавно мы писали статью о том, как сделать расширение скриншаринга для браузера Google Chrome. В результате мы создали собственное расширение для скриншаринга, опубликовали его в Chrome Store и протестировали трансляцию экрана через Web Call Server в режиме один-ко-многим.

В этой статье мы проделаем тоже самое с браузером Firefox. Подход остается прежним и снова потребуется упаковка и публикация расширения, на этот раз в Mozilla Add-ons. В результате мы сможем делать скринкасты видеопотоков из FF без установки внешнего дополнительного ПО.

Cкринкастинг в Chrome

Cкринкастинг (демонстрация экрана, скриншаринг) уже работает в браузере Google Chrome и позволяет захватывать как окно самого браузера, так и окно любого другого приложения. Например можно захватить Firefox, запущенный в соседнем окне.

Все бы замечательно, но есть проблема с безопасностью. В браузере Chrome скринкастинг выключен.

Для его включения необходимо воспользоваться Chrome Desktop Capture API и мы покажем в этой статье как это сделать.

Расширение для скринкастинга

Чтобы скринкастинг заработал, юзер должен установить ваше расширение (Chrome Extension), которое создано специально для вашего сайта (домена).

Возникла необходимость текстового поиска по видео на ютубе, готового решения не нашел (может быть оно и есть), решил сам смастерить.

Прошел год с запуска IT-вопросника, однако проработал он не долго, примерно пару месяцев. Это был один из самых активных каналов PushAll, многие пользователи получали вопросы по 100+ в день и кликали на большие из них.

Отвечая на вопросы все были в плюсе:

1. Те кто спрашивают – сразу получали ответ
2. Владельцы сервисов получали большую посещаемость и больше решенных вопросов
3. Тот кто отвечал первым – получал свои ачивки в сервисах

Я долго пытался связаться с создателем IT-вопросника, получилось достучаться только в этом месяце. В итоге спустя сутки после нашего общения, снова начали приходить пуши.

Но что изменилось за этот год при использовании IT-вопросника?

Кому лень читать статью: подписываемся на канал IT-вопросника в PushAll и настраиваем теги в панели управления IT-вопросником (после подписки на канал редиректнет на панель)

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



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

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

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

TL;DR: есть способ обойти агрессивные анти-адблокеры сейчас, в рамках существующих правил игры, в расширениях браузеров.

Хочу поделиться небольшим опытом работы с блокировщиками рекламы со стороны front-end разработчика. Все понимают, что наша задача сделать так, чтобы сайт нормально работал и выглядел при любых настройках пользователя, на любых устройствах. Я иногда посматриваю постоянно проверяю как выглядит сайт при отключенном javascript, проверяю работу на touch-устройствах, устройствах с маленьким разрешением итд. итп. После того, как у нас на сайте из-за Adblock Plus (далее по тексту просто Adblock) перестал работать видео-плеер — стало понятно, что наличие блокировщика рекламы также нужно учитывать при верстке сайта…

Не так давно настроил я на своем проекте CSP (content security policy), и решил что жизнь удалась. Ведь теперь невозможно подгрузить скрипты с запрещенных ресурсов, и даже о попытке сделать это, я буду уведомлен соответствующей ошибкой. А если кто-то и подгрузить скрипт, то все равно ничего не сможет передать, ведь ajax запросы отправляются только на мои сервера.

Так я подумал, и был какое-то время спокоен.

Что если бы вы могли добавить в редакторы документов любые функции, какие вам хочется? Теперь вы можете: в редакторах ONLYOFFICE появилась возможность подключения плагинов. Несколько примеров мы написали сами — все их можно посмотреть в нашем открытом репозитории на GitHub'e. Теперь ваш ход — напишите то, чего вам не хватало.

Подробности далее.

На днях возникло желание написать простенькое расширение для Google Chrome. Столкнулся с такой проблемой, что после изменений в коде расширения, браузер не перезагружает его автоматически. Это очень сильно затрудняет разработку, т.к. после каждого Cmd-S в редакторе, приходится нажимать "Reload" в списке расширений, а затем еще и рефрешить страницу, чтобы перезапустить контент-скрипты.

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

Готовое встраиваемое решение лежит на github.com/xpl/crx-hotreload, а в этой статье я расскажу, как оно реализовано.

Инженер из компании BugReplay нашёл отличный способ продемонстрировать, как работает его сервис скринкаста с записью сетевого трафика и демонстрацией ошибок, в том числе WebSockets и JavaScript. Он записал скринкаст загрузки Pornhub с отображением лога трафика, который синхронизирован с видео. Так вот, на этой демонстрации отлично видно, каким образом Pornhub обходит блокировщики рекламы и пропихивает рекламу с помощью вебсокетов.

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

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

Современные мобильные браузеры, как и их десктопные аналоги, должны позволять пользователям добавлять недостающие возможности с помощью дополнений. Несмотря на отказ команды Chromium от идеи поддержки расширений на Android, наша команда продолжает работать над этой возможностью, и сегодня мы приглашаем сообщество Хабра попробовать первую альфу Яндекс.Браузера, в которую вы уже сможете установить LastPass, Tampermonkey или даже Ghostery.



Первые дополнения появились в Internet Explorer еще в 1999 году и за следующее десятилетие практика открытия доступа к API стала обязательной для любого более-менее популярного браузера. Сейчас многие из нас не представляют себе работу за компьютером без возможности добавить в браузер необходимую функцию собственными руками. А вот с Android пока еще все не так. Несмотря на рост производительности современных мобильных устройств, браузерные расширения на Android – скорее исключение, чем правило.

Предыстория

В 2012-2013 годах я нашёл одно онлайн-радио, которое «зацепило» меня большим выбором хорошей музыки и тем, что там (почти) не было рекламы.

По своей должности я — web-разработчик, да ещё интересуюсь различными технологиями и происходящим в науке, и посему у меня довольно часто открыто большое количество вкладок в браузере, а зачастую ещё и несколько профилей в браузере. А если ещё добавить к этому среду разработки, графический редактор, открытые папки, то хоть заводи навигатор по всем открытым окнам и вкладкам.

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

Такое происходило часто, и я всё чаще стал задаваться мыслью найти решение этой проблемы.

“Распарсить сайт” — словосочетание, которое повергало меня в уныние всего полгода назад. В моей голове сразу же проносились знакомые проблемы с настройкой фантома, или возней с селениумом. Мысли о возможной необходимости подменять useragent, пагинации и других действиях во время парсинга заставляли откладывать эту задачу в долгий ящик…

Но всё изменилось, когда я встретил Гуся. Мир парсинга заиграл новыми красками. Под катом я хочу показать несколько простых примеров, которые могут помочь распарсить непростые сайты.

Кстати, написав парсер, Гусь решил снять фильм про это, пока что вы можете насладиться трейлером: