Доброе утро! Меня зовут Влад, я технический писатель в Selectel. Не так давно я публиковал статью, где
сказал
как мы с коллегами разработали кодер для статей Google Docs на Хабре.
Но мы работаем не только с Хабром, но и с vc.ru. Редактор статей там совсем другой: в html нельзя сочинять, там другие типы элементов. Поэтому создать подобный верстальщик для этого сайта сложнее. Но с командой ПИКС Робототехника, специализирующейся на программных роботах, нам это удалось. Подробности под катом!
Используйте навигацию, если не хотите читать весь текст:
→ Ретроспектива
→ Специфика редактора публикаций на vc.ru
→ Преобразование документа Google в макет
→ Сервисная архитектура
→ Итоги и планы на будущее
Содержание
Ретроспектива
Давным-давно
Когда я пришел в Selectel в 2022 году, моя тогдашняя девушка и нынешний менеджер Ульяна попросила меня собрать статистику о нашей активности на Хабре и нескольких интересующих нас блогах. Эти данные невозможно собрать в Google Analytics и Qlik Enterprise, поэтому я решил создать отдельный дашборд. И вместо того, чтобы автоматизировать этот процесс, я решил делать все вручную, отслеживая изменения на сайте с заданной периодичностью.
Естественно, что так много данных не соберешь: это скучно, к тому же максимально неточно. Поэтому нужно было все-таки автоматизировать этот процесс. А через несколько недель мы уже собираем данные с помощью самописной программы SeleStat. По сути, это обычный анализатор для генерации статистики по выбранным хабраблогам.
Не так давно
Через некоторое время возникла необходимость унифицировать верстку статей по стилю, а также хотелось сократить время, затрачиваемое на рутинные задачи при подготовке материалов к публикации. Подробнее об этом в
.
В общем, чтобы больше сосредоточиться на серьезных задачах и точнее планировать публикации, мы разработали простенькую программу для конвертации статей из Google docs на Хабр. По сути, это простой текстовый процессор, который значительно упрощает жизнь авторам нашего блога.
Кроме того, у нас автоматизирована постановка задач профильным отделам в Jira, чтобы вы не забыли, например, заказать обложки и текстовые схемы у дизайнеров. Но это тема для отдельной статьи, скорее о налаживании процессов в письменной форме, о которых можно говорить @лодз.
Сегодня: зачем конвертер статей на vc.ru
Каждую неделю мы делаем два-три поста на vc.ru, что составляет примерно треть постов на внешних площадках. Ручная верстка занимает в среднем до 1 часа 30 минут: текст должен быть правильно отформатирован, добавлены специальные элементы и utm-теги. А если смотреть в разрезе квартала, то макет может занять до 50 часов рабочего времени.
По этой причине мы решили создать версию инструмента верстки статей для vc.ru. Но была проблема: редактор этого сайта сильно отличался от редактора статей на Хабре. Поэтому мы не могли просто взять существующую программу и использовать ее. Нужно было вникнуть в специфику vc.ru и разработать что-то новое.
Специфика редактора публикаций на vc.ru
Как бы странно это ни звучало, нам лучше, когда редактор статей менее интерактивен и отзывчив. Потому что такие интерфейсы, наполненные меню, разными блоками и прочими элементами, все еще представляют собой сложный JavaScript. Это означает, что невозможно написать программу, которая будет «бездумно» копировать и вставлять текст в заданные текстовые поля.
Вам нужно имитировать действия человека — от создания поста и простейшего ввода текста до работы со сложными элементами. Последнего на vc.ru достаточно: есть ссылки, произвольные цитаты, списки, вставки кода, различные блоки для медиаэлементов и т.д.
Если вы можете написать программу для создания статей на vc.ru с использованием таких библиотек, как Selenium, пришлите нам свое резюме. У нас не было ресурсов, чтобы построить такое решение с нуля. Поэтому мы обратились в PIX Robotics — и вместе написали робота на платформе PIX RPA.
ПИКС РПА интерактивный инструмент для разработки программных роботов для решения различных рутинных задач. Создание роботов происходит в студии разработки ПикСтудиокоторый предназначен как для разработчиков, так и для профессиональных пользователей: роботы могут быть запрограммированы в построчном формате или с использованием практических блок-схем.
В список готовых активностей входят задачи по работе с офисными программами, сайтами, бизнес-приложениями и мессенджерами. Вы также можете использовать сервисы распознавания и чат-боты.
Преобразование документа Google в макет
Интерпретатор и язык разметки
У нас уже был достаточно неплохой конвертер статей из Google docs в html, который позволял получить код макета для Хабра — набор строк с гипертекстовым описанием различных элементов. Мы хотели переиспользовать его с минимальными изменениями для vc.ru, чтобы робот составлял статьи по этому коду. В противном случае следует написать новый интерпретатор.
По сути, наш интерпретатор просто декодирует теги span в загруженном документе Google, переводит их в простые теги форматирования — i, b, s — и добавляет специальные элементы.
Для сложных элементов, таких как ссылки и вставки кода, предусмотрен специальный язык разметки — STML, Selectel Text Markup Language. Мы используем его при написании статей в Google Docs.
Документация в Confluence, правила форматирования текста.
В результате интерпретатор возвращает правильно размеченный html-код. Например, для всех ссылок на страницы товаров в коде прописаны utm-теги.
Код для верстки текста в формате html.
Повторители маяков
Результат работы переводчика практически всегда предсказуем. Мы знаем, что если элемент помечен как
Заголовок 1
на выходе будет такая строка:
<font cоlor="#EB4247"><h2>Заголовок</h2></font>
Также робот понимает html-разметку и решает обратную задачу: транскрибирует сгенерированный интерпретатором код в элементы макета на vc.ru.
Правила расшифровки HTML-кода для робота-верстальщика.
Все правила описаны в отдельных файлах проекта в PIX Studio — от нажатия комбинаций клавиш до сложных действий вроде вызова элементов. Он может перемещаться по интерактивному интерфейсу vc.ru не только с помощью xPath, но и с помощью встроенного модуля машинного зрения. Он помогает роботу находить нужные элементы на веб-странице и взаимодействовать с ними при необходимости.
Сервисная архитектура
Раньше все сервисы, которые мы разрабатывали с коллегами для автоматизации рабочих задач, были в виде десктопных приложений. Неудобно: после каждого патча приходится присылать обновления, следить за совместимостью версий и прочие нюансы. Поэтому мы переводим все сервисы, в том числе и робота по верстке статей на vc.ru, в облако.
Давайте посмотрим, как это работает с точки зрения архитектуры:
1.
Интерфейс маркетингового облака.
Сотрудник получает сервисный аккаунт, авторизуется в облаке, которое мы строим на базе
, и открывает редактор макета статьи. Затем настраивает параметры макета, скачивает zip-архив с изображениями и самой статьей.
2.
Преобразователь и хранилище объектов.
Серверная программа распаковывает zip-архив и генерирует html-код для статьи. Но как насчет медиафайлов?
Раньше мы загружали все изображения для облачных постов на хабрахранилище, но теперь пытаемся отойти от этого. Поэтому все медиа загружаются через API на наш хранилище объектов.
3.
Робот на базе ПИКС РПА.
После создания кода статьи он отправляется на другой виртуальный сервер через SMTP/IMAP. Там запускается робот, который получает файл, запускает Chrome, заходит на vc.ru, создает пост и начинает составлять.
Последнее занимает от 20 до 30 минут: робот имитирует все действия человека. Пока верстка не закончена, можно пойти попить чаю или заняться другими делами, а потом опубликовать статью.
При этом робот работает в фоновом режиме на удаленной машине с Windows Server. То есть обычный пользователь не видит самого процесса, а в конце раскладки получает простое уведомление. Но у нас есть возможность открыть шторку — вот как это работает:
Итоги и планы на будущее
Сегодня мы уже используем робота для составления текстов на vc.ru и тестируем его возможности. Это позволяет нам тратить на этот процесс минимум времени и не забывать о нюансах — например, прокладке utm-меток. Также мы активно улучшаем интерфейс Marketing Cloud для более удобной работы с ботом.
Мы планируем и дальше развивать собственное облако и сервисы. Среди них инструменты для анализа рассылок, работы с SEO, формирования внутренних электронных документов и др. Мы будем держать вас в курсе — следите за обновлениями в нашем блоге!
Эти тексты также могут вас заинтересовать:
