Разработка мобильного и веб-интерфейса для

InterSystems Caché

Лебедюк Эдуард

• Сервер

• Клиент-серверное взаимодействие

• Клиент

План

Сервер Организация API взаимодействия с данными

Организация API

Данные

Терминальное API

Web API

Клиент

• Взаимодействие с данными

• Данные не должны изменяться иначе, чем через это API

• Возвращают объекты или статус

• Не пишут на устройство

Особенности

Терминальное API

• Преобразуют входящий запрос в форму, понимаемую терминальным API

• Вызывают методы терминального API

• Отправка результата выполнения терминального API клиенту

• Не взаимодействуют с данными напрямую

Особенности

Web API

• Терминальное API является основой логики приложения

• Функция Web API – преобразование запросов клиента в форму понятную

терминальному API и возврат клиенту результатов исполнения запроса

• Преимущества этого подхода:

– API выполняющие разные функции максимально разделены

– Возможна отладка вне веб-контекста

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

Разделение API

Клиент-серверное взаимодействие REST, WebSockets, JSON

• Серверной генерации статического HTML

О чём не будем говорить

План

• REST

• WebSockets

• JSON

О чём будем говорить

• Стиль архитектуры программного обеспечения для распределенных систем,

таких как World Wide Web

• Как правило используется для построения веб-служб

• Любые данные однозначно определяется URL – это значит, что URL по сути

является первичным ключом для единицы данных.

– https://server:80/webapp/book/:bookid

REST

Разделение клиента и сервера

Независимость от состояния (stateless)

Кэшируемая и многоуровневая архитектура

Единый интерфейс

Все запросы к RESTful web API состоят из корневого URL приложения плюс

частные подзапросы

• CRUD (Create , Read, Update, Delete) через HTTP

Принципы

REST

Независимость от языка/фреймворка/платформы

Клиентs на Java, JS, .Net и т.д.

Легкость разработки

Проще чем SOAP

Нет необходимости в специальных инструментах

Соответствует дизайну и принципам Web

Нет необходимости в дополнительных сообщениях

Легковесность

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

REST

• Стандартная реализация – наследуется от %CSP.REST

• Дополнения – на https://github.com/intersystems-ru/REST

– Поддержка русского языка (любой не-латиницы)

– Полная поддержка JSON

– Валидация запросов

– Поддержка CORS

– Дополнительная поддержка сессий

– Макросы отладки ($$$Debug, $$$Public и т.д.)

Реализация

REST

• По сути – соответствие запрашиваемых URL методам Caché

• Стандартный вид пути:

<Route

Url="/path/:param1/:param2"

Method="GET"

Call=“Package.Class:ClassMethod"

/>

• ClassMethod – любой метод класса Caché

REST

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

• Перехватывающий прокси-сервер

• Анализатор трафика

Отладка

REST

• Использовать curl

• Использовать wget

• Использовать cli инструменты

Не надо

• Протокол полнодуплексной связи поверх TCP-соединения, предназначенный для

обмена сообщениями между браузером и веб-сервером в режиме реального

времени

• Устанавливается канал связи между клиентом и сервером, по которому

осуществляется двустороннее взаимодействие

• Не является заменой REST (и наоборот), дополняют друг друга

• В Caché – наследуется от %CSP.WebSocket

WebSockets

• Chrome Developer Tools

• Перехватывающий прокси-сервер

Отладка

WebSockets

Наиболее популярный способ передачи данных при работе в REST приложениях

является JSON.

За счёт своей читабельности и удобству обработки на клиенте, по сравнению

с XML, формат JSON может быть более подходящим для представления сложных

данных.

Формат общения клиента и сервера

JSON

{

"firstName": "Иван",

"lastName": "Иванов",

"address":

{

"street": "Арбузная 177. д 3.",

"city": "Новосибирск",

"postalCode": 101101

},

"phoneNumbers": [ "812 123-1234", "916 123-4567" ]

}

• Все JavaScript фреймворки поддерживают json

• Поддержка JSON в Caché начиная с 2014.1

• Начиная 2016.1 поддержка JSON переведена в ядро

• Скорость работы с JSON не хуже чем в node,js

JavaScript Object Notation

JSON

Организация приложения

JSON

REST

WebSockets

COS

Extends %Persistent Данные

Терминальное API

Web API

Клиент

Клиент (веб-приложение) Составляющие, мобильная разработка, отладка

• Современное веб-приложение

• Отладка

• Построение мобильных приложений

План

• CSS фреймворк

• JS фреймворк

• HTML, JS, CSS код приложения

Основа

Современное веб-приложение

• Набор готовых компонентов

• Предоставляют дизайн-шаблоны

• Обеспечивают отзывчивость интерфейса

CSS фреймворк

• Примеры (Twitter Bootstrap, Material Design Lite)

CSS фреймворки

• Упрощение работы с JavaScript (jQuery)

• Работа с DOM (jQuery, AngularJS)

• Получение/передача данных

• Реализация сложных моделей поведения

• Поддержка архитектуры приложения

– MVC (AngularJS, Backbone.js, React)

– MVVM (Kendo UI, Knockoutjs)

– MVP (Ext JS)

Функции

JS фреймворк

MVC

-

• Консоль браузера

– Chrome Developer Tools

• Фреймворк-специфичные отладчики

– AngularJS Batarang

– React Developer Tools

Отладка веб-приложений

• Идея!

– Берём готовое веб приложение

– На его основе генерируем мобильное приложение-браузер с локальной копией сайта

– Предоставляем доступ к своему API, абстрагирующему различные API мобильных

операционных систем

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

– Время разработки (в случае современного веб-приложения) стремится к нулю

– Единство кодовой базы

– Не требуется знание JAVA, Objective C, .Net

• Примеры

– Phonegap

– Sencha Touch

– …

Мобильное приложение на основе веб-приложения

• Набор API для разработки мобильных приложений

• В сочетании с фреймворками для разработки интерфейсов (JQuery Mobile, Dojo,

Angular Mobile UI), позволяет создавать приложения используя лишь HTML, CSS и

Javascript

• Разработчик получает доступ к родным функциям устройства (камера,

акселерометр и т.д.) через JavaScript методы

Cordova / Phonegap

Amazon-FireOS

Android

BlackBerry

FirefoxOS

iOS

Ubuntu

Доступные платформы

Windows

WP8

Bada

Symbian

WebOS

Tizen

Для основной разработки:

Node.js (npm)

Git client

Для компиляции под Android:

Android SDK tools

SDK build-tools, SDK platform-tools, AVD

Набор разработчика

DeepSee Mobile cAdmin

Пример мобильного приложения

Конец