有没有一种方法可以用HTTPPOST检索的数据加载Javascript中的图像

Is there a way to load an Image in Javascript with data retrieved via an HTTP POST?

本文关键字:检索 HTTPPOST 数据 加载 图像 Javascript 一种 方法 有没有      更新时间:2023-09-26

是否有任何方法可以使用AJAX通过HTTPPOST请求图像文件,然后用HTML中的数据创建新的图像?既然你不能用IMG标签来做这件事,那么有可能用Image javascript对象来做吗?

是的,这是可能的。

当您的服务器脚本打开图像文件并将其编码为base64字符串时,几乎所有浏览器(IE7及以下版本除外)都可以处理。例如:

jQuery('<img>', {
    src: 'data:image/jpeg;base64,' + someBase64EncodedString
}).appendTo(document.body);

现实世界中的一个例子可以在这里找到:https://github.com/jAndreas/Supply

您可能想要了解如何将base64编码的数据嵌入为图像。

这是一篇带你浏览的文章。

http://danielmclaren.com/node/90

尝试查看此处:http://emilsblog.lerch.org/2009/07/javascript-hacks-using-xhr-to-load.html

如果它返回base64编码的图像数据,您可能会使用数据URI和Canvas。

一些"伪"代码(使用PHP和JS+jQuery)来演示您可以做什么

服务器:

$image = new Imagick($imagePath);
echo 'data:image/png;base64,' . base64_encode($image);

客户:

$.ajax({
   method: "post",
   url: "/foo/bar.php",
   success: function (data) {
      $("<img />").attr("src", data).appendTo("#myContainer");
   }
});