How to insert canvas image into the database after i converting to base64

Question

Javascript

document.getElementById("input1").value=canvas.toDataURL('image/png');

codetreatment.php

 $data = $_POST["input1"];
    $data = str_replace('data:image/png;base64,', '', $data);
    $data = str_replace(' ','+',$data);

    $data = base64_decode($data);

php:

    <form action="codetreatment.php" method="post">
 <input type="text" name="input1" id="input1" >
     <button  type="submit" name="treatmenthistoryupdatebtn" class="btn btn-primary">Save</button>
</form>

But this code for database didn't work.

What is the next step after converting the canvas image to base64 string? I want to save to the database

May be than store it on the file system and store file path instead. — Dipen Shah, Mar 02 '20 at 03:24
what is your suggestion to save canvas image to the database? Sorry, sir, I'm a newbie here and just a student — cui, Mar 02 '20 at 03:26
There are already few answers on SO, you can search for that. One that I could find is: https://stackoverflow.com/questions/11511511/how-to-save-a-png-image-server-side-from-a-base64-data-string — Dipen Shah, Mar 02 '20 at 03:31

score 2 · Accepted Answer · answered Mar 02 '20 at 04:44

2

DATABASE

$data = $_POST["input1"];       
$data = explode(",", $data)[1];
$decoded_image = base64_decode($data);
$temp_name = 'http://your-domain.com/folder/'.md5(time().rand().time()).".png";
file_put_contents($temp_name, $decoded_image);
// Store this $file to table.
$file = basename($temp_name);

answered Mar 02 '20 at 04:44

Sumeet Amipara

40
1
5

Comments are not for extended discussion; this conversation has been [moved to chat](https://chat.stackoverflow.com/rooms/208830/discussion-on-answer-by-sumeet-amipara-how-to-insert-canvas-image-into-the-datab). – Samuel Liew Mar 02 '20 at 08:47

How to insert canvas image into the database after i converting to base64

1 Answers1