sebastjan/videofolxtv
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix video playback issues and enable proper thumbnail display on platform

Browse Source 
Improves video thumbnail handling and video playback using BunnyCDN embed URLs and direct thumbnail proxying.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 50814a1e-92e4-4968-856f-7bc7eedf5e8f
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/50814a1e-92e4-4968-856f-7bc7eedf5e8f/BH7V9Na
This commit is contained in:
sebastjanartic 2025-08-04 19:00:48 +00:00
parent 7c082b287e
commit 1d85507429
2 changed files with 15 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
server/bunny.ts
View File

@ -52,11 +52,10 @@ export class BunnyService {
} }
private bunnyVideoToVideo(bunnyVideo: BunnyVideo): Video { private bunnyVideoToVideo(bunnyVideo: BunnyVideo): Video {
// Use proxy endpoint for thumbnails since Bunny videos are private // Use proxy endpoint for thumbnails to handle private access
const thumbnailUrl = `/thumbnail/${bunnyVideo.guid}`; const thumbnailUrl = `/thumbnail/${bunnyVideo.guid}`;
// For private videos, we'll use an iframe embed URL which handles authentication // For private videos, use iframe embed which properly handles private video authentication
// Enable controls, allow fullscreen, and ensure player functionality
const videoUrl = `https://iframe.mediadelivery.net/embed/${this.libraryId}/${bunnyVideo.guid}?controls=true&autoplay=false&preload=metadata`; const videoUrl = `https://iframe.mediadelivery.net/embed/${this.libraryId}/${bunnyVideo.guid}?controls=true&autoplay=false&preload=metadata`;
return { return {

17
server/routes.ts
View File

@ -121,13 +121,22 @@ export async function registerRoutes(app: Express): Promise<Server> {
app.get("/thumbnail/:videoId", async (req, res) => { app.get("/thumbnail/:videoId", async (req, res) => {
try { try {
const { videoId } = req.params; const { videoId } = req.params;
const thumbnailUrl = `https://iframe.mediadelivery.net/embed/${process.env.BUNNY_LIBRARY_ID}/${videoId}`; const hostname = process.env.BUNNY_HOSTNAME!;
const thumbnailUrl = `https://${hostname}/${videoId}/thumbnail.jpg`;
// For now, redirect to a placeholder since we can't access private thumbnails directly // Attempt to fetch and proxy the thumbnail
res.redirect(`https://picsum.photos/800/450?random=${videoId.slice(0, 8)}`); const response = await fetch(thumbnailUrl);
if (response.ok) {
res.set('Content-Type', response.headers.get('content-type') || 'image/jpeg');
const buffer = await response.arrayBuffer();
res.send(Buffer.from(buffer));
} else {
// Fallback to a music-themed placeholder
res.redirect(`https://images.unsplash.com/photo-1493225457124-a3eb161ffa5f?ixlib=rb-4.0.3&auto=format&fit=crop&w=800&h=450`);
}
} catch (error) { } catch (error) {
console.error("Error proxying thumbnail:", error); console.error("Error proxying thumbnail:", error);
res.status(404).send("Thumbnail not found"); res.redirect(`https://images.unsplash.com/photo-1493225457124-a3eb161ffa5f?ixlib=rb-4.0.3&auto=format&fit=crop&w=800&h=450`);
} }
}); });