Att låta folk ladda upp bilder till din AI-byggda app (utan att den kraschar)

Att lägga till bilduppladdning i en AI-byggd app innebär att lagra filer i dedikerad fillagring (inte i databasen), sätta en storleks- och filtypsgräns som 10 MB, och generera en liten förhandsgranskningsbild — de grundläggande instruktionerna att ge din byggare.

Det ögonblick din app slutar vara bara text och börjar låta folk ladda upp en bild, förändras något. Att lägga till bild- och fildelning innebär att en användare kan skicka ett foto, ett kvitto eller ett dokument från sin enhet in i din app, som lagrar det och visar upp det senare — en profilbild, ett kvitto, en bild på ett skadat paket, ett PDF-kontrakt. Det är en av de där funktionerna som ser ut som en enda kryssruta men visar sig ha några vassa kanter under ytan. Ingen av dem är svår. Men de som ingen varnar dig för är de som dyker upp tre veckor efter lansering, oftast från din mest entusiastiska användare.

Det här är en rundtur genom vad som faktiskt händer när någon trycker på “ladda upp”, de tre misstagen som biter dig senare, och exakt vad du ska be din byggare om så att du slipper dem.

Vad händer egentligen när du laddar upp ett foto till en app?

Att ladda upp ett foto utlöser fyra steg i ordning: din telefon lämnar över filen till appen, appen skickar den till separat fillagring (inte databasen), appen sparar en länk till den filen bredvid posten, och senare hämtar den filen med hjälp av den länken varje gång någon tittar på posten.

Så här ser det ut steg för steg:

  1. Telefonen lämnar över filen till din app. Ett modernt telefonfoto är ofta 4 till 12 megabyte. Det är inte lite.
  2. Din app skickar filen någonstans för att lagras — inte i din apps databas, utan i en separat lagringsplats byggd för filer.
  3. Din app sparar en länk till filen i databasen, bredvid resten av posten (det här kvittot hör till det här utlägget).
  4. Senare, när någon tittar på posten, hämtar appen filen från lagringen med hjälp av den länken och visar den.

Det folk gör fel är steg 2 och 3. De föreställer sig att fotot “sparas i appen”. Det gör det inte, och det ska det inte heller. Filer bor i lagring; din databas kommer bara ihåg var. Får du den uppdelningen rätt blir allt nedströms enklare.

Ska du lagra uppladdade bilder direkt i databasen?

Nej — och det här är det vanligaste uppladdningsmisstaget, ett som AI-byggare ibland gör som standard om du inte är specifik. Att stoppa in ett 10 MB-foto direkt i din databas är som att förvara sina möbler i plånboken. Databasen är byggd för små, strukturerade saker — namn, datum, priser. Häller du in foton i den blir den seg, säkerhetskopior sväller, och en dag tar en sida som förut laddades blixtsnabbt sex sekunder eftersom den släpar med sig hundra bilder i full upplösning.

Det du vill ha istället: filen går till fillagring (din byggare kanske kallar det en “storage bucket” eller “blob storage”), och databasen håller bara länken. Be om det direkt:

“Lagra uppladdade bilder i fillagring, inte i databasen. Behåll bara fil-URL:en i posten.”

Hur stoppar du användare från att ladda upp fel filtyp eller en jättestor fil?

Du bestämmer i förväg vad som är tillåtet — filtyp, storleksgräns och ett tydligt felmeddelande — och talar om det för din byggare uttryckligen, för utan de reglerna accepterar din app vad som helst, inklusive filer som helt låser uppladdningen. Två verkliga scenarier visar varför, båda från appar som fungerade fint under testningen:

En kvinna driver en liten cateringfirma och byggde en app där kunder kan ladda upp bilder på tårtor de gillade. Det fungerade perfekt tills en kund laddade upp ett 47 MB-foto rakt från en proffskamera. Uppladdningen hängde sig, kunden gav upp, och hon fick höra “din app är trasig”. Den var inte trasig — den hade bara aldrig satt en storleksgräns, så den satt där och försökte svälja en jättestor fil för evigt.

Ett till exempel: en frilansare byggde en kundportal där folk laddar upp “sin logotyp”. En kund laddade upp en .zip-fil. En annan laddade upp en 90-sidig PDF. Appen accepterade allt eftersom ingen hade talat om för den vad en logotyp förväntades vara.

Bestäm dessa tre saker i förväg:

  • Vilka filtyper? Bara foton? Acceptera då JPG och PNG och avvisa resten, med ett vänligt meddelande.
  • Hur stort? En rimlig gräns för foton ligger runt 5 till 10 MB. Tillräckligt stort för ett riktigt telefonfoto, tillräckligt litet för att stoppa en kameradump.
  • Vad händer om det är fel? Appen bör säga det på ett vänligt sätt — “Ladda upp en JPG eller PNG under 10 MB” — inte bara frysa.

Säg till din byggare:

“Tillåt bara JPG- och PNG-bilder upp till 10 MB. Om någon laddar upp något annat eller för stort, visa ett tydligt meddelande istället för att misslyckas tyst.”

Varför känns din app långsam när den har många bilder?

Eftersom varje besökare laddar ner originalet i full storlek varje gång, inte en nedskalad kopia — på sin telefon, på sin dataplan, varje gång någon öppnar posten. Säg att någon laddar upp ett skarpt 8 MB-foto och det fungerar fint på egen hand. Multiplicera det med ett galleri på tjugo bilder och din snabba lilla app känns som att vada genom lera.

Fixen har ett namn värt att känna till eftersom din byggare känner igen det: en miniatyrbild, eller en omstorlekad version. Tanken är att du behåller originalet men också gör en liten, webbvänlig kopia, och visar den lilla kopian i listor och förhandsgranskningar. Den fullständiga laddas bara när någon faktiskt vill se den i stort format.

“När en bild laddas upp, skapa också en mindre omstorlekad version för förhandsgranskningar och listor. Visa den lilla versionen som standard och ladda bara den fullständiga bilden när någon klickar för att se den.”

Du behöver inte förstå hur det görs. Du behöver veta att det finns, så att du kan be om det innan din app känns långsam istället för efteråt.

Några tystare saker värda att bestämma

De här tre besluten kommer inte att knäcka din app om du hoppar över dem, men de är billigare att fatta nu än att lägga till i efterhand: vem som kan se filen, vad som händer med den när posten raderas, och om uppladdning fungerar på en telefon.

  • Vem kan se filen? En profilbild är okej för vem som helst att se. En skannad legitimation eller ett signerat kontrakt är det inte. Om filen är privat, tala om för din byggare att länken ska kräva inloggning, inte vara en offentlig URL som vem som helst kan öppna. Det här är den jag skulle trycka hårdast på för allt känsligt.
  • Vad händer när posten raderas? Om någon raderar ett utlägg, ska kvittobilden också städas bort? Annars samlar du sakta på dig herrelösa filer du betalar för att lagra och glömt att du hade.
  • Fungerar det på en telefon? De flesta uppladdningar sker på telefoner, och telefoner erbjuder både “ta ett foto nu” och “välj från biblioteket”. Testa båda på en riktig telefon, inte bara på din laptop där du bara någonsin drar in en fil.

Testa det som en främling skulle göra

Testa det genom att medvetet försöka knäcka det på det sätt en riktig användare gör av misstag — ett vanligt foto, en alldeles för stor fil, fel filtyp, en direktuppladdning från telefonkameran, och en radering — innan du kallar det klart:

  • Ladda upp ett vanligt telefonfoto. Dyker det upp, och är förhandsgranskningen snabb?
  • Ladda upp något jättestort. Stoppar appen dig med ett tydligt meddelande, eller hänger den sig bara?
  • Ladda upp fel typ — en PDF där ett foto förväntas. Förklarar den regeln?
  • Öppna appen på din telefon och ladda upp direkt från kameran.
  • Radera en post och kontrollera om dess fil hanteras på det sätt du bestämt.

Om alla fem beter sig som de ska har du rensat de kanter som fångar de flesta.

Uppladdningar är en av de där funktionerna där klyftan mellan “fungerar i demot” och “fungerar för en främling på ett tåg med ett 12 MB-foto på sin katt” är exakt de beslut som listats ovan. Ingen av dem är svår. De är bara lätta att hoppa över — och mycket enklare att be om nu än att laga senare.

Om du har skjutit upp att lägga till uppladdningar för att det kändes som ett stort tekniskt steg, är det inte det. Öppna din byggare, be om bildlagring med en storleksgräns och en miniatyrbild, och se vad den ger dig. Försök sedan knäcka det på din telefon — det är det riktiga testet, och det tar fem minuter.