Streamlining Media Handling in Breniapp

The Breniapp project focuses on streamlining internal business processes. Recently, we tackled an issue with how media assets were being handled, specifically in the content library.

The Problem

The asset() helper function was generating incorrect URLs for files stored in the public disk, leading to broken links and display issues. This was particularly noticeable with media content like images and videos, as the necessary /storage/ prefix was missing. Furthermore, video content wasn't being rendered correctly in the content library's grid view.

The Solution

To resolve the URL generation issue, we switched to using Storage::disk('public')->url() to construct URLs for media assets. This ensures that the correct /storage/ prefix is always included, guaranteeing that the URLs point to the correct location.

use Illuminate\Support\Facades\Storage;

$url = Storage::disk('public')->url('path/to/file.jpg');
// Example output: /storage/path/to/file.jpg

For instances where a full URL is already provided, we implemented a fallback mechanism to handle those cases gracefully, preventing any broken links.

To address the video rendering problem, we added <video> tag rendering for video content. This allows videos to be displayed and played directly within the content library. We also included a play icon overlay on the grid to visually indicate which items are videos.

<video width="320" height="240" controls>
  <source src="{{ $videoUrl }}" type="video/mp4">
  Your browser does not support the video tag.
</video>

Key Improvements

• Correct URL generation: Ensures media assets are always accessible.
• Video rendering support: Allows direct playback of videos within the content library.
• Improved user experience: Play icon overlay provides visual cues for video content.

Actionable Takeaway

When working with media assets in Laravel applications, always use Storage::disk('public')->url() to generate URLs for files stored in the public disk. This guarantees correct URL generation and prevents broken links, especially when dealing with media content displayed in grid layouts or content libraries.