canvas教程

PHP将HTML5的Canvas图像保存到服务器示例

字号+ 作者:H5之家 来源:H5之家 2016-12-24 13:02 我要评论( )

三零网提供网络编程、 PHP编程 的技术文章PHP将HTML5的Canvas图像保存到服务器示例给大家,希望大家喜欢,关键词PHP将HTML5的Canvas图像保存到服务器示例

在这里为大家带来一篇 PHP将HTML5的Canvas图像保存到服务器示例。希望对您的学习PHP有所帮助。 

一、问题:

在几年前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将HTML5的Canvas图像保存到服务器示例的内容,希望已经解决你的问题。


延伸阅读:
·PHP+HTML5 FormData无刷新上传文件示例
·哪个浏览器更适合用来玩 HTML5 游戏
·php配置网站的 HTML5 视频媒体类型

 

1.本站遵循行业规范,任何转载的稿件都会明确标注作者和来源;2.本站的原创文章,请转载时务必注明文章作者和来源,不尊重原创的行为我们将追究责任;3.作者投稿可能会经我们编辑修改或补充。

相关文章
  • 用canvas实现鼠标拖动绘制矩形框

    用canvas实现鼠标拖动绘制矩形框

    2016-12-24 13:05

  • Canvas的绘图画图制图的基本函数方法

    Canvas的绘图画图制图的基本函数方法

    2016-12-24 11:02

  • 【HTML5 canvas中 drawImage()画图第一次加载只出现最后一个图,

    【HTML5 canvas中 drawImage()画图第一次加载只出现最后一个图,

    2016-12-24 11:01

  • wpf canvas 相对定位

    wpf canvas 相对定位

    2016-12-23 15:05

网友点评