• 关于国内某个软件代理商代理的CorelDRAW系列软件,如果各位需要正版请访问corel官方网站,不要访问带有china的网站!!!反正话是放在这里了,听不听随你
  • 感谢访问,请访问https://alipay.vnas.me领取支付宝红包
  • 如果遇到文章图片不显示请联系管理员处理,谢谢
  • 欢迎访问寡人的吐槽胜地,我们真的只是吐槽,不谈技术,推荐使用最新版火狐浏览器和Chrome浏览器访问本网站
  • 感谢访问,请访问https://alipay.vnas.me领取支付宝红包
  • 版权声明:大部分文章是从网上复制的!并不表示全部都是从网上复制的!
  • 感谢访问,请访问https://alipay.vnas.me领取支付宝红包
  • 如果遇到文章图片不显示请联系管理员处理,谢谢
  • 关于国内某个软件代理商代理的CorelDRAW系列软件,如果各位需要正版请访问corel官方网站,不要访问带有china的网站!!!反正话是放在这里了,听不听随你
  • 如果遇到文章图片不显示请联系管理员处理,谢谢

PHP中的HTML5应用 将Canvas图像保存到服务器

aha,转载 大变态 2年前 (2016-10-31) 65次浏览 已收录 0个评论 扫描二维码

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

这样的一个需求在当时是让我大费周折,但如今想起来,如果用 html5 的 canvas 实现,真是太简单了。在《将画布(canvas)图像保存成本地图片的方法》这篇文章里就有一个只用了几行代码就实现了的画板功能——很简单,虽然有一个小 bug——但完全能当作签名用。

我之前说了很多如何将 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 进行解码,保存成文件。我在上篇文章中提到的那个火狐浏览器的微博图文分享工具,在服务器端就是用到了这段代码。

有一天你也会需要用到它的,很有用的代码,收藏一下吧!


本站大部分资源收集于网络,只做学习和交流使用,版权归原作者所有;若为付费内容,请在下载后 24 小时之内自觉删除,若作商业用途请购买正版;如果有版权争议,请发送邮件至 master@digac.cc(请留下写明原因和文章链接),我们将及时处理,谢谢!

喜欢 (0)
大变态
关于作者:
发表我的评论
取消评论

表情 贴图 加粗 删除线 居中 斜体 签到

Hi,您需要填写昵称和邮箱!

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址
IP Blocking Protection is enabled by IP Address Blocker from LionScripts.com.