CODEWITHSUNDEEP
phplaravelintervention
Auxulry
Auxulry

Reputation: 193

Save value Base64 to Image PNG use Intervention image Laravel Storage

How can I convert Base64 value to Image PNG using intervention image and laravel storage?

public function userLogout(Request $request) {
  $data = $request->all();
  if ($request->isMethod('post')) {
    $poster = explode(";base64", $request->picture);
    $image_type = explode("image/", $poster[0]);
    $mime_type = '.'.$image_type[1];
    $image_base = base64_decode($poster[1]);

    $data['picture'] = Storage::disk('player-images')->put($image_base, file_get_contents($poster));

    $path = public_path('storage/player-images/'.$image_base);

    Image::make($poster)->save($path);

    $data['picture'] = 'player-images/' . $image_base;
    User::where('name', Auth::user()->name)->update($data);

  }
  return view('gallery');
}

i got an error message:

"file_get_contents() expects parameter 1 to be a valid path, array given"

and here is my ajax function

var canvas = document.getElementById('canvas');
var dataUrl = canvas.toDataURL('image/png');
$(document).ready(function(){
    $('#save').click(function(e){
        e.preventDefault();

        $.ajax({
          headers: {'X-CSRF-TOKEN': $('meta[name="csrf_token"]').attr('content')},
          type: "POST",
          url: "/gallery",
          data: {
            picture: dataUrl,
          }
        }).done(function(o) {
            console.log("saved");
        });
    });
});

How can i save the base64 value to database like player-images/blabla.png and store image to path public/storage/player-images/

sorry, my English is bad. thanks.

Upvotes: 0

Views: 3696

Answers (2)

Auxulry
Auxulry

Reputation: 193

I solved it!. I changed the function in controller like this.

public function userLogout(Request $request)
{
  $data = $request->all();

  if ($request->isMethod('post')) {
    if (preg_match('/^data:image\/(\w+);base64,/', $data['picture'])) {
      $value = substr($data['picture'], strpos($data['picture'], ',') + 1);
      $value = base64_decode($value);
      $imageName = time()  . '.png';
      $val = Storage::disk('player-images')->put($imageName, $value);

      $path = public_path('storage/player-images/'.$imageName);
      Image::make($data['picture'])->resize(304, 277)->save($path);

      $data['picture'] = 'player-images/' . $imageName;
      User::where('name', Auth::user()->name)->update(['picture' => $data['picture']]);
    }
  }
  return view('gallery');
}

Upvotes: 1

Lucas Franson
Lucas Franson

Reputation: 11

I know that probably you solved your doubt, but I was looking for something similar and I didn't find it, so I will leave the following code for someone that may need it. The goal of this code is to get an image from Pixabay using an URL.

My solution for something similar:

public function store(){       
    $url = json_decode(request('photo')); //Photo is the field that I fill in the view, that contain a URL to my image in pixabay;
    $contents = file_get_contents($url);
    $name = substr($url, strrpos($url, '/') + 1);
    $blob =  base64_encode($this->resizeImage($contents));
    Photos::firstOrCreate(['photo' => $name,'thumb' => $blob]); //Photos is my model
}      

private function resizeImage($contents) : string {
    return (string) Image::make($contents)->resize(75, 75)->encode('data-url');  // Very important this cast to String, without it you can not save correctly the binary in your DB;   
}

View: For use the code in my view I put: When I return to view the Model I use a 'for' to print all images, like that:

@foreach($photos as $element)
    <img src="{{ base64_decode($element->thumb) }}" alt="" >
@endforeach

#Warning Is very important you have a Blob field in your DB, so in your Schema on Laravel Migrate you have to put something as: $table->binary('thumb');

You can check my code on my git: lucasfranson10/multisafepay

Upvotes: 1

Related Questions