PHP实现将HTML5中Canvas图像保存到服务器的方法

yipeiwu_com5年前服务器

本文实例讲述了PHP实现将HTML5中Canvas图像保存到服务器的方法。分享给大家供大家参考。具体实现方法如下:

一、问题:

在几年前HTML5还没有流行的时候,我们的项目经理曾经向我提出这样一个需求:让项目评审专家们在评审结束时用笔在平板电脑上进行电子签名。这需要我们评审软件里提供这样一个功能:打开浏览器,登录,进入评审意见页,页面最下部有个方块区域,用户在这里用触摸笔进行签名,然后这个签名将会保持的服务器上。

这样的一个需求在当时是让我大费周折,但如今想起来,如果用html5的canvas实现,真是太简单了。在《在HTML5 Canvas中放入图片和保存为图片的方法》这篇文章里就实现了这一功能。

二、解决方法:

之前说了很多如何将canvas图像保存成图片并下载的方法,但这些方法都是将图片保存到客户端,而我们的签名需求是需要将canvas的内容保存到服务器端,如何实现?

其实很简单,看完下面的这段PHP代码,相信你也会觉得很简单。

复制代码 代码如下:
<?php
 // 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.';
?>

从网页上传到服务器端的图片是base64_encode转码过的Data URL格式,数据在服务器端用base64_decode进行解码,保存成文件。

或许有一天你也会需要用到它的,觉得很有用的话就收藏一下吧!

希望本文所述对大家的PHP程序设计有所帮助。

相关文章

详解Python程序与服务器连接的WSGI接口

详解Python程序与服务器连接的WSGI接口

了解了HTTP协议和HTML文档,我们其实就明白了一个Web应用的本质就是:     浏览器发送一个HTTP请求;   &nb...

PHP编写文件多服务器同步程序

本文实例为大家分享了PHP文件多服务器同步工具,具体内容如下 <?php header('Content-type:text/html;charset=utf-8');...

详解Python下ftp上传文件linux服务器

详解Python下ftp上传文件linux服务器

模块介绍: from ftplib import FTP ftp = FTP() #设置变量 ftp.set_debuglevel(2) #打开调试级别2 显示详细信息 ftp...

phpmailer在服务器上不能正常发送邮件的解决办法

phpmailer本身是一个很不错的开源邮件类,也非常的易用简单,就是偶尔会出现程序上传到服务器上不能发送邮件的情况,在之前也有同学问过我这个问题,当时的时候总是不以为然,今天终于让我碰...

仅用50行Python代码实现一个简单的代理服务器

之前遇到一个场景是这样的: 我在自己的电脑上需要用mongodb图形客户端,但是mongodb的服务器地址没有对外网开放,只能通过先登录主机A,然后再从A连接mongodb服务器B。 本...