Laravel API store and retrieve base64 images in Storage - php

Question

I am working with Angular and Laravel on a project where I have destinations table
And I need to store destinations, and for every destination there is multiple images I need to store
So there is destination_images table, I made one-to-many relationship between the tables
So I have two models: Destination - DestinationImage
The store Laravel function
public function store(Request $request) {
$validator = Validator::make($request->all(), [
'name' => 'required|string|max:100',
'description' => 'required'
]);
if ($validator->fails()) {
$errors = $validator->errors();
return response()->json($errors);
}
$destination = Destination::create([
'name' => $request->name,
'description' => $request->description
]);
foreach ($request->fileSource as $img_code) {
$ext = explode('/', mime_content_type($img_code))[1];
$img_name = uniqid() . ".$ext";
$decoded_img = base64_decode($img_code);
$path = Storage::put('uploads/destinations' . $img_name, $decoded_img);
DestinationImage::create([
'destination_id' => $destination->id,
'img' => $img_name
]);
}
return response()->json('Destination Added Successfully');
}
and it stores the file successfully but now I need to retrieve the images from Laravel storage and show it in Angular so I made this function
public function view($id) {
$destination = Destination::findOrFail($id);
$destination_images = $destination->destination_images;
foreach ($destination_images as $destination_image) {
$url = Storage::url($destination_image->img);
return response()->json($url);
}
}
but the response is not completed url it's just "/storage/62a7056a5d8c6.png"
Please anyone can help me how to maintain the view function to show the images in Angular?

Answer 1

You are using storage path mean while client can't access to it.
First you need to enable storage link php artisan storage:link and it should able to access http://yourdomain.com/storage/62a7056a5d8c6.png
$image = App\Models\DestinationImage::find(1);
echo url("/destination_images/{$image->id}");
use Illuminate\Support\Facades\Storage;
public function view($id) {
$destination = Destination::findOrFail($id);
$destination_images = $destination->destination_images;
$imageList = [];
foreach ($destination_images as $destination_image) {
$imageList[] = Storage::url($destination_image->img);
return response()->json($imageList);
}
}