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

yipeiwu_com7年前服务器

本文实例讲述了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程序设计有所帮助。

相关文章

php实现监控varnish缓存服务器的状态

php实现监控varnish缓存服务器的状态

当varnish和网站部署在同一台服务器上的时候,我们不可能随时登录上服务器去查看varnish的命中率,没想到有大神早就写了出来,今天就分享给大家,使用网页查看varnish命中率。...

wamp服务器访问php非常缓慢的解决过程

wamp这两天明显比以前访问要慢很多,重启了下,刚开始还有效,后来重启也没用,就在网上查了下原因,分享给需要的朋友。 可能原因1、apache  access.log文件过大...

利用django+wechat-python-sdk 创建微信服务器接入的方法

利用django+wechat-python-sdk 创建微信服务器接入的方法

1、版本说明 :python 2.7.10, Django (1.6.11.6),centos7 2、步骤说明: A、django 建立项目 django-admin.py star...

python3实现微型的web服务器

实验目的:用socket 模拟一个微型的web服务器,当py脚本run起后,实微型web server架起了,然后用本地浏览器访问127.0.0.1:8080(web serv...

Python实现一个服务器监听多个客户端请求

Python实现一个服务器监听多个客户端请求

学习Python网络通信的时候发现书上只有一个服务端对应一个客户端的情形,于是自己想自己动手实现一个服务端响应多个客户端。 首先建立服务器的socket来监听客户端的请求: tcpS...