PWA на Flutter: один код вместо трёх приложений для агентов и клиентов

PWA на Flutter даёт один код для веб-версии и установки на телефон: сотрудники и клиенты открывают ссылку, добавляют значок на экран и работают без магазинов приложений. Обновления выходят сразу после публикации, а не после модерации. Для заказов, заявок и учёта в 1С этого хватает.

Почему возникает путаница с тремя приложениями вместо одного 📱

Понедельник, девять утра. Коммерческий отдел оптовой компании загрузил в 1С новый прайс. Android-версия приложения для агентов обновилась ещё вечером, а iOS-версия застряла на проверке в магазине. Поэтому агенты с iPhone принимают заказы по старым ценам, и к обеду бухгалтерия вручную правит накладные.

Это типичный итог заказа «приложение для торговых агентов»: подрядчик пишет отдельно под iOS, отдельно под Android, а веб-кабинет для клиентов отдаёт третьей команде или откладывает на потом. Три кодовые базы, три набора ошибок, три релиза. Правку в форме заказа вносят трижды, но проверяют обычно на одном телефоне, поэтому на втором поле «Скидка» тихо пропадает. Сюда добавляется аккаунт разработчика Apple, оплата которого из России давно превратилась в отдельную задачу.

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

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

Как исправить ситуацию: что даёт PWA на Flutter ✅

PWA — это веб-приложение, которое ставится на экран телефона значком, запускается без адресной строки и кэширует себя. Flutter — фреймворк Google: из одного проекта на языке Dart он собирает веб-версию, приложения для Android и iOS. Вместе они закрывают все платформы одним кодом.

Обновления без магазина

Разработчик публикует новую версию на сервере, а при следующем запуске приложение подтягивает её через service worker. Агентам не нужно ставить обновления, вам не нужно ждать модерацию. Установка занимает несколько касаний: пользователь открывает ссылку и добавляет значок на экран. На iPhone это делается через Safari: «Поделиться», затем «На экран Домой».

Офлайн и push-уведомления

Service worker кэширует каркас приложения, поэтому оно открывается и в подвале склада, и на выезде без связи. Справочники и заказы лежат в локальной базе устройства: заказ сохраняется на телефоне и уходит в 1С, когда появляется сеть. Очередь отправки пишут внутри приложения, готовой настройки в браузере для неё нет. Push-уведомления работают на Android в Chrome и на iPhone с iOS 16.4, но только если пользователь добавил приложение на экран.

Связка с 1С

Приложение обращается к базе 1С через HTTP-сервисы: читает остатки, цены и контрагентов, создаёт заказы. Данные не дублируются, 1С остаётся единственным источником. Как устроен обмен, описано на страницах про интеграцию приложения с 1С и B2B-приложение с 1С.

Почему именно Flutter

Адаптивный сайт тоже открывается на телефоне, но не ставится значком, плохо работает без связи и выглядит как сайт. Flutter даёт интерфейс одинакового вида на iPhone, Android и в десктопном браузере, а когда понадобится нативная сборка, значительная часть кода переиспользуется. Если сегодня хватает PWA, а через год понадобится сканер по Bluetooth, переписывать всё с нуля не придётся.

Что выбрать: PWA на Flutter, нативное приложение или 1С:Мобильная платформа

Универсального ответа нет. Вариант зависит от оборудования, которое нужно приложению, и от того, кто его будет открывать.

Если конфигурация 1С уже настроена и нужен мобильный клиент именно к ней, посмотрите разработку на 1С:Мобильной платформе. Если нужны заказы, заявки, кабинеты клиентов и уведомления на любых телефонах, PWA на Flutter ставится по ссылке и не требует публикации в магазинах.

Что делать, если PWA упирается в ограничения платформы ⚠️

Кладовщик подключает к iPhone беспроводной Bluetooth-сканер, открывает PWA, а приложение сканер не видит. Safari не поддерживает Web Bluetooth, поэтому прямая связь со сканером через браузер на iPhone не работает. В итоге артикулы вводят руками, отгрузка идёт медленнее, а опечатки доходят до клиента.

Решение зависит от оборудования. Сканеры, которые подключаются как клавиатура, работают в PWA без доработок. Камера телефона читает штрихкоды и QR-коды. Если нужен именно Bluetooth, NFC или фоновая работа, из того же Flutter-проекта собирают нативную версию для Android и публикуют в RuStore или раздают файлом. Основная часть кода и экранов сохраняется, работу с оборудованием дописывают отдельным слоем.

Поиск и первая загрузка

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

Когда PWA не подходит

Фоновое отслеживание маршрута агента при закрытом приложении PWA на iPhone не ведёт. Публичное приложение для массового потребителя, которое должны находить в магазинах, тоже лучше выпускать нативным. Для сотрудников, дилеров и постоянных B2B-клиентов эти ограничения встречаются редко.

Как предотвратить переделки: что проверить до старта проекта 🔍

Переделки начинаются с вопросов, которые не задали в первую неделю. Пять проверок до начала работы.

1. ✓Составьте список устройств: сколько пользователей на iPhone, сколько на Android, какие версии iOS. Push на iPhone требует iOS 16.4 и новее.
2. ✓Выпишите все обращения к оборудованию: сканеры, принтеры этикеток, NFC-метки, фоновый GPS. Если хотя бы одно из них критично, закладывайте нативную сборку сразу.
3. ✓Опишите офлайн-сценарии: какие справочники нужны без связи, как долго данные считаются актуальными, что происходит, если два агента заказали последний товар со склада.
4. ✓Решите, где хранятся данные. Если приложение собирает ФИО и телефоны клиентов, действует 152-ФЗ: персональные данные граждан России записывают и хранят в базах на территории страны.
5. ✓Проверьте 1С: версию конфигурации, опубликована ли база через веб-сервер, выдержит ли сервер запросы приложения вместе с живыми пользователями. Ориентир по ресурсам даёт страница с системными требованиями 1С.

После проверок запустите пилот на небольшой группе агентов с одним сценарием, например приёмом заказов. На пилоте видно, где приложение упирается в оборудование или в скорость 1С, и это обходится дешевле, чем узнавать то же самое после полной разработки.

Сколько стоит PWA на Flutter и чем наш подход отличается 💼

Разработка мобильных приложений в ukved.ru стоит от 500 000 ₽. Итоговую цену определяют число ролей и экранов, офлайн-сценарии и объём обмена с 1С. Точную сумму называем после разбора сценариев.

Отличие в том, что 1С и приложением занимается одна команда. Мы пишем HTTP-сервисы на стороне 1С и клиентскую часть на Flutter, поэтому не возникает спора, чья сторона тормозит обмен: подрядчик по приложению или фирма, которая обслуживает 1С.

Второй частый источник проблем — сама база. Если она работает на слабом офисном компьютере, приложение подвисает вместе с ней, особенно когда в девять утра бухгалтерия открывает месяц, а агенты одновременно запрашивают остатки. Базу можно перенести на арендованный сервер: в тарифах сервер 1С стоит от 1 100 ₽/мес за пользователя.

Начните с одного сценария: приём заказов от агентов в PWA, подключённой к вашей 1С. Он покажет и ограничения, и выгоду на реальных данных, а остальные роли добавляются к нему без переписывания.

❓ Частые вопросы

Что такое PWA на Flutter простыми словами?

PWA — это веб-приложение, которое устанавливается на экран телефона и запускается как обычное приложение. Flutter позволяет написать его на одном языке, Dart, и собрать из того же проекта версии для браузера, Android и iOS. Сотрудник открывает ссылку, добавляет значок и работает без магазина приложений.

Работает ли PWA на iPhone?

Работает. На iPhone PWA устанавливается через Safari: «Поделиться», затем «На экран Домой». Push-уведомления доступны с iOS 16.4 и только для приложения, добавленного на экран. В Safari нет Web Bluetooth и Web NFC, а фоновое отслеживание геопозиции невозможно. Для таких задач нужна нативная сборка из того же Flutter-проекта.

Можно ли подключить PWA на Flutter к 1С?

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

Сколько стоит разработка PWA на Flutter?

Мобильная разработка в ukved.ru стоит от 500 000 ₽. Итоговую сумму определяют число ролей и экранов, офлайн-сценарии и объём обмена с 1С. Точную цену мы называем после разбора ваших сценариев. Если позже понадобится нативная сборка, основная часть кода из Flutter-проекта сохраняется.

Нужно ли выкладывать PWA в App Store или RuStore?

Нет. PWA открывается по ссылке или QR-коду, магазин и модерация не нужны. Если для клиентов важно найти приложение в RuStore или Google Play, из того же Flutter-проекта собирают нативную версию и публикуют её отдельно. Выбор зависит от аудитории: для сотрудников и постоянных B2B-клиентов обычно хватает ссылки.