Image doesn't load after encoding blob from database(php,mysql,laravel) - mysql

Question

I'm trying to create a picture for every contact.
this is the store() method in my controller:
public function store()
{
$attributes = request()->validate([
'user_id' => ['required'],
'avatar' => ['required',],
'ime' => ['required', 'min:3'],
'prezime' => ['required', 'min:3'],
'broj' => ['required', 'min:3'],
]);
Kontakt::create($attributes);
return redirect('/imenikk');
}
this is the create.blade.php:
<form method="POST" action="/imenikk">
{{ csrf_field() }}
<div class="container text-center">
<label for="ime">Ime</label>
<input type="text" class="form-control text-center" name="ime"
placeholder="Ime">
<label for="prezime">Prezime</label>
<input type="text" class="form-control text-center" name="prezime"
placeholder="Prezime">
<label for="broj">Broj</label>
<input type="text" class="form-control text-center" name="broj"
placeholder="Broj">
<br>
<input type="file" name="avatar" accept="image/*">
<br>
<input type="hidden" name="user_id" value='{{$user_id}}'>
<button type="submit" class="btn btn-primary">Dodaj
</div>
</form>
And this is on show.blade.php:
<img src="data:image/jpg;base64,{{ chunk_split(base64_encode($imenikk->avatar)) }}" height="500" width="500">
<img src ="data:image/jpeg;base64,{{base64_encode($imenikk->avatar)}}" height="200" width="200">
Neither of these 2 are working.. I get this but the image doesn't load:
<img src="data:image/jpg;base64,SU1HXzYxODQuSlBH" height="500" width="500">
This is how my db looks when I create a contact with picture:
Also I have managed to decode this
img src="data:image/jpg;base64,SU1HXzYxODQuSlBH
and I get the image name when I decode it yet the page still doesn't display the image.

Answer 1

It seems your base64 code is wrong.
Try to get the real base64 code from image file, and store in database.
public function store()
{
$attributes = request()->validate([
'user_id' => ['required'],
'avatar' => ['required',],
'ime' => ['required', 'min:3'],
'prezime' => ['required', 'min:3'],
'broj' => ['required', 'min:3'],
]);
$file = request()->file('avatar');
$imagedata = file_get_contents($file->getRealPath());;
$base64 = base64_encode($imagedata);
$attributes['avatar'] = $base64;
Kontakt::create($attributes);
return redirect('/imenikk');
}
then store it in your field,
and display it like this:
<img src={{ "data:image/jpg;base64,".$imenikk->avatar }} height="500" width="500">