Jquery 注意：能够解码并显示从服务器接收的分块图像

我从对服务器的ajax调用接收到一个分块编码的图像。 如何在客户端中显示分块的图像？ 我的代码如下：-

$.ajax({ 
         url: service url, 
         type: 'POST', 
         headers: {
            "accept": "image/jpeg",
            "content-Type": "application/json",
                },
         success: function(data) { 
         console.log(data.responseText);
         $('#imageDiv').html('<img src="data:image/jpeg,base64'+data+'"  height="200px" width="500px" />');

          }
   });

$.ajax（{
url：服务url，
键入：“POST”，
标题：{
“接受”：“图像/jpeg”，
“内容类型”：“应用程序/json”，
},
成功：函数（数据）{
console.log（data.responseText）；
$（'#imageDiv'）.html（''）；
}
});

但给出这样的结果：

---

��C��C��A.���

在实践中，我经常看到人们这样做：

服务器支持GET而不是POST for image，例如：

$('#img').attr('src', '/images/pic1.jpg?width=200&height=200');

如果从服务器返回base64字符串：

$.ajax({ 
    url: service url, 
    type: 'GET',
    success: function(data) { 
         $('#yourDiv').html('<img src="data:image/jpeg,base64'+data+'"/>');
    }
});

---

我的问题是，我得到的是JFIF编码格式的图像，我不知道如何将其显示为图像。现在我解决了服务器端本身的问题。现在，图像以base64格式来自服务器，可以使用上述代码显示。

// Code taken from MatthewCrumley (http://stackoverflow.com/a/934925/298479)
function getBase64Image(img) {
    // Create an empty canvas element
    var canvas = document.createElement("canvas");
    canvas.width = img.width;
    canvas.height = img.height;

    // Copy the image contents to the canvas
    var ctx = canvas.getContext("2d");
    ctx.drawImage(img, 0, 0);

    // Get the data-URL formatted image
    // Firefox supports PNG and JPEG. You could check img.src to guess the
    // original format, but be aware the using "image/jpg" will re-encode the image.
    var dataURL = canvas.toDataURL("image/png");

    return dataURL.replace(/^data:image\/(png|jpg);base64,/, "");
}