【问题标题】:Uploading image (as data:image/png:base64) to webserver将图像(作为 data:image/png:base64)上传到网络服务器
【发布时间】:2012-02-29 10:38:36
【问题描述】:

我在这样构建的网页上有一张图片:

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

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

【问题讨论】:

  • 您的意思是例如粘贴到文本区域中吗?这听起来很奇怪……你能再解释一下这种情况吗?
  • 我有一个输入,当用户将图像数据粘贴到其中时(即从剪贴板 - 仅在 Chrome 中),它会在上传之前将数据分配给图像作为预览
  • @Chris 如果你想看到一个实际的 js 代码展示你已经拥有的东西,而不仅仅是一小部分无关的。
  • 我现在完全明白了:) @Cheery 给了你一个很好的答案!

标签: php javascript jquery forms file-upload


【解决方案1】:

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

2) 按原样提交到服务器或在base64; 之后剪切并提交所有内容(AJAX 或 POST,GET 方法在这里可能不太适合大图像)

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

就是这样。

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

【讨论】:

  • 谢谢,有没有更简单的方法来防止代码注入?
  • @Chris 您必须先验证数据,然后才能将其保存在服务器上。正如我所写的,您可以检查您是否能够通过 GD 模块获取图像的宽度和高度。下一步是不使用用户提供的文件扩展名保存数据。我会尝试在不更改参数的情况下“调整”图像大小,保存结果。这样您就可以确定您只有通过 GD 传递的数据。
【解决方案2】:

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

您可以将其另存为...

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

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2019-02-06
    • 2014-09-22
    相关资源
    最近更新 更多