Level 58
To embed and play .mp3 files in your Blade view, you need to ensure that:
- The files are accessible via a public URL.
- You use the correct path in your
<audio>tag.
Since you mentioned that your files are in storage/app/public and you have set up the storage symlink (php artisan storage:link), your files should be accessible via the storage directory in your public path.
Example:
If you have a file at storage/app/public/audio/song.mp3, it will be accessible at yourdomain.com/storage/audio/song.mp3.
Blade Example:
<audio controls>
<source src="{{ asset('storage/audio/song.mp3') }}" type="audio/mpeg">
Your browser does not support the audio element.
</audio>
If you have multiple files:
@foreach ($songs as $song)
<p>{{ $song->title }}</p>
<audio controls>
<source src="{{ asset('storage/audio/' . $song->filename) }}" type="audio/mpeg">
Your browser does not support the audio element.
</audio>
@endforeach
Checklist:
- Make sure the file exists in
storage/app/public/audio/song.mp3. - Make sure the storage symlink exists:
public/storage→storage/app/public. - Use the
asset('storage/...')helper to generate the correct URL.
If you follow these steps, your .mp3 files should play correctly in your Blade view.
