Опыт использования платформы OutSystems в компании JazzTeam

11 мая, 2020 Технические статьи

Введение

OutSystems – это надежная и гибкая low-code платформа для разработки корпоративных мобильных и веб-приложений, которые разворачиваются в локальной или в гибридных средах.

Low-code платформа LCDP (low-code development platform) – это программное обеспечение, которое предоставляет программистам среду для создания прикладных приложений через графический интерфейс и различные конфигурации вместо традиционного программирования. LCDP сокращают объем традиционного ручного кода, обеспечивая ускоренную разработку, установку и развертывание приложений. Общим преимуществом является то, что LCDP имеют более мягкую кривую обучения, чем большинство языков программирования и, соответственно, более широкий круг людей может поучаствовать в разработке.

Преимущества OutSystems

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

Высочайшая скорость разработки. С помощью визуального программирования можно очень быстро создавать полнофункциональные приложения, а затем одним кликом отправлять их на сервер.
Интеграция со всем. OutSystems дает возможность эффективно сопрягать свои приложения с любой средой. Платформа генерирует все методы и структуры данных для интеграции со службами SOAP и REST и системами SAP. Изначально есть связь с основными системами баз данных: SQL Server, SQL Azure, Oracle, MySQL и DB2 iSeries. В OutSystems Forge доступны коннекторы для самых популярных облачных сервисов, хранилищ и социальных сетей.
Отличный UI/UX по умолчанию. Наличие большого числа красивых и готовых к использованию шаблонов пользовательского интерфейса, превосходная производительность, многофункциональный drag-and-drop редактор.
Код без ограничений. Можно расширить как front-end, так и back-end приложения с помощью собственного кода.
Отличная вертикальная и горизонтальная масштабируемость. Легкое добавление дополнительной вычислительной мощности и интерфейсных серверов в любую производственную среду, что помогает добиться высокой доступности при увеличении пользовательской нагрузки, сложности бизнес-логики, объема пакетной обработки либо количества транзакций.

Практика работы JazzTeam с платформой OutSystems

Компания JazzTeam активно использует платформу OutSystems как для обучения, так и в коммерческой разработке.

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

Система управления компьютерными клубами

Система включает в себя:

десктопное приложение под Windows (устанавливается на клиентские машины; web-приложение для администратора клуба; набор web-сервисов для синхронизации и обмена данными между клиентскими машинами и серверами. Среди нетривиальных технических задач, решенных в процессе разработки этой системы, можно выделить, например, закрытие “мертвых” сессий пользователя, организация сетевых соединений через websocket протокол.
мобильное приложение для администратора компьютерного клуба. При проектировании были использованы богатые возможности платформы OutSystems для быстрой разработки мобильных приложений. Как результат — полный цикл разработки занял существенно меньше времени, при гарантированном качестве кода. При этом UI отвечает современным тенденциям в мире мобильных приложений.

Web-приложение для аудита финансовых операций

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

Обучение

Компания JazzTeam разработала и успешно применяет систему обучения и сертификации инженеров-разработчиков продуктов на платформе OutSystems. Эта система эффективно используется внутри компании для подготовки профессионалов в относительно короткий срок.

Интересный опыт

Создание WebSocket соединения

Для создания WebSocket соединения можно воспользоваться внешним сервисом https://pusher.com/, который предоставляет WebSocket сервер и API для работы с ним. В Forge выложен модуль https://www.outsystems.com/forge/component/1493/pusher-com-apis/ — который, предоставляет Server Actions и веб компоненты для работы с pusher.com.

PusherPublish — Server Action, который позволяет опубликовать сообщение в определенном канале WebSocket сервера, чтобы распространить его среди подписчиков.

PusherSubscribe — UI компонента, позволяющая прослушивать канал (название канала указывается в аргументах) на появление определенных событий (тип ивентов указывается в аргументах компоненты). При появлении события вызовется указанный в параметрах Screen Action.

Прикладным примером использования WebSocket соединения может послужить runtime обновление веб-страницы или веб-блока на ней. Пользователь открывает страницу, в тело которой внедрен PusherSubscribe прослушивающий канал. В Preparation страницы создается таймер, который запускает Server Action. В этом Server Action вызывается PusherPublish, который выполняет Screen Action страницы. В Screen Action загружаются измененные данные на странице.

JS-функция setInterval() внутри поля таблицы

Смоделируем ситуацию. Задача: в качестве значения поля таблицы отобразить веб-блок, состоящий из функции setInterval() и контейнера (значение которого заполняется из этой функции). Здесь может возникать проблема: отображается только значение последней строки таблицы.

Природа проблемы: при вызове контейнера из setInterval(), мы обращаемся используя

id = document.getElementById('" + displayContainer.Id +"')

Все контейнеры будут иметь эквивалентные id и если мы обращаемся через DOM-модель документа, мы будет обращаться только к последнему веб-блоку.

Вариант решения. Изменение id контейнера внутри JS функции, и передача нового id как аргумента внутрь функции (которая является первым аргументом функции setInterval()).

Пример (один из вариантов инициализации uniqId — сделать глобальную переменную, которая будет при инициализации веб-блока инкрементировать значение uniqId):

let displayContainerId = ' displayContainer' + uniqId;      
document.getElementById('" + displayContainer.Id + "').setAttribute('id', displayContainerId);    
let interv = setInterval(   
   function() {
      render(startDuration, displayContainerId);
   },
   1000);

Time Zones

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

В зависимости приложения добавляем модуль Time Zone. Далее с помощью JS, скрытого Input и двух кнопок определим TimeZone юзера:

"<script>
$(document).ready(function() {
  if(Intl.DateTimeFormat().resolvedOptions().timeZone != undefined)
  {
    $('#" + TzInput.Id +
      "').val(Intl.DateTimeFormat().resolvedOptions().timeZone);
    $('#" + IanaBtn.Id + "').click();
  } else {
    $('#" + TzInput.Id + "').val(new Date().getTimezoneOffset());
    $('#" + OffsetBtn.Id + "').click();
  }
});
</script>"

К кнопке IANA привязано действие GetIANATimeZone (из модуля Time Zone) с входным параметром Tz. К кнопке Offset — GetSystemTimeZones. Проходя циклом по GetSystemTimeZones.TimeZones, проверяем условие GetSystemTimeZones.TimeZones.Current.TimeZone.UtcOffset = Tz и, если оно истинно, то искомый TimeZone: GetSystemTimeZones.TimeZones.Current.

Текущий TimeZone.Identifier юзера можно хранить в Session Property, а лучше во вспомогательной Entity с идентификатором User Identifier.

Для вывода значения время прописываем следующую функцию: ConvertFromTimeZone(DateTimeToDisplay, GetCurrentTimeZone(), Visitor.TimeZoneId), для форматирования можно обернуть в функцию FormatDateTime.

Email validation

Несмотря на обилие встроенных функций и возможностей, порой перед их использованием стоит прочесть документацию или заглянуть на форум, так как можно столкнуться с поведением, которого не ожидаешь. К примеру, в OutSystems есть тип данных Email и, соответственно, функция для его валидации, но полагаться на нее не стоит. Экспериментальным путем было выяснено, что валидными будут адреса, где есть символы до и после @ (1@1), равно как и пустая строка. Это можно легко исправить, написав extension на С#, либо посредством внутренней логики (например, Regex_Search).

Charts API

Charts API — это встроенный инструмент для работы с графиками, базирующийся на внешнем ресурсе Highcharts. В документации родительского компонента даны описания всех элементов, классов, методов, параметров и функций, встречающихся при работе с различными видами графиков, что дает возможность более свободно кастомизировать диаграммы и графики, а, возможно, и строить зависимости непредставленные в OutSytems. К примеру, с помощью JSON форматирование по правила Highcharts, можно сразу задать все элементы и получить необходимый график, используя всего один экшен.

jQuery plugins

Платформа достаточно легко позволяет подключить jQuery plugins, библиотека которых в сети весьма велика. С их помощью можно расширить и разнообразить наполнение приложения. Для этого нужно прочесть readme и верно подключить необходимые компоненты кода. На сайте OutSystems есть инструкция.

Авторизация в REST-запросах

Некоторые REST сервисы требуют авторизацию, в которой сочетание логин + пароль (api-ключ + секретный ключ) должны быть закодированы в base64.

Пример — Twitter API. При выполнении основных запросов Twitter API требует в авторизации Bearer-токен. Для его получения необходимо отправить запрос токена, где в поле Authorization необходимо передавать закодированные в base64 api-key и secret-key. Для начала необходимо подключить в зависимостях функции TextToBinaryData и BinaryToBase64 из модуля BinaryData. Затем кодируем строку «ApiKey:ApiSecretKey» с помощью TextToBinaryData, а результат передаем в BinaryToBase64. В REST-запросе токена в заголовке Authorization прописываем «Basic » + BinaryToBase64.Base64. В ответ приходит access_token, который можно использовать в дальнейших запросах в Authorization: «Bearer » + access_token.

Заключение

Outsystems заслуженно находится среди лидеров в списках:

“The Forrester Wave™: Low-Code Development Platforms For AD&D Pros, Q1 2019”
“Gartner Magic Quadrant for MXDP (Multiexperience Development Platforms)”

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

Рисунок 1. Пример действия Preparation, выполняемого перед отрисовкой Веб-блока

Рисунок 2. Пример работы с С#, расширение для валидации типа данных email

Используемые ссылки

LCDP, WebSocket, Time Zone, Charts API, техническая статья, jQuery, OutSystems, low-code

Отмечаем 8 Марта: твой Звёздный час настал! Опыт интеграции VoIP в Salesforce