Question

对于我正在开发的新ASP.NET应用程序，我希望使用web服务（返回字节）在运行时生成图像，并使用JavaScript显示此图像（以便我可以拥有ajax功能）。

有什么想法如何去做这个？

您有没有任何想法，可以在运行时生成映像，并使用Ajax（不能回发）将其显示在我的网页上，而无需将图像保存到硬盘上的任何位置？

谢谢！

Answer 1

Instead of having the web service put an ASHX page with the querystring parameters handling the input params. Make sure the Response.Content type is image/png

此ASHX页面将动态生成图像流并将其发送到请求的图像对象。因此，在服务器上没有保存图像文件。

这是一个链接，其中包含ASHX的全部代码。

完成此操作后，在JavaScript中通过DOM访问图像对象，并设置/更改SRC属性。

function ChangeImage(param1, param2)
{
  var url = "http://someserver/somepage.ashx?param1=" + param1 + "&param2=" + param2;
  var image1 = document.getElementById("MyImage");
  image1.src = url;
}

Answer 2

我建议您使用HttpHandler而不是Web服务来实现。

如果您要使用 Web 服务进行此操作，您的 Java 脚本代码必须从接收的二进制数据创建图像，如果不是非常困难，那将是笨拙的。

创建一个httphandler很容易，只需创建一个实现IHttpHandler接口的类，然后将其注册到您的web.config文件中。

如果你在谷歌上搜索它，你应该会找到很多资源。

关于显示图像，您可以使用普通的img标记，像这样：

<img src="yourhttphandler.ashx?id=1" />

要进行更新，您可以仅为src属性设置一个新值：

yourimage.src = "yourhttphandler.ashx?id=2";

Answer 3

这里是将 ashx 文件返回图像的代码。

现在，将以下处理程序信息添加到您的 web.config 文件中。

<httpHandlers>
  <add verb="*" path="ImageGenerator.ashx的翻译为：图像生成器.ashx" type="MyHandlers.HttpImageHandler, MyHandlers" />
</httpHandlers>

这是来自Allen Guest的博客的一些代码。

ImageGenerator.ashx的翻译为：图像生成器.ashx

namespace MyHandlers
{
      public class HttpImageHandler : IHttpHandler
      {
        private string GetExtension(string url)
        {
          string extension = "";
          if (null != url)
          {
            int indexSeperator = url.LastIndexOf(".");
            if (indexSeperator > -1)
              extension = url.Substring(indexSeperator + 1, url.Length - indexSeperator - 1).ToUpper();
          }
          return extension;
        }
    
        private string GetContentType(string url)
        {
          switch (GetExtension(url))
          {
            case "JPG" :
            case "JPEG" :
              return "image/jpg";
            case "PNG" :
              return "image/png";
            case "GIF" :
              return "image/gif";
            default :
              return "";
          }
        }
    
        private ImageFormat GetImageFormat(string url)
        {
          switch (GetExtension(url))
          {
            case "JPG" :
            case "JPEG" :
              return ImageFormat.Jpeg;
            case "PNG" :
              return ImageFormat.Png;
            case "GIF" :
              return ImageFormat.Gif;
            default :
              return ImageFormat.Bmp;
          }
        }
    
        private Image GetImage(string url)
        {
          HttpWebRequest wReq = (HttpWebRequest)WebRequest.Create(url);
          HttpWebResponse wRes = (HttpWebResponse)(wReq).GetResponse();
          Stream wStr = wRes.GetResponseStream();
          return Image.FromStream(wStr);
        }
    
        #region IHttpHandler Members
        public void ProcessRequest(HttpContext context)
        {
          string url = context.Request.QueryString["imageUrl"];
          if (null != url)
          {
            context.Response.Clear();
            context.Response.ContentType = GetContentType(url);
            Image img = GetImage(url);
            img.Save(context.Response.OutputStream, GetImageFormat(url));
          }
          context.Response.End();
        }
    
        public bool IsReusable
        {
          get { return false; }
        }
        #endregion
      }
}

通过传递图像作为imageUrl参数，调用ashx文件的javascript调用。你可以完成了。

友情链接