PHP implements the method of saving Canvas images in HTML5 to the server, html5canvas_PHP tutorial

PHP implements the method of saving Canvas images in HTML5 to the server, html5canvas

The example in this article describes how PHP implements saving Canvas images in HTML5 to the server. Share it with everyone for your reference. The specific implementation method is as follows:

1. Question:

A few years ago, when HTML5 was not yet popular, our project manager once asked me to ask project review experts to use a pen to electronically sign on a tablet at the end of the review. This requires our review software to provide such a function: open the browser, log in, and enter the review opinion page. There is a square area at the bottom of the page where the user signs with a touch pen, and then the signature will be saved on the server.

Such a requirement cost me a lot of trouble at the time, but now that I think about it, it would be so simple if I used HTML5 canvas to implement it. This function is implemented in the article "Methods to put pictures in HTML5 Canvas and save them as pictures".

2. Solution:

There are many ways to save canvas images as pictures and download them before, but these methods all save the pictures to the client, and our signature requirement is to save the contents of the canvas to the server. How to achieve this?

It’s actually very simple. After reading the PHP code below, I believe you will also find it very simple.

Copy code The code is as follows:

// requires php5
define('UPLOAD_DIR', 'images/');
$img = $_POST['img'];
$img = str_replace('data:image/png;base64,', '', $img);
$img = str_replace(' ', '+', $img);
$data = base64_decode($img);
$file = UPLOAD_DIR . uniqid() . '.png';
$success = file_put_contents($file, $data);
print $success ? $file : 'Unable to save the file.';
?>

The pictures uploaded from the web page to the server are in the Data URL format transcoded by base64_encode. The data is decoded by base64_decode on the server side and saved as a file.

Maybe you will need to use it one day. If you find it useful, just save it!

I hope this article will be helpful to everyone’s PHP programming design.

http://www.bkjia.com/PHPjc/919258.htmlwww.bkjia.comtruehttp: //www.bkjia.com/PHPjc/919258.htmlTechArticlePHP implements the method of saving Canvas images in HTML5 to the server, html5canvas This article describes the example of PHP implementing Canvas in HTML5 Method for saving images to the server. Share it with everyone for your reference...