SPA-кабинет и склад без интернета: где веб-приложение уступает мобильному

SPA (Single Page Application) — веб-приложение, которое загружает один HTML-документ, а дальше обновляет содержимое через JavaScript без перезагрузки страницы: интерфейс работает как программа, а не как набор отдельных страниц. Формат подходит для личных кабинетов и CRM с постоянным интернетом, но плохо держит офлайн-работу, доступ к камере и GPS — для склада и выездных сотрудников чаще выбирают нативное или гибридное мобильное приложение.

склад без сигнала: как веб-кабинет обходился компании в потерянных заявках

Оптовый дистрибьютор бытовой химии в Москве сделал для торговых представителей веб-кабинет на 1С: SPA-интерфейс показывал остатки, цены и историю заказов клиента, менеджер вводил заявку прямо с телефона в браузере. На презентации в офисе всё работало гладко — Wi-Fi, монитор, спокойный клиент.

Но в реальных точках продаж картина другая: подсобки продуктовых магазинов и склады строительных баз стоят в подвалах и на первых этажах с толстыми стенами, где LTE ловит одно деление или не ловит вовсе. Экран кабинета зависал на загрузке, форма заказа не сохранялась, а часть JavaScript-кода даже не успевала подгрузиться — SPA рассчитан на то, что сеть есть хотя бы в момент старта.

Менеджеры стали переписывать заявки в блокнот и переносить их в 1С вечером, из офиса. Каждая такая заявка — это повторный ввод, который отнимает у оператора время и добавляет риск ошибиться в артикуле или количестве. За месяц у трёх торговых представителей набралось столько «отложенных» заказов, что бухгалтерия начала находить расхождения между тем, что обещал менеджер клиенту, и тем, что в итоге ушло со склада.

Если оставить всё как есть, компания теряет не сам заказ — он рано или поздно попадёт в базу, — а скорость и точность: клиент ждёт подтверждение дольше конкурента, склад резервирует не то, что нужно, менеджер тратит вечер на ручную сверку вместо следующего визита.

что такое SPA и как это работает технически

Классический сайт при переходе между страницами каждый раз запрашивает у сервера новый HTML. SPA работает иначе: браузер один раз загружает HTML-каркас и JavaScript-бандл, а дальше вся навигация и отрисовка происходят на стороне клиента — фреймворк (React, Vue, Angular) подменяет содержимое блока на странице, а данные подтягивает через запросы к API в фоне.

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

офлайн для SPA: что даёт Service Worker и где предел

Часть проблемы снимает технология PWA (Progressive Web App): Service Worker кеширует статические файлы и последние загруженные данные, значок можно вынести на главный экран телефона, а часть интерфейса откроется даже без сети. Но это работает только для данных, которые уже успели попасть в кеш до потери связи, и по-разному ведёт себя в Safari на iOS и Chrome на Android — Apple исторически ограничивает возможности PWA сильнее, чем Google. Для просмотра каталога это приемлемо, для оформления заявки клиенту, которого менеджер видит впервые, — нет: данных о нём в кеше просто не было.

частое заблуждение: «сделаем адаптивный сайт — и это будет как приложение»

Руководители нередко решают, что адаптивная версия сайта или SPA-кабинет, открытый в браузере телефона, закрывает задачу «сделать мобильное приложение». Внешне это похоже: интерфейс подстраивается под экран, кнопки крупные, работает без установки из магазина. Разница вскрывается не на демонстрации, а через месяц использования.

Браузерная версия не появляется значком на рабочем экране сама по себе — пользователь должен зайти на сайт и вспомнить о нём. Push о поступлении товара на склад браузер на iPhone долгое время не показывал вовсе, а на Android — только пока вкладка или PWA не выгружены системой из памяти. Доступ к камере для фото претензии по браку или к Bluetooth-сканеру штрихкода в браузере ограничен API, которые поддерживает не каждая версия ОС. SPA — качественный веб-интерфейс, а не бесплатная замена мобильному приложению; принять его за такую замену на этапе планирования — и есть та ошибка, из-за которой проект потом переделывают дважды.

SPA, обычный сайт или мобильное приложение — что выдержит склад, а что офис

Три формата решают разные задачи, и путать их — источник историй вроде той, что случилась с дистрибьютором химии.

когда SPA — точный выбор для бизнеса

SPA хорошо работает там, где пользователь сидит за компьютером или планшетом в помещении со стабильным интернетом и держит вкладку открытой подолгу.

• ✓личный кабинет дилера или клиента для заказа товара с компьютера в офисе;
• ✓внутренняя CRM или панель менеджера, где данные из 1С нужны в реальном времени;
• ✓админка для контроля остатков и цен, которую держат открытой весь рабочий день;
• ✓портал для бухгалтерии и логистики с постоянным доступом к сети.

Если веб-кабинет должен показывать остатки и цены из учётной системы в реальном времени, важно на старте продумать саму интеграцию с 1С: через какой сервис идёт обмен, что кешируется на клиенте и как часто данные устаревают. Ошибка на этом этапе — а не в выборе SPA как такового — чаще всего и превращается в зависший экран у пользователя.

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

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

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

Для таких сценариев компании переходят на B2B-приложение с интеграцией 1С: заказ формируется офлайн и уходит в базу, как только телефон снова видит сеть, сканер штрихкода подключается напрямую, а карточка товара и остатки хранятся локально и обновляются в фоне. Отдельный вариант для компаний на 1С — писать логику сразу на 1С:Мобильной платформе, если процесс целиком укладывается в конфигурацию 1С и не требует сложного нативного UI.

что в итоге сделал дистрибьютор и сколько это стоило

Компания не стала переписывать SPA-кабинет заново под офлайн — вместо этого офисный веб-кабинет оставили как есть для бухгалтерии и отдела продаж за компьютерами, а для торговых представителей отдельно собрали мобильное приложение с локальной базой товаров и очередью заявок на синхронизацию. Разработка такого приложения с интеграцией 1С у нас стартует от 500 000 рублей — итоговая цена зависит от числа справочников, которые нужно выгружать из базы, и от того, подключается ли внешний сканер.

что учесть в техническом задании при переходе с SPA на мобильное приложение

Уже собранный SPA-кабинет — не потеря, а часть работы: API и структуру данных, которые обмениваются с 1С, обычно можно использовать повторно, дорабатывая под офлайн-очередь и локальное хранилище на телефоне. В техническое задание стоит внести три пункта: список справочников и документов 1С, которые должны быть доступны без сети; перечень оборудования — сканер, принтер этикеток, кассовый модуль, — с которым должно работать приложение; и правило, по которому разрешаются конфликтующие изменения, если заявка правится и в офисе, и в поле одновременно.

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

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

Можно ли доработать SPA-кабинет, чтобы он работал без интернета?

Частично — через Service Worker и локальный кеш (PWA), но это ограничение, а не полноценный офлайн-режим: доступны только данные, загруженные заранее, ввод новой заявки без сети чаще всего невозможен. Для полноценной офлайн-работы с очередью синхронизации нужен нативный или гибридный мобильный формат.

SPA дешевле мобильного приложения?

На старте — обычно да, потому что не нужны отдельные сборки для iOS и Android и публикация в сторах. Но если сотрудникам нужен офлайн-режим, камера или сканер штрихкода, доработка SPA до нужного уровня часто выходит дороже, чем сразу заказать мобильное приложение с интеграцией 1С.

Как SPA-кабинет получает данные из 1С?

Обычно через HTTP-сервис или REST/OData-интерфейс: браузер отправляет запрос к серверу 1С, база отдаёт JSON с остатками, ценами или статусом заказа, а SPA перерисовывает нужный блок страницы без перезагрузки. Скорость и надёжность связи зависят от того, как спроектирован сервис обмена на стороне 1С.

Подходит ли SPA для склада с частым использованием сканера штрихкода?

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

Сколько стоит перейти от SPA-кабинета к мобильному приложению с 1С?

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