Вывод Telegram-канала на свой вебсайт29.04.2018 16:03

habr.png

Забьем еще один гвоздь в крышку гроба Роскомнадзора.

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

Странно, что на Хабре еще не упоминался этот замечательный бот — Journalist (@JournalistBot). На сайте указано, что beta, но работает более чем стабильно.

После несложной установки бота и настройки в нем своего нового journalist канала, получаете от него код виджета, который нужно поместить на свой сайт в какой-нибудь div или что-то типа этого, который выведет адаптивную вертикальную ленту ваших сообщений: 

Подписаться

Где 353945930 — id вашего канала в JournalistBot-е.
Число 10 в «widget-10» — количество последних отображаемых сообщений. Его можно менять.

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

Основные прелести виджета:

  • код разворачивается напрямую, без iframe-ов.
  • внешний вид (сам по себе приятный и стильный) легко перенастраивается своим css
  • оперативная автоматическая подгрузка новых сообщений из канала по мере их поступления (появляются сверху)

Можно сделать небольшой хак — проксировать данные канала (https://journali.st/broadcasts/353945930-widget-10.js) через свой сайт. Тогда будет возможность немножко их редактировать.

Например, у меня реализован вот такой кэширующий на 5 минут данные прокси, который отдельным скриптом /misc/image.php уменьшает размеры всех картинок.

Код journalist прокси 
= $LastModified_unix) {
    header($_SERVER['SERVER_PROTOCOL'] . ' 304 Not Modified');
    exit;
}
header('Last-Modified: '. $LastModified);



if (!file_exists($file) || (time() - filemtime($file)) > 1200) {
        $data = file_get_contents("https://journali.st/broadcasts/353945930-widget-10.js");
        $data = str_replace("https://images-onepick-opensocial.googleusercontent.com/gadgets/proxy?container=onepick&url=", "/misc/image.php?size=310&url=", $data);
        file_put_contents($file, $data);
}

readfile($file);

?>

В вышеуказанном script src необходимо поменять ссылку на наш прокси. Новые сообщения приходят клиенту, естественно, напрямую, минуя прокси.

Еще из рекомендуемой доводки напильником: скроллбар (стандартный или JQuery плагином) для блоков с ограниченной высотой, подцепка к картинкам lightbox-а (или на стороне сервера добавлением class-a, или на стороне клиента javascript-ом), свертывание блока с сообщениями по клику (чтобы не мешал).

Для lightbox-a следует учесть динамическое поступление новых картинок (сообщений). Для этого случая можно запускать обработку картинок в блоке канала каждые 10 секунд, например, или повесить обработчик событий на код journalist-а.

В целом Journalist — очень приятное и стабильное приложение, позволяющее оперативно и удобно добавлять на свой сайт информацию с компьютера или телефона — вести трансляции, например. Как отдельный telegram-канал канал в journalist не работает, поэтому при такой необходимости приходится дублировать сообщения.

Бесплатен, рекламы нет.

© Habrahabr.ru