1

我需要显示在另一个页面中生成的图像。我正在使用 XMLHttpRequest 从该页面获取图像。无法做到这一点,请帮助。

代码块

这用于获取图像

    Bitmap IMG = myPane.GetImage(700,700,92);
    //Bitmap finalImage = new Bitmap(800, 800);
    byte[] byteArray = new byte[0];
    using (MemoryStream stream = new MemoryStream())
    {
        IMG.Save(stream, System.Drawing.Imaging.ImageFormat.Png);
        stream.Close();

        byteArray = stream.ToArray();
    }

    Response.Write(byteArray);

这用于在 javascript 中获取它

 function b() {
           searchReq.onreadystatechange = ProcessResponse;
           searchReq.open("GET", 'Default.aspx', true);
           if (searchReq.overrideMimeType) {
               searchReq.overrideMimeType('text/plain; charset=x-user-defined');
           } else {
               searchReq.setRequestHeader('Accept-Charset', 'x-user-defined');
           }


           searchReq.send(null);
       }

       function ProcessResponse() {
           if (searchReq.readyState == 4) {
               if (searchReq.status == 200) {
                   retval = "";                      
                   var img = document.getElementById("myimg");
                   img.src = "data:image/jpeg;base64," +(searchReq.responseText);
               }
           }

       }

谢谢

4

3 回答 3

1

不要使用 XMLHttpRequest。相反,只需将 img 元素的 src 设置为您的 .net 脚本:

function b() {
    var img = document.getElementById("myimg");
    img.src = "Default.aspx";
}

如果这不起作用,因为浏览器认为它是同一个图像文件,只需在 url 中添加一些垃圾查询参数:

img.src = "Default.aspx?q=" + Math.random();
于 2013-05-22T09:03:45.537 回答
1

您不需要使用XMLHttpRequest来检索您的图像。通过放置<img>这样的标签可以轻松实现:

<img src="myImageGenerator.aspx" alt="..." />

我假设您的脚本在myImageGenerator.aspx页面上

请注意,myImageGenerator.aspx需要返回正确的内容类型:image/png 您可以在 C# 中执行此操作:

Response.Headers["Content-Type"] = "image/png";

祝你好运

于 2013-05-22T09:03:53.280 回答
0

图像是二进制数据,您必须修改 XmlHttpRequest 对象的某些属性才能处理二进制数据。

Mozilla 的网站在这里有关于这个主题的很好的文档:https ://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest/Sending_and_Receiving_Binary_Data

上面页面的代码片段执行此操作:

var oReq = new XMLHttpRequest();
oReq.open("GET", "/myfile.png", true);
oReq.responseType = "blob";

oReq.onload = function(oEvent) {
  var blob = oReq.response;
  // ...
};

oReq.send();
于 2013-05-22T09:03:17.017 回答