使用文件名查找并替换多个base64图像

Question

Before I start, I am using Laravel 5.7 for my project but any php solution would work. I am making a simple editor on my site where user can do simple editing along with adding images. I am using contenteditable div for this purpose. When I add images to the div it gets added as base64 image. After submitting the form I want to save those images as files on server side and then want to replace the src of those images with the path to newly save images in the string before saving it in database. I didn't find a way to submit contenteditable div so I am transfering all the text from div to a hidden textarea before submitting. correct me if there is any other reliable way of doing that. Here is what I am looking for:

Original sample content of textarea in request :-

"This is a test post with some images like this one 
<img src="data:image/jpeg;base64,/9j.....long base 64 string...." id="img02">
and it can contain more than one images like here is the second image
<img src="data:image/png;base64,/8Aue.....long base 64 string...." id="img01">
and more images like this"

Intended output :-

"This is a test post with some images like this one  
<img src="my_public_path/Unique_file_name.jpg" id="img02"> 
and it can contain more than one images like here is the second image 
<img src="my_public_path/Unique_file_name.png" id="img01"> 
and more images like this"

Can someone please point me in the right direction or provide me with the php code to achieve this?

Answer 1

I eventually solved my problem with following code. I am posting it here just in case someone else need it.

$stt = $request->storytextTemp; // string containing base64 encoded image files.
preg_match('#data:image/(gif|png|jpeg);base64,([\w=+/]++)#', $stt, $x);
while(isset($x[0]))
{
    $imgdata = base64_decode($x[0]);
    $info = explode(";", explode("/", $x[0])[1])[0];
    $textareaImages = $request->imagesTextarea;

    $imm = Image::make(file_get_contents($x[0]));
    $imp = public_path().'/images/tempStoryImages/';
    $imn = date('y_m_d') . "_" . uniqid().".".$info;
    $imm->save($imp.$imn);

    $stt = str_replace($x[0], 'http://127.0.0.1:8000/images/tempStoryImages/'.$imn, $stt);
    preg_match('#data:image/(gif|png|jpeg);base64,([\w=+/]++)#', $stt, $x);
}
return $stt;

Above programe save all my images in tempStoryImages folder and return html to show all image files. I can now store this returned string into database with image path embeded into it.