Конструктор мобильного приложения bitrix

Обновлено: 27.04.2024

Для расширения функциональности Bitrix24 удобно использовать приложения. В данной статье описано создание с нуля локального serverless приложения.

Для установки нашего приложения нам понадобится собственно портал bitrix24, в котором мы обладаем правами администратора или правом установки и редактирования приложений.

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

Выбираем пункт Для личного использования . После нажатия кнопки Добавить мы попадаем в диалог создания приложения.

Заполняем следующие поля: Название поля Значение
Название приложения* exampleApp Или любое другое
Russian (ru) Пример приложения Также можно заполнить значения для других нужных языков
Пользователи (user) отмечаем галочкой Сейчас нам понадобится только это разрешения, но в дальнейшем разрешения для приложения можно будет корректировать

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

Официальная javascript-библиотека

Создадим папку с произвольным названием и в ней единственный пока файл index.html со следующим содержанием (исходный код):

Помещаем файл index.html в zip-архив и указываем этот архив в качестве значения поля Загрузите архив с вашим приложением (zip)* в диалоге создания приложения.
Затем нажимаем кнопку "Сохранить"


Посмотрим, что у нас получилось.


Кликаем по Перейти к приложению и видим… пустое место на месте нашего приложения.

Все необходимое для нас на данном этапе находится сейчас в консоли разработчика.

Мы видим, что наше приложение успешно получило данные необходимые для авторизации.

Официальная javascript-библиотека c promise

Использование callback-функций имеет свои преимущества, но не всем нравится или не всегда подходит к ситуации.
Поэтому попробуем получить тот же результат в promise-стиле. Для этого изменим наш index.html (исходный код)


Неофициальная библиотека BX24

Если вы планируете писать приложение на typescript (можно использовать и с javascript) и/или обладаете умеренным авантюризмом, то можно попробовать использовать сторонние библиотеки для авторизации.
Например эту.
В этом случае наш index.html нужно будет изменить следующим образом (исходный код):

Опять архивируем, опять обновляем наше приложение, опять смотрим, опять все работает.

Инструменты разработки

Полагаю, что к этому времени вы уже достаточно устали от процедуры архивирования и обновления приложения.
Попробуем сделать процесс разработки чуть более удобным и быстрым.
Для этого нам понадобится nodejs .
Проверить его наличие на компьютере можно выполнив:

В папке нашего проекта инициализируем npm:

Установим необходимые пакеты:

Можно аналогично создать проект с помощью create-react-ap или angular-cli .

Состояние проекта после всех изменений можно посмотреть здесь.

Создадим в корне нашего проекта файл server.js

Создадим папки src и public
В папку public перенесем index.html и изменим его содержимое на:

В папке src создадим файлы

Добавим скрипты в package.json :

Далее так как и команда start и команда watch не заканчиваются, их нужно запускать параллельно. Для этого в двух командных строках запускаем

Перейдите к просмотру вашего приложения:
Вы должны увидеть приветствие с именем текущего пользователя:


Если использовать официальную библиотеку, то отличаться будут только два файла:

Итоговый код проекта для использования официальной библиотеки здесь.

Ознакомиться со всеми возможными методами и возможностями API можно здесь.

Исходный код можно увидеть здесь.

И последнее замечание. Описанные выше способы и методы не являются набором лучших практик. Это скорее предложение к конструктивному обсуждению.

UPD: желающих высказаться о 1С-Битрикс или Битрикс24 прошу сделать небольшое интеллектуальное усилие и осознать, что статья не о Битрикс24 и совсем не о 1С-Битрикс.
Это если в Питере прохожий объясняет другому, как пройти к Петропавловской крепости и тут третий вмешивается с репликой:
"Да тиран был ваш Петр I. Тиран и деспот. И усы у него дурацкие".

Если есть конструктивные замечания к коду в СТАТЬЕ или к подходам или к используемым паттернам — добро пожаловать.

Гибридные мобильные приложения имеют доступ к функциям смартфона:

  • GPS;
  • Информация об устройстве;
  • Акселерометр;
  • Файловая структура;
  • Адресная книга.

BitrixMobile прибавляет к этим возможностям широкий набор нативных интерфейсов, чтобы приложение работало быстрее и выглядело привычнее для пользователя. Разработка ведется полностью на HTML5/Javascript/CSS. Взаимодействие с функциями телефона и нативным интерфейсом осуществляется через функции специальной JS-библиотеки - BXMobileApp.

В рамках данного курса будут подробно рассмотрены возможности библиотеки BXMobileApp, которая позволяет создавать сложные бизнес-приложения на BitrixMobile.

Баллы опыта

В конце каждого урока есть кнопка Прочитано! . При клике на неё в Вашу итоговую таблицу опыта добавляется то количество баллов, которое указано в прочитанном После нажатия кнопки Прочитано! появится
окно подтверждения:


уроке.

Периодически мы заново оцениваем сложность уроков, увеличивая/уменьшая число баллов, поэтому итоговое количество набранных Вами баллов может отличаться от максимально возможного. Не переживайте! Отличный результат - это если общее число набранных Вами баллов отличается от максимального на 1-2%.

Для изучения оффлайн

iPhone:
FBReader
CoolReader
iBook
Bookmate

Windows:
Calibre
FBReader
Icecream Ebook Reader
Плагины для браузеров:
EpuBReader – для Firefox
Readium – для Google Chrome

iOS
Marvin for iOS
ShortBook
обновляются периодически, поэтому возможно некоторое отставание их от онлайновой версии курса. Версия файла - от 15.12.2020.

Если вы нашли неточность в тексте, непонятное объяснение, пожалуйста, сообщите нам об этом в комментариях.

Гибридные мобильные приложения имеют доступ к функциям смартфона:

  • GPS;
  • Информация об устройстве;
  • Акселерометр;
  • Файловая структура;
  • Адресная книга.

BitrixMobile прибавляет к этим возможностям широкий набор нативных интерфейсов, чтобы приложение работало быстрее и выглядело привычнее для пользователя. Разработка ведется полностью на HTML5/Javascript/CSS. Взаимодействие с функциями телефона и нативным интерфейсом осуществляется через функции специальной JS-библиотеки - BXMobileApp.

В рамках данного курса будут подробно рассмотрены возможности библиотеки BXMobileApp, которая позволяет создавать сложные бизнес-приложения на BitrixMobile.

Баллы опыта

В конце каждого урока есть кнопка Прочитано! . При клике на неё в Вашу итоговую таблицу опыта добавляется то количество баллов, которое указано в прочитанном После нажатия кнопки Прочитано! появится
окно подтверждения:


уроке.

Периодически мы заново оцениваем сложность уроков, увеличивая/уменьшая число баллов, поэтому итоговое количество набранных Вами баллов может отличаться от максимально возможного. Не переживайте! Отличный результат - это если общее число набранных Вами баллов отличается от максимального на 1-2%.

Для изучения оффлайн

iPhone:
FBReader
CoolReader
iBook
Bookmate

Windows:
Calibre
FBReader
Icecream Ebook Reader
Плагины для браузеров:
EpuBReader – для Firefox
Readium – для Google Chrome

iOS
Marvin for iOS
ShortBook
обновляются периодически, поэтому возможно некоторое отставание их от онлайновой версии курса. Версия файла - от 15.12.2020.

Если вы нашли неточность в тексте, непонятное объяснение, пожалуйста, сообщите нам об этом в комментариях.

Гибридные мобильные приложения имеют доступ к функциям смартфона:

  • GPS;
  • Информация об устройстве;
  • Акселерометр;
  • Файловая структура;
  • Адресная книга.

BitrixMobile прибавляет к этим возможностям широкий набор нативных интерфейсов, чтобы приложение работало быстрее и выглядело привычнее для пользователя. Разработка ведется полностью на HTML5/Javascript/CSS. Взаимодействие с функциями телефона и нативным интерфейсом осуществляется через функции специальной JS-библиотеки - BXMobileApp.

В рамках данного курса будут подробно рассмотрены возможности библиотеки BXMobileApp, которая позволяет создавать сложные бизнес-приложения на BitrixMobile.

Баллы опыта

В конце каждого урока есть кнопка Прочитано! . При клике на неё в Вашу итоговую таблицу опыта добавляется то количество баллов, которое указано в прочитанном После нажатия кнопки Прочитано! появится
окно подтверждения:


уроке.

Периодически мы заново оцениваем сложность уроков, увеличивая/уменьшая число баллов, поэтому итоговое количество набранных Вами баллов может отличаться от максимально возможного. Не переживайте! Отличный результат - это если общее число набранных Вами баллов отличается от максимального на 1-2%.

Для изучения оффлайн

iPhone:
FBReader
CoolReader
iBook
Bookmate

Windows:
Calibre
FBReader
Icecream Ebook Reader
Плагины для браузеров:
EpuBReader – для Firefox
Readium – для Google Chrome

iOS
Marvin for iOS
ShortBook
обновляются периодически, поэтому возможно некоторое отставание их от онлайновой версии курса. Версия файла - от 15.12.2020.

Если вы нашли неточность в тексте, непонятное объяснение, пожалуйста, сообщите нам об этом в комментариях.

На сайте Битрикс есть продукт "битрикс мобильное приложение"? Интересует,
1) Можно ли с его помощью делать мобильные приложения любой сложности? Если нет, то почему? И если можно, то какой сложности?
2) И что из себя представляет это приложение? На каком языке пишется это приложение и в чем будет отличие от родного языка Java или Objective-С?

Простой 2 комментария

longclaps

babarun

Suntechnic

Грубо говоря мобильное приложение битрикс это браузер без адресной строки с доступом к некоторым функциям платформы из js.
Какую вы мобильную версию запилите на сайте - такой сложности и будет ваше приложение. И да - сложность может быть любой, так как js тьюринг-полный язык ;)

А эта мобильная версия сайта без адресной строки компилируется в приложение? Или грубо говоря на смартфоне будет запущен некий процесс, через который и будет работать приложение?

Suntechnic

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

По сути это оно и есть, только в этом приложении вы сами можете указать базовый url вашего приложения на сайте и пуш уведомления здесь будут рабоать чуть не так, а вообще это почти то же самое что вам скомпилят в битрикс в итоге под ваш сайт. Эта приблуда как раз для разработки.

Читайте также: