Преобразование изображений и подписанные URL-адреса
Выдавайте изменённые и оптимизированные изображения по запросу и предоставляйте временный доступ к закрытым файлам с помощью подписанных URL-адресов Supabase Storage.
«Преобразование изображений и подписанные URL-адреса» — бесплатный урок Supabase Backend as a Service на CoddyKit. Это урок 4 из 4. Ты можешь прочитать весь урок бесплатно ниже — а потом практиковать его прямо в браузере с встроенным редактором кода и ИИ-репетитором 24/7. Это часть пути обучения Supabase Backend as a Service, и твой прогресс синхронизируется между веб-версией и приложением CoddyKit. Курс Supabase Backend as a Service содержит 4 уроков всего.
Части этого урока еще не переведены и отображаются на английском.
Smarter File Delivery
Supabase Storage can transform images on request and create signed URLs for time-limited access to private files. Both reduce custom backend work.
Public vs Private Buckets
Public buckets serve files via a permanent URL. Private buckets require a signed URL or an authenticated request, controlled by policies.
Getting a Public URL
For public buckets, build the URL directly, no token needed.
const { data } = supabase.storage
.from('avatars')
.getPublicUrl('user-42.png');
console.log(data.publicUrl);On-the-Fly Resizing
Pass transform options to request a resized version. Supabase generates and caches it.
const { data } = supabase.storage
.from('avatars')
.getPublicUrl('user-42.png', {
transform: { width: 100, height: 100, resize: 'cover' }
});Why Transform at the Edge?
Serving a 100px thumbnail instead of a full-size photo saves bandwidth and speeds up pages, without storing many copies yourself.
Quality and Format
You can also tune quality and request modern formats to shrink payloads further.
function thumbOpts(size) {
return { width: size, height: size, quality: 75, resize: 'cover' };
}
console.log(thumbOpts(64));Creating a Signed URL
For private files, generate a URL that expires after a set number of seconds.
const { data } = await supabase.storage
.from('invoices')
.createSignedUrl('inv-2026.pdf', 60);
console.log(data.signedUrl);Choosing an Expiry
Keep expiry as short as the use case allows. A download link might need 60 seconds; an embedded image might need an hour.
function expirySeconds(useCase) {
return useCase === 'download' ? 60 : 3600;
}
console.log(expirySeconds('download'));Signed URLs With Transforms
You can combine a signed URL with an image transform to serve resized private images securely.
Caching Behavior
Transformed images are cached at the edge, so repeated requests for the same size are fast. Vary the size sparingly to keep cache hits high.
Putting It Together
Use public URLs and transforms for open assets, and signed URLs for private files, with short expiries and edge caching for performance.
Quick Check
Test your understanding of URLs and transforms.
Recap
You learned to build public URLs, apply on-the-fly image transforms for performance, and create expiring signed URLs for private files, plus how edge caching keeps it fast.
Часто задаваемые вопросы
Урок «Преобразование изображений и подписанные URL-адреса» бесплатный?
Да — полный текст урока «Преобразование изображений и подписанные URL-адреса» бесплатно доступен здесь в веб-версии. Чтобы практиковать его интерактивно (встроенный редактор кода и ИИ-репетитор 24/7) и разблокировать остальной курс Supabase Backend as a Service, подпишись на CoddyKit PRO. Курс Supabase Backend as a Service содержит 4 уроков всего.
Чему я научусь в уроке «Преобразование изображений и подписанные URL-адреса»?
Выдавайте изменённые и оптимизированные изображения по запросу и предоставляйте временный доступ к закрытым файлам с помощью подписанных URL-адресов Supabase Storage. Ты практикуешь Supabase Backend as a Service с помощью реального кода, который запускаешь прямо в браузере, и ИИ-репетитор 24/7 отвечает на твои вопросы во время урока.
Нужен ли мне опыт, чтобы начать Supabase Backend as a Service?
Предыдущий опыт не требуется. Supabase Backend as a Service на CoddyKit структурирован для всех уровней — от новичков до продвинутых, поэтому ты можешь начать отсюда или с самого начала и учиться в своем темпе. Это урок 4 из 4.
Сколько времени занимает урок «Преобразование изображений и подписанные URL-адреса»?
Большинство уроков CoddyKit занимают около 5–10 минут. Каждый из них компактный и интерактивный, поэтому ты постоянно делаешь прогресс и продолжаешь с того же места в веб-версии и приложении.
Можно ли писать и запускать код в этом уроке Supabase Backend as a Service?
Да. Каждый урок Supabase Backend as a Service включает встроенный редактор кода, поэтому ты пишешь и запускаешь реальный код прямо в браузере и получаешь моментальную обратную связь от AI — локальная установка не требуется.
Все уроки этого курса
- Хранение файлов в хранилищах Supabase
- Управление доступом с помощью политик
- Загрузка и получение медиаданных
- Преобразование изображений и подписанные URL-адреса