Slike i potpisani linkovi

Svaka fotografija oglasa ima više veličina (variants), sve u formatu WebP:

name	Širina	Za šta
thumb	320 px	sličice, mape, liste na telefonu
card	800 px	kartice u listi, galerija na telefonu
large	1600 px	galerija preko celog ekrana, društvene mreže (og:image)

Varijanta original (čista, bez vodenog žiga) se nikad ne šalje van aplikacije. card i large nose vodeni žig agencije ako ga je podesila. Svaka varijanta ima width, height, bytes i format, pa možete napraviti srcset bez učitavanja slike:

const cover = p.images.find((i) => i.isCover) ?? p.images[0];
const srcset = cover?.variants.map((v) => `${v.url} ${v.width}w`).join(", ");
// <img src={cardUrl} srcset={srcset} sizes="(min-width: 960px) 33vw, 100vw" width={800} height={533} alt={cover.alt ?? p.title} loading="lazy">

Redosled: isCover prva, pa po position. SDK funkcija imageUrl() to radi za vas. U listi oglasa stiže samo naslovna fotografija; sve stižu u detalju. Fotografije koje se još obrađuju se ne vraćaju.

Linkovi ističu

Linkovi slika su potpisani i ističu:

https://app.propertio.rs/media/agencies/…/card.webp?md5=Vd8V…&expires=1792483200

• expires je Unix vreme isteka; md5 je potpis putanje i roka. Promena bilo kog dela linka ga poništava.
• Javni API daje linkove koji važe 24 sata od trenutka odgovora. Feedovi i webhookovi daju linkove koji važe 30 dana.
• Istekao link vraća 410 Gone, neispravan 403 Forbidden.
• Dok važi, slika se kešira u browseru i CDN-u (cache-control: public, max-age=31536000, immutable).

Šta to znači za sajt

• Ne čuvajte linkove slika trajno (baza, CMS, statički JSON koji se ne obnavlja). Čuvajte id oglasa i linkove tražite od API-ja kada vam trebaju.
• Keš odgovora API-ja neka bude kraći od 24 h. Na primer Next.js revalidate: 300 ili statička izgradnja bar svakih nekoliko sati. Slike u kešu starijem od 24 h prestaju da se učitavaju.
• Svaki odgovor potpisuje linkove iznova (novi expires), pa isti oglas posle novog poziva ima drugačije URL-ove slika i browser ih ponovo preuzima. Zato je keš odgovora od nekoliko minuta do nekoliko sati dobar i za brzinu slika, ne samo za limite.
• Ne kopirajte slike na svoj server ili CDN bez dogovora sa agencijom: tako zaobilazite istek i vodeni žig. Ako koristite optimizator slika (npr. Next.js <Image>), dozvolite putanju app.propertio.rs/media/ i imajte u vidu da on kešira po celom URL-u, uključujući expires.
• og:image za deljenje oglasa: koristite large. Mreže (Facebook, Viber) keširaju sliku same, pa istek linka posle 24 h ne smeta već podeljenom linku.

// Next.js: dozvoli slike sa Propertija za <Image>
// next.config.js
module.exports = {
  images: { remotePatterns: [{ protocol: "https", hostname: "app.propertio.rs", pathname: "/media/**" }] },
};