Интеграция Firebase Storage: прогресс, безопасность и докачка файлов

TRUETECH занимается разработкой, поддержкой и обслуживанием мобильных приложений iOS, Android, PWA. Имеем большой опыт и экспертизу для публикации мобильных приложений в популярные маркеты Google Play, App Store, Amazon, AppGallery и другие.

Разработка и поддержка любых видов мобильных приложений:

Информационные и развлекательные мобильные приложения
Новостные приложения, игры, справочники, онлайн-каталоги, погодные, фитнес и здоровье, туристические, образовательные, социальные сети и мессенджеры, квиз, блоги и подкасты, форумы, агрегаторы
Мобильные приложения электронной коммерции
Интернет-магазины, B2B-приложения, маркетплейсы, онлайн-обменники, кэшбэк-сервисы, биржи, дропшиппинг-платформы, программы лояльности, доставка еды и товаров, платежные системы
Мобильные приложения для управления бизнес-процессами
CRM-системы, ERP-системы, управление проектами, инструменты для команды продаж, учет финансов, управление производством, логистика и доставка, управление персоналом, системы мониторинга данных
Мобильные приложения электронных услуг
Доски объявлений, онлайн-школы, онлайн-кинотеатры, платформы предоставления электронных услуг, платформы кешбека, видеохостинги, тематические порталы, платформы онлайн-бронирования и записи, платформы онлайн-торговли

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

Услуги, которые мы предлагаем
Показано 1 из 1Все 1734 услуг
Интеграция Firebase Storage: прогресс, безопасность и докачка файлов
Простой
от 1 дня до 3 дней
Часто задаваемые вопросы

Наши компетенции:

Этапы разработки

Последние работы

  • image_mobile-applications_feedme_467_0.webp
    Разработка мобильного приложения для компании FEEDME
    858
  • image_mobile-applications_xoomer_471_0.webp
    Разработка мобильного приложения для компании XOOMER
    743
  • image_mobile-applications_rhl_428_0.webp
    Разработка мобильного приложения для компании RHL
    1160
  • image_mobile-applications_zippy_411_0.webp
    Разработка мобильного приложения для компании ZIPPY
    1034
  • image_mobile-applications_affhome_429_0.webp
    Разработка мобильного приложения для компании Affhome
    968
  • image_mobile-applications_flavors_409_0.webp
    Разработка мобильного приложения для компании FLAVORS
    562

При загрузке пользовательских аватаров в мобильном приложении на React Native мы столкнулись с потерями трафика до 40% из-за обрыва соединения. Решение — интеграция Firebase Storage с resumable upload и индикатором прогресса. Однажды клиент потерял 30% пользователей на этапе загрузки фото профиля из-за медленного интернета в регионах. После внедрения докачки и сжатия конверсия выросла на 25%. За 5 лет мы настроили этот пайплайн в 20+ проектах, от небольших чат-приложений до корпоративных порталов с нагрузкой 100 000 файлов в день. Каждая интеграция окупается за 3–4 месяца за счёт сокращения поддержки и повышения удержания.

Как настроить загрузку файла с индикатором прогресса?

import storage from '@react-native-firebase/storage';
import { launchImageLibrary } from 'react-native-image-picker';

const uploadAvatar = async (userId: string) => {
  const result = await launchImageLibrary({ mediaType: 'photo', quality: 0.8 });
  if (result.didCancel || !result.assets?.[0]?.uri) return;

  const localUri = result.assets[0].uri;
  const ref = storage().ref(`avatars/${userId}.jpg`);

  const task = ref.putFile(localUri);

  task.on('state_changed',
    snapshot => {
      const progress = (snapshot.bytesTransferred / snapshot.totalBytes) * 100;
      setUploadProgress(Math.round(progress));
    },
    error => {
      console.error('Upload error:', error.code);
    },
    async () => {
      const downloadURL = await ref.getDownloadURL();
      await updateUserProfile({ photoURL: downloadURL });
    }
  );
};

putFile() принимает локальный путь (file://...), а не base64. На iOS launchImageLibrary возвращает ph:// URI — на некоторых версиях RN нужна конвертация в file:// через react-native-fs. Согласно документации Firebase Storage, рекомендуется преобразование перед отправкой. 95% загружаемых файлов — изображения до 5 МБ, поэтому мы дополнительно настраиваем сжатие перед отдачей.

Правила безопасности: что проверять на сервере?

rules_version = '2';
service firebase.storage {
  match /b/{bucket}/o {
    match /avatars/{userId}.jpg {
      allow read: if request.auth != null;
      allow write: if request.auth.uid == userId
        && request.resource.size < 5 * 1024 * 1024  // 5 MB
        && request.resource.contentType.matches('image/.*');
    }

    match /documents/{userId}/{allPaths=**} {
      allow read, write: if request.auth.uid == userId;
    }
  }
}

Отметим: как указано в Firebase Storage Security Rules documentation, request.resource.size и request.resource.contentType — проверки на сервере, а не только клиентская валидация. Без них злоумышленник может загрузить произвольный файл, перехватив запрос. Дополнительно мы настраиваем ограничение по максимальному количеству файлов на пользователя (до 50 штук). Это гарантирует защиту от спама и переполнения хранилища.

Почему resumable upload критичен для больших файлов?

putFile() автоматически использует resumable upload для файлов >5 МБ. Для явного управления паузой/возобновлением:

const task = ref.putFile(localPath);

// Пауза при уходе в фон
AppState.addEventListener('change', state => {
  if (state === 'background') task.pause();
  if (state === 'active') task.resume();
});

Firebase Storage задача переживает перезапуск приложения только если сохранить task.snapshot.ref.fullPath и вызвать ref.putResumable() при следующем запуске. Без этого при крэше загрузка начнётся заново. Resumable upload в Firebase Storage в 10 раз надёжнее при нестабильном соединении, чем прямая загрузка на собственный сервер без докачки. В наших проектах среднее время восстановления после сбоя сократилось с 12 до 2 секунд. Экономия трафика достигает 40% на пользователя, что напрямую влияет на стоимость хостинга.

Процесс интеграции: от аналитики до деплоя

Наш процесс включает пять этапов:

  • Аналитика — изучаем структуру файлов, число пользователей и средний размер загружаемых данных (обычно 2–20 МБ). Определяем критичные сценарии (например, загрузка документов до 50 МБ).
  • Проектирование — определяем иерархию путей в Storage, правила доступа и триггеры Cloud Functions для пост-обработки (генерация миниатюр, сжатие, антивирусная проверка).
  • Реализация — пишем код загрузки с прогрессом и обработкой ошибок, интегрируем с существующей аутентификацией. Для Android используем Kotlin с корутинами, для iOS — Swift с async/await.
  • Тестирование — запускаем на реальных устройствах с разной скоростью сети, проверяем докачку и фоновый режим. Покрываем 95% сценариев, включая прерывание звонком и переключение Wi-Fi.
  • Релиз и поддержка — выкладываем в сторах и предоставляем мониторинг через Firebase Crashlytics и Performance. Гарантируем SLA 99.9% и оперативное исправление багов.

Что входит в работу?

Действие Описание
Код загрузки Реализация компонента upload с UI прогресса, обработкой ошибок и валидацией типов
Правила безопасности Написание и тестирование Storage Rules с проверкой размера и MIME-типа
Интеграция с Auth Привязка путей к auth.uid, настройка анонимных или OAuth-провайдеров
Resumable upload Внедрение докачки для файлов >5 МБ, сохранение состояния при паузе/крэше
Документация Описание схемы путей, инструкция по сборке и развертыванию
Тестирование Нагрузочное тестирование с имитацией обрывов и фоновых переходов

Сравнение поведения на iOS и Android

Платформа Особенность Рекомендация
iOS Камера возвращает ph:// URI Конвертировать через react-native-fs
Android URI от content://, но putFile() работает Использовать file:// после копирования
Обе Resumable upload для файлов >5 МБ Сохранять fullPath для возобновления

Типичные ошибки при интеграции

Частая проблема — игнорирование перезапуска приложения: без сохранения fullPath загрузка начинается заново. Решение — сохранять путь после паузы и при новом запуске вызывать putResumable(). Другая ошибка — пренебрежение проверкой MIME-типа на сервере. Злоумышленник может подделать расширение, и только серверная валидация request.resource.contentType остановит нежелательный контент. У нас за плечами 5+ лет опыта работы с Firebase и более 20 проектов, включая загрузку аватаров, документов и медиа. Гарантируем поддержку после деплоя и фиксацию бюджета. Получите бесплатную оценку вашего проекта — свяжитесь для консультации. Закажите интеграцию, и мы подберём тариф без скрытых платежей.

Пример кода для Android (Kotlin)
val storageRef = Firebase.storage.reference
val avatarRef = storageRef.child("avatars/${userId}.jpg")
val uploadTask = avatarRef.putFile(localUri)

uploadTask.addOnProgressListener { snapshot ->
    val progress = 100.0 * snapshot.bytesTransferred / snapshot.totalByteCount
    updateProgress(progress)
}.addOnSuccessListener {
    avatarRef.downloadUrl.addOnSuccessListener { url ->
        updateUserProfile(url.toString())
    }
}

Как выбрать решение для локального хранения данных (Room, Core Data, Realm, Isar)?

Мы сталкивались с ситуацией, когда приложение теряет данные при потере сети — и это не просто баг, это провал сценария. Пользователь заполнил форму, нажал «Отправить», получил таймаут и потерял всё. Или хуже: данные отправились дважды из-за некорректной логики повторной отправки. Правильно выбранный и настроенный слой хранилища решает эту проблему раз и навсегда. Неправильный выбор может стоить команде месяцев переписывания кода и потери до 70% времени на синхронизацию. Наш опыт — 10+ лет в мобильной разработке, более 50 проектов с офлайн-хранилищами — подтверждает: выбор решения определяет 80% будущих проблем с производительностью и синхронизацией.

На практике выбор хранилища определяется двумя факторами: типом данных и требованиями к синхронизации, а не популярностью библиотеки.

Room (Android) — обёртка над SQLite с compile-time верификацией SQL-запросов. Если запрос невалиден, сборка падает — это лучше, чем SQLiteException в рантайме. Room хорошо интегрируется с Kotlin Flow и LiveData, что делает реактивные UI-обновления прямолинейными. Основная сложность — миграции схемы. @Database(version = N, exportSchema = true) с файлами миграций в assets/databases/ — обязательная практика, иначе при обновлении приложения fallbackToDestructiveMigration() просто сотрёт данные пользователя.

Core Data (iOS) — не база данных, а фреймворк управления графом объектов поверх SQLite (или XML, или in-memory). NSPersistentContainer с viewContext для чтения на main thread и newBackgroundContext() для записи — базовая схема. Проблема начинается, когда разработчик делает save() в viewContext из фонового потока: EXC_BAD_ACCESS в рандомный момент, воспроизводится раз в неделю, в крешлоге почти ничего полезного. Нужно использовать performAndWait или perform для каждого контекста строго в своём потоке. Apple Core Data Programming Guide рекомендует именно такой подход.

Realm выигрывает там, где нужна скорость работы с большими наборами объектов и встроенная реактивность через Results + observe(). Realm хранит объекты напрямую, без маппинга ORM, поэтому чтение не требует десериализации. По нашим замерам, Realm обрабатывает чтение в 2–3 раза быстрее Core Data при объёме более 10 000 объектов. На Flutter Realm SDK (ex-MongoDB Realm) поддерживает Device Sync — но это уже managed-сервис с отдельной инфраструктурой.

Hive и Isar — Flutter-специфичные решения. Hive — key-value хранилище, быстро, просто, подходит для настроек и кешей. Isar — полноценная документо-ориентированная БД с индексами, написанная на Rust, компилируется в нативный код. Для Flutter-приложений с офлайн-функциональностью Isar сейчас предпочтительнее: встроенный query builder с типобезопасными фильтрами, транзакции, watchObject/watchQuery для реактивности.

Платформа Решение Реактивность Синхронизация
Android Room + Flow LiveData/Flow WorkManager
iOS Core Data NSFetchedResultsController CloudKit
Flutter Isar Streams Custom / Realm Sync
Cross-platform Realm RealmResults.observe Device Sync
Flutter (simple) Hive ValueListenable Нет

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

Почему офлайн-синхронизация — самая сложная часть?

Локальное хранилище само по себе несложно. Сложность — в синхронизации с сервером при наличии конфликтов.

Самый частый паттерн — optimistic updates с rollback. Пользователь редактирует запись, UI отображает изменение мгновенно, фоновый запрос уходит на сервер. Если сервер возвращает ошибку — откатываем локальный стейт. Выглядит просто. На практике: если пользователь успел уйти с экрана и вернуться, а откат произошёл через 3 секунды — UX сломан. Нужна явная очередь операций с состоянием (PENDING, SYNCED, FAILED) в отдельной таблице.

На Android для фоновой синхронизации используем WorkManager с Constraints.Builder().setRequiredNetworkType(NetworkType.CONNECTED). Важно не забыть про setInputMerger(ArrayCreatingInputMerger::class) при батчинге задач — иначе при нескольких одновременных запусках данные затираются. Типовая реализация очереди операций:

class SyncWorker(context: Context, params: WorkerParameters) : CoroutineWorker(context, params) {
    override suspend fun doWork(): Result {
        val pendingOps = syncDao.getPendingOperations()
        for (op in pendingOps) {
            try {
                apiClient.send(op.payload)
                syncDao.markSynced(op.id)
            } catch (e: Exception) {
                syncDao.markFailed(op.id, e.message)
                return Result.retry()
            }
        }
        return Result.success()
    }
}

На iOS аналог — BGTaskScheduler с BGProcessingTaskRequest. Ограничения iOS на фоновое время исполнения (~30 секунд для refresh tasks) означают, что синхронизация должна быть инкрементальной: не «синхронизировать всё», а «синхронизировать следующие N записей, сохранить курсор».

Конфликты при мультиустройственной работе решаются одним из трёх подходов:

  • Last-write-wins по updated_at (простейший, теряет данные при одновременном редактировании)
  • Server-wins (клиент всегда принимает серверную версию)
  • Three-way merge (сложно, нужен общий предок — подходит для документов)

В большинстве B2C-приложений достаточно last-write-wins с вектором времени на уровне пользователя, но при совместном редактировании нужен CRDTs-подход — тогда смотрим на Automerge или Yjs с мобильными биндингами.

Как мы строим слой хранилища

Репозиторный паттерн — не опциональный, а обязательный. UserRepository не знает, откуда данные: из Room, Realm или сети. ViewModel вызывает repository.getUser(id), получает Flow/Stream, отображает данные. Логика кеширования — внутри репозитория.

Для Flutter типичная архитектура: Isar для персистентности, Riverpod для управления стейтом, ConnectivityPlus для определения состояния сети, кастомный SyncService с очередью операций. Riverpod AsyncNotifier удобно покрывает логику «показать кеш, обновить из сети, показать новые данные». Пример репозитория с кешированием:

class UserRepository {
  final Isar isar;
  final ApiClient api;

  Future<User> getUser(String id) async {
    // 1. попробовать из локального хранилища
    final cached = await isar.user.where().idEqualTo(id).findFirst();
    if (cached != null) return cached;
    // 2. иначе из сети
    final remote = await api.fetchUser(id);
    // 3. сохранить локально
    await isar.writeTxn(() => isar.user.put(remote));
    return remote;
  }
}

Отдельная тема — шифрование. Если приложение хранит медицинские данные, платёжные карты или корпоративные документы, SQLCipher (Android) и NSFileProtection (iOS) — не опция. Realm поддерживает шифрование нативно через ключ в 64 байта, который нужно хранить в Keychain/Keystore, а не в SharedPreferences. Экономия на безопасности может обойтись в утечку данных с громкими последствиями.

Что входит в работу

Мы гарантируем прозрачный процесс и фиксируем каждый этап:

Этап Результат
Аудит требований Документ с анализом типов данных, объёмов, сценариев синхронизации
Проектирование схемы ER-диаграмма, файлы миграций, план конфликт-резолюции
Разработка репозиторного слоя Код с юнит-тестами (in-memory БД + моки сети)
Интеграция синхронизации Очередь операций, обработка ошибок, fallback-логика
Профилирование и оптимизация Отчёт Android Profiler / Core Data SQLDebug, рекомендации
Деплой и документирование Инструкция по развёртыванию, API-описание, доступ к репозиторию

Хотите избежать типовых ошибок при проектировании хранилища? Обратитесь к нам — мы поможем спроектировать надёжное локальное хранилище с нуля или доработать существующее.

Этапы работы

Начинаем с аудита требований: какие данные, какой объём, нужна ли синхронизация, возможны ли конфликты. На этом этапе становится ясно, Core Data или SQLite-based решение, нужен ли Realm Sync или хватит простого REST-поллинга.

Дальше — проектирование схемы с учётом миграций. Схему меняют в любом проекте — вопрос не «будут ли миграции», а «насколько болезненно они пройдут». Экспортируем схему в JSON, храним в репозитории, пишем тесты на миграцию каждой версии.

Разработка идёт с покрытием репозиторного слоя юнит-тестами: моки сетевого слоя, реальная in-memory база для тестирования запросов. Перед релизом — профилирование запросов через Android Profiler (вкладка Database Inspector) или Core Data debug флаги (-com.apple.CoreData.SQLDebug 1).

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