Як дозволити людям завантажувати фото у ваш застосунок на AI-білдері (і не впасти під навантаженням)

У момент, коли ваш застосунок перестає бути просто текстом і дозволяє людям завантажувати фото, щось змінюється. Додавання завантаження зображень і файлів означає, що користувач може надіслати фото, чек чи документ зі свого пристрою у застосунок, який зберігає його й показує пізніше — фото профілю, чек, знімок пошкодженої посилки, PDF-контракт. Це одна з тих функцій, яка виглядає як одна галочка, а насправді має кілька гострих кутів. Жоден із них не складний. Але ті, про які ніхто не попереджає, зазвичай проявляються через три тижні після запуску — і, як правило, від вашого найактивнішого користувача.

Це огляд того, що насправді відбувається, коли хтось натискає “завантажити”, трьох помилок, які вилазять пізніше, і точних формулювань, які варто дати своєму білдеру, щоб їх уникнути.

Що насправді відбувається, коли ви завантажуєте фото в застосунок?

Завантаження фото запускає чотири кроки поспіль: телефон передає файл застосунку, застосунок надсилає його в окреме файлове сховище (не в базу даних), застосунок зберігає посилання на цей файл поруч із записом, а пізніше отримує файл за цим посиланням щоразу, коли хтось переглядає запис.

Ось як це виглядає крок за кроком:

Телефон передає застосунку файл. Сучасне фото з телефону часто важить 4–12 мегабайтів. Це немало.
Ваш застосунок надсилає цей файл кудись на зберігання — не в базу даних застосунку, а в окреме сховище, створене саме для файлів.
Ваш застосунок зберігає в базі даних посилання на цей файл поруч із рештою запису (цей чек належить до цієї витрати).
Пізніше, коли хтось переглядає запис, застосунок отримує файл зі сховища за цим посиланням і показує його.

Помилку зазвичай роблять на кроках 2 і 3. Люди уявляють, що фото “зберігається в застосунку”. Насправді ні — і не повинно. Файли живуть у сховищі; база даних лише пам’ятає, де саме. Якщо правильно розділити ці ролі, все подальше стає значно простішим.

Чи варто зберігати завантажені фото прямо в базі даних?

Ні — і це найпоширеніша помилка з завантаженнями, яку AI-білдери іноді роблять за замовчуванням, якщо ви не вказали інакше. Запихати 10-мегабайтне фото прямо в базу даних — це як зберігати меблі в гаманці. База даних створена для маленьких, структурованих речей — імен, дат, цін. Заллєте туди фото — і все сповільниться, резервні копії роздуються, а одного дня сторінка, яка раніше завантажувалася миттєво, почне вантажитися шість секунд, бо тягне за собою сотню зображень у повній роздільній здатності.

Натомість вам потрібно ось що: файл іде у файлове сховище (ваш білдер може називати це “storage bucket” або “blob storage”), а база даних зберігає лише посилання. Попросіть про це прямо:

“Зберігай завантажені зображення у файловому сховищі, а не в базі даних. У записі тримай лише URL файлу.”

Як не дозволити користувачам завантажувати неправильний тип файлу чи занадто великий файл?

Ви заздалегідь вирішуєте, що дозволено — тип файлу, ліміт розміру й чітке повідомлення про помилку — і явно повідомляєте про це своєму білдеру, бо без цих правил застосунок прийме що завгодно, включно з файлами, які просто зависають при завантаженні. Дві реальні історії показують чому — обидві з застосунків, які прекрасно працювали під час тестування:

Жінка веде невеликий кейтеринговий бізнес і створила застосунок, куди клієнти завантажують фото тортів, які їм сподобалися. Все працювало чудово, поки один клієнт не завантажив фото на 47 МБ прямо з професійної камери. Завантаження зависло, клієнт здався, а вона почула про це як “ваш застосунок зламаний”. Він не був зламаний — просто ніхто не встановив ліміт розміру, тож застосунок безкінечно намагався проковтнути величезний файл.

Друга історія: фрилансерка створила клієнтський портал, куди люди завантажують “свій логотип”. Один клієнт завантажив файл .zip. Інший — 90-сторінковий PDF. Застосунок прийняв усе це, бо ніхто не сказав йому, яким має бути логотип.

Вирішіть заздалегідь ці три речі:

Які типи файлів? Тільки фото? Тоді приймайте JPG і PNG, а решту відхиляйте з дружнім повідомленням.
Наскільки великий? Розумний ліміт для фото — приблизно 5–10 МБ. Достатньо для реального фото з телефону, достатньо мало, щоб зупинити злив усієї камери.
А якщо не те завантажили? Застосунок має ввічливо про це сказати — “Будь ласка, завантажте JPG або PNG до 10 МБ” — а не просто зависнути.

Скажіть своєму білдеру:

“Дозволяй завантажувати лише зображення JPG і PNG розміром до 10 МБ. Якщо хтось завантажує щось інше або завеликий файл, показуй чітке повідомлення замість того, щоб мовчки падати.”

Чому ваш застосунок здається повільним, коли в ньому багато фото?

Тому що кожен переглядач щоразу завантажує повнорозмірний оригінал, а не зменшену копію — на своєму телефоні, зі свого тарифу, кожного разу, коли хтось відкриває запис. Скажімо, хтось завантажив чітке фото на 8 МБ, і саме по собі воно працює нормально. Помножте це на галерею з двадцяти фото — і ваш швидкий маленький застосунок раптом почне пробуксовувати, наче в багнюці.

У виправлення є назва, яку варто знати, бо ваш білдер її впізнає: мініатюра (thumbnail), або зменшена версія. Ідея в тому, щоб зберігати оригінал, але також створювати маленьку, зручну для вебу копію — і показувати саме її у списках і превʼю. Повне зображення завантажується лише тоді, коли хтось справді хоче побачити його великим.

“Коли зображення завантажується, створюй також меншу, змінену за розміром версію для превʼю та списків. За замовчуванням показуй малу версію і завантажуй повне зображення лише тоді, коли хтось натискає, щоб переглянути його.”

Вам не потрібно розуміти, як саме це реалізовано. Потрібно лише знати, що така можливість існує — щоб попросити про неї до того, як застосунок стане повільним, а не після.

Кілька тихіших рішень, вартих уваги

Ці три рішення не зламають ваш застосунок, якщо ви їх пропустите, але прийняти їх зараз дешевше, ніж дороблювати потім: хто може бачити файл, що з ним відбувається при видаленні запису, і чи працює завантаження з телефону.

Хто може бачити файл? Фото профілю можна показувати будь-кому. Скан посвідчення особи чи підписаний контракт — ні. Якщо файл приватний, скажіть своєму білдеру, що посилання має вимагати авторизації, а не бути публічним URL, який може відкрити хто завгодно. Це той пункт, на якому я наполягав би найбільше для будь-чого чутливого.
Що відбувається при видаленні запису? Якщо хтось видаляє витрату, чи має видалятися і фото чека разом із нею? Інакше ви поступово накопичуєте осиротілі файли, за зберігання яких платите і про які самі забули.
Чи працює це на телефоні? Більшість завантажень відбувається саме з телефонів, а телефони пропонують і “зробити фото прямо зараз”, і “вибрати з бібліотеки”. Перевірте обидва варіанти на реальному телефоні, а не лише на ноутбуці, де ви просто перетягуєте файл мишкою.

Протестуйте це так, як це зробив би незнайомець

Тестуйте, свідомо намагаючись зламати функцію так, як це випадково зробить справжній користувач — звичайне фото, завеликий файл, неправильний тип файлу, завантаження наживо з камери телефону та видалення — перш ніж вважати завдання виконаним:

Завантажте звичайне фото з телефону. Чи з’являється воно, і чи швидко вантажиться превʼю?
Завантажте щось величезне. Чи зупиняє вас застосунок чітким повідомленням, чи просто зависає?
Завантажте неправильний тип — PDF там, де очікується фото. Чи пояснює він правило?
Відкрийте застосунок на телефоні й завантажте фото прямо з камери.
Видаліть запис і перевірте, чи файл обробляється так, як ви вирішили.

Якщо всі п’ять пунктів проходять нормально — ви подолали ті гострі кути, на яких спотикається більшість.

Завантаження — одна з тих функцій, де розрив між “працює на демо” і “працює для незнайомця в потязі з котячим фото на 12 МБ” — це якраз набір рішень, перелічених вище. Жодне з них не складне. Їх просто легко пропустити — а попросити про них зараз набагато простіше, ніж виправляти потім.

Якщо ви відкладали додавання завантажень, бо це здавалося великим технічним стрибком — це не так. Відкрийте свій білдер, попросіть сховище для зображень з лімітом розміру й мініатюрою — і подивіться, що він вам дасть. А потім спробуйте зламати це на своєму телефоні — ось справжній тест, і він займе п’ять хвилин.