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


Posted in PHP onNovember 28, 2014

本文实例讲述了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 相关文章推荐
php实现获取文章内容第一张图片的方法
Nov 04 PHP
PHP队列用法实例
Nov 05 PHP
php常用的url处理函数总结
Nov 19 PHP
php计划任务之ignore_user_abort函数实现方法
Jan 08 PHP
php post大量数据时发现数据丢失问题解决方法
Jun 20 PHP
php精确的统计在线人数的方法
Oct 21 PHP
php生成酷炫的四个字符验证码
Apr 22 PHP
学习PHP Cookie处理函数
Aug 09 PHP
Yii2.0 Basic代码中路由链接被转义的处理方法
Sep 21 PHP
PHP实现文件下载【实例分享】
Apr 28 PHP
php7基于递归实现删除空文件夹的方法示例
Jun 15 PHP
PHP安装memcache扩展的步骤讲解
Feb 14 PHP
PHP使用get_headers函数判断远程文件是否存在的方法
Nov 28 #PHP
php的mssql数据库连接类实例
Nov 28 #PHP
smarty中post用法实例
Nov 28 #PHP
smarty简单入门实例
Nov 28 #PHP
php最简单的删除目录与文件实现方法
Nov 28 #PHP
php查找指定目录下指定大小文件的方法
Nov 28 #PHP
thinkphp四种url访问方式详解
Nov 28 #PHP
You might like
php 正则匹配函数体
2009/08/25 PHP
php实现邮件发送并带有附件
2014/01/24 PHP
Php连接及读取和写入mysql数据库的常用代码
2014/08/11 PHP
php获取指定(访客)IP所有信息(地址、邮政编码、国家、经纬度等)的方法
2015/07/06 PHP
PHP Swoole异步MySQL客户端实现方法示例
2019/10/24 PHP
JavaScript 学习笔记(十六) js事件
2010/02/01 Javascript
JS 密码强度验证(兼容IE,火狐,谷歌)
2010/03/15 Javascript
Jquery Ajax学习实例7 Ajax所有过程事件分析示例
2010/03/23 Javascript
JQuery 插件制作实践 xMarquee插件V1.0
2010/04/02 Javascript
JS中confirm,alert,prompt函数区别分析
2011/01/17 Javascript
JavaScript获取flash对象与网上的有所不同
2014/04/21 Javascript
通过jquery 获取URL参数并进行转码
2014/08/18 Javascript
使用jQuery或者原生js实现鼠标滚动加载页面新数据
2016/03/06 Javascript
jQuery实现对象转为url参数的方法
2017/01/11 Javascript
Vue-Router基础学习笔记(小结)
2018/10/15 Javascript
js尾调用优化的实现
2019/05/23 Javascript
新手如何快速理解js异步编程
2019/06/24 Javascript
详解微信小程序图片地扯转base64解决方案
2019/08/18 Javascript
ng-alain的sf如何自定义部件的流程
2020/06/12 Javascript
[07:54]DOTA2 MV《我的动力鞋》 ImbaTV 出品
2014/11/21 DOTA
机器学习经典算法-logistic回归代码详解
2017/12/22 Python
python 通过字符串调用对象属性或方法的实例讲解
2018/04/21 Python
python:print格式化输出到文件的实例
2018/05/14 Python
Python基于Opencv来快速实现人脸识别过程详解(完整版)
2019/07/11 Python
如何用 Python 处理不平衡数据集
2021/01/04 Python
银行柜员应聘推荐信范文
2013/11/24 职场文书
青年文明号复核材料
2014/02/11 职场文书
应届生求职信
2014/05/31 职场文书
敬老院献爱心活动总结
2014/07/08 职场文书
学生会干部自我鉴定2014
2014/09/18 职场文书
2014年镇党建工作汇报材料
2014/11/02 职场文书
2014年图书管理员工作总结
2014/12/01 职场文书
幼儿园重阳节活动总结
2015/05/05 职场文书
2019员工保密协议书(3篇)
2019/09/23 职场文书
vue3种table表格选项个数的控制方法
2022/04/14 Vue.js
Python加密与解密模块hashlib与hmac
2022/06/05 Python