2012-02-07 52 views
2

我有像这样构成的网页上的图像:上传图像(作为数据:图像/ PNG:BASE64)到网络服务器

<img src="data:image/png;base64;...." /> 

来自用户粘贴到浏览器中的图像的内容。我的问题是如何将图像上传到网络服务器(如果重要的话)。

+0

你的意思是在例如一个textarea粘贴?这听起来很奇怪......你能解释一下情况吗? – giorgio 2012-02-07 23:44:07

+0

我有一个输入,当用户将图像数据粘贴到它(即从剪贴板 - 仅在Chrome浏览器)它将数据分配给图像作为预览之前它上传 – Chris 2012-02-07 23:59:58

+0

@Chris如果你想看到一个实际的js代码展示你已经拥有的东西,而不仅仅是一小部分不相关的东西。 – Cheery 2012-02-08 00:01:38

回答

7

1)取提交用户使用javascript src属性(或数据)

2)将其提交到服务器“是”或切开后base64;(AJAX或POST,GET方法是提交的所有信息可能不太适合大图像)

3)解码服务器端的base64(如果没有切割,则在base64;之后的所有内容),将结果保存为二进制 - 它是一个图像。

就是这样。

ps:只是一个提醒 - 通过小心可能的代码注入。检查提交的数据或有人将上传编码的PHP脚本。在上传的文件夹中禁用PHP引擎,并验证最终结果是一个实际的图像(例如在GD库的帮助下)。即使脚本无法在您的服务器上运行,它也可以用于使用php脚本对其他服务器的恶意请求。

+0

Thankyou,有没有更简单的方法来防止代码注入? – Chris 2012-02-08 00:19:45

+2

@Chris在将数据保存到服务器之前,您必须验证数据。正如我写的,你可以检查你可以通过GD模块获得图像的宽度和高度。下一步不是保存用户提供的文件扩展名的数据。我会尝试在不改变参数的情况下调整图像大小,保存结果。这样你可以确定你只有通过GD的数据。 – Cheery 2012-02-08 00:24:11

1

只需将base 64编码文本发布到您的服务器。

你可以将它保存为...

file_put_contents($image, base64_decode($str));