Locally stored thumbnails for video and YouTube uploads

- Server-side video thumbnails: ffmpeg-static grabs a frame at ~1s,
  scales it to 480px and stores it under /uploads/thumbs/ at upload
  time (direct files, remote URLs and comment attachments)
- YouTube thumbnails are downloaded once at upload time instead of
  being hotlinked from i.ytimg.com on every render; remote URL kept
  as fallback for legacy rows
- thumbUrl now covers video/audio/youtube/twitch in grid meta,
  profile uploads and notifications
- Generated thumbnail files are removed on single/bulk delete

Generated with [Devin](https://devin.ai)

Co-Authored-By: Devin <158243242+devin-ai-integration[bot]@users.noreply.github.com>
This commit is contained in:
2026-10-04 03:06:01 +02:00
co-authored by Devin
parent d95ccf9dc7
commit cd04135463
7 changed files with 59 additions and 17 deletions
+2 -3
View File
@@ -42,9 +42,8 @@ export default defineEventHandler(async (event) => {
notifications: rows.map((row) => {
const url = row.externalUrl ?? `/uploads/${row.fileName}`
const embedId = row.uploadType === 'youtube' && row.externalUrl ? getYoutubeId(row.externalUrl) : null
const thumbUrl = row.uploadType === 'youtube' && embedId
? youtubeThumbUrl(embedId)
: row.uploadType === 'image' ? url : row.uploadType === 'link' ? row.previewImage : null
const thumbUrl = row.previewImage
?? (row.uploadType === 'youtube' && embedId ? youtubeThumbUrl(embedId) : row.uploadType === 'image' ? url : null)
return { ...row, url, thumbUrl, isMention: mentionedUserIds(row.content, mentionUsers).has(user.id) }
}),
unreadCount: Number(total?.count ?? 0),
+5 -1
View File
@@ -12,7 +12,7 @@ export default defineEventHandler(async (event) => {
const db = useDb()
const [upload] = await db
.select({ fileName: uploads.fileName })
.select({ fileName: uploads.fileName, previewImage: uploads.previewImage })
.from(uploads)
.where(eq(uploads.id, id))
.limit(1)
@@ -30,11 +30,15 @@ export default defineEventHandler(async (event) => {
if (upload.fileName) {
await unlink(join(uploadDir(), upload.fileName)).catch(() => {})
}
if (upload.previewImage?.startsWith('/uploads/')) {
await unlink(join(process.cwd(), 'public', upload.previewImage)).catch(() => {})
}
for (const f of attachmentFiles) {
await unlink(join(uploadDir(), 'attachments', f.fileName)).catch(() => {})
if (f.cover) {
await unlink(join(process.cwd(), 'public', f.cover)).catch(() => {})
}
}
broadcastToAll({ type: 'upload-deleted', ids: [id] })
return { ok: true }
})
+6 -3
View File
@@ -3,7 +3,7 @@ import { extname, join } from 'node:path'
import { eq, sql } from 'drizzle-orm'
import { z } from 'zod'
import { commentAttachments, comments, uploads } from '../../../db/schema'
import { isAudioAttachment, MAX_COMMENT_ATTACHMENTS } from '~~/shared/utils/attachments'
import { isAudioAttachment, isVideoAttachment, MAX_COMMENT_ATTACHMENTS } from '~~/shared/utils/attachments'
const bodySchema = z.object({
content: z.string().trim().min(1).max(2000),
@@ -82,6 +82,9 @@ export default defineEventHandler(async (event) => {
const audioMeta = !file.voice && isAudioAttachment({ mimeType, name: filename })
? await extractAudioMeta(`att-${commentId}-${i}`, data, mimeType)
: null
const videoThumb = !file.voice && isVideoAttachment({ mimeType, name: filename })
? await extractVideoThumb(`att-${commentId}-${i}`, join(attachmentsDir(), storedName))
: null
const meta = file.voice ? { voice: true } : (audioMeta?.meta ?? null)
const [row] = await db.insert(commentAttachments).values({
commentId,
@@ -89,7 +92,7 @@ export default defineEventHandler(async (event) => {
originalName: filename.slice(0, 255),
mimeType,
size: data.length,
cover: audioMeta?.cover ?? null,
cover: videoThumb ?? audioMeta?.cover ?? null,
meta,
})
attachments.push({
@@ -98,7 +101,7 @@ export default defineEventHandler(async (event) => {
url: `/uploads/attachments/${storedName}`,
mimeType,
size: data.length,
cover: audioMeta?.cover ?? null,
cover: videoThumb ?? audioMeta?.cover ?? null,
meta,
})
}
+11 -3
View File
@@ -64,6 +64,9 @@ export default defineEventHandler(async (event) => {
const audioMeta = media.type === 'audio'
? await extractAudioMeta(id, media.data, media.mimeType)
: null
const videoThumb = media.type === 'video'
? await extractVideoThumb(id, join(uploadDir(), fileName))
: null
await db.insert(uploads).values({
id,
userId: user.id,
@@ -72,7 +75,7 @@ export default defineEventHandler(async (event) => {
originalName: decodeURIComponent(basename(new URL(body.url).pathname) || body.url).slice(0, 255),
mimeType: media.mimeType.slice(0, 100),
size: media.data.length,
previewImage: audioMeta?.cover ?? null,
previewImage: videoThumb ?? audioMeta?.cover ?? null,
audioMeta: audioMeta?.meta ?? null,
})
await ensureThreadSubscription(id, user.id)
@@ -84,7 +87,9 @@ export default defineEventHandler(async (event) => {
type === 'link' || type === 'twitch' ? fetchLinkPreview(body.url) : null,
twitchTarget ? fetchTwitchPreview(twitchTarget) : null,
])
const remotePreviewImage = twitchPreview?.image ?? preview?.image ?? null
const embedId = type === 'youtube' ? getYoutubeId(body.url) : null
const remotePreviewImage = twitchPreview?.image ?? preview?.image
?? (embedId ? youtubeThumbUrl(embedId) : null)
const previewImage = remotePreviewImage
? (await savePreviewImage(id, remotePreviewImage)) ?? remotePreviewImage
: null
@@ -137,6 +142,9 @@ export default defineEventHandler(async (event) => {
const audioMeta = type === 'audio'
? await extractAudioMeta(id, file.data, mimeType)
: null
const videoThumb = type === 'video'
? await extractVideoThumb(id, join(uploadDir(), fileName))
: null
await db.insert(uploads).values({
id,
userId: user.id,
@@ -145,7 +153,7 @@ export default defineEventHandler(async (event) => {
originalName: (file.filename ?? fileName).slice(0, 255),
mimeType: (mimeType || 'application/octet-stream').slice(0, 100),
size: file.data.length,
previewImage: audioMeta?.cover ?? null,
previewImage: videoThumb ?? audioMeta?.cover ?? null,
audioMeta: audioMeta?.meta ?? null,
})
+2 -3
View File
@@ -25,9 +25,8 @@ export default defineEventHandler(async (event) => {
return rows.map((row) => {
const url = row.externalUrl ?? `/uploads/${row.fileName}`
const embedId = row.type === 'youtube' && row.externalUrl ? getYoutubeId(row.externalUrl) : null
const thumbUrl = row.type === 'youtube' && embedId
? youtubeThumbUrl(embedId)
: row.type === 'image' ? url : row.type === 'link' || row.type === 'twitch' || row.type === 'audio' ? row.previewImage : null
const thumbUrl = row.previewImage
?? (row.type === 'youtube' && embedId ? youtubeThumbUrl(embedId) : row.type === 'image' ? url : null)
return { id: row.id, thumbUrl }
})
})
+2 -3
View File
@@ -37,9 +37,8 @@ export default defineEventHandler(async (event) => {
const items = (pages[page - 1] ?? []).map((row) => {
const url = row.externalUrl ?? `/uploads/${row.fileName}`
const embedId = row.type === 'youtube' && row.externalUrl ? getYoutubeId(row.externalUrl) : null
const thumbUrl = row.type === 'youtube' && embedId
? youtubeThumbUrl(embedId)
: row.type === 'image' ? url : row.type === 'link' || row.type === 'twitch' || row.type === 'audio' ? row.previewImage : null
const thumbUrl = row.previewImage
?? (row.type === 'youtube' && embedId ? youtubeThumbUrl(embedId) : row.type === 'image' ? url : null)
return { ...row, url, thumbUrl, userAvatarUrl: avatarUrl(row.userAvatar) }
})