Question

我不知道我是否遗漏了一些东西，但我无法在javascript中收到图像（二进制）。我可以在iPhone和Android上做同样的事情（当然还有另一个cose），但如果我使用的是javascript则不行。

情景：

服务器端

我有一个存储图像的服务器。

代码：（ test1.php ）

$image_url = 'http://weburbanist.com/wp-content/uploads/2011/11/lorem-ipsum.jpg';


$bin = file_get_contents($image_url);

echo $bin;

客户端（Javascript）

我通过URL GET / POST向服务器询问图片，但我无法使用AJAX请求在Javascript中收到它。我想将它存储在。

中

代码：

var activeXhr = new XMLHttpRequest();

activeXhr.open('GET', 'test1.php', true);

activeXhr.onreadystatechange = function()
{
    if(activeXhr.readyState == 4){
       var bin_img = activeXhr.responseText;
       var dataURL="data:image/jpeg;base64,"+bin_img;

       $('#test_img').attr('src',dataURL);
    }
};
activeXhr.send(null);

问题：

我无法转换在BASE64中收到的数据或使用btoa（返回空）

问题：

如何在JAVASCRIPT中接收原始图像？

Answer 1

正如您已经使用过jQuery，为什么不将Ajax功能用于请求？

这也短得多：

$.get('test1.php').done(function (r) {
  // r is your raw image data;
});

在php中设置'Content-Type'标头也是合适的：

<?php 

$image_url = 'http://weburbanist.com/wp-content/uploads/2011/11/lorem-ipsum.jpg';

$bin = file_get_contents($image_url);

header('Content-Type: image/jpeg');

die($bin); // use die/exit for safer output

您是否考虑过像这样提供来自php的Base64数据：

die(base64_encode( $bin ));

如何在javascript中接收二进制图像？

1 个答案: