如何将位图从ASP.NET传递到JavaScript并显示它？

这是我的第一个ASP.NET应用程序，我无法将服务器端Bitmap对象传递给JavaScript客户端。我使用SignalR来连接服务器和客户端。如何将位图从ASP.NET传递到JavaScript并显示它？

我已经尝试了几件事情，希望对于有ASP.NET经验的人来说这很容易。

这里是我的服务器端的C＃：

public void ScreenShot() 
    { 
     Rectangle bounds = this.Bounds; 
     using (Image bitmap = new Bitmap(bounds.Width, bounds.Height)) 
     { 
      using (Graphics g = Graphics.FromImage(bitmap)) 
      { 
       g.CopyFromScreen(new Point(bounds.Left, bounds.Top), Point.Empty, bounds.Size); 
      } 

      Clients.Caller.updateImage(bitmap); 
     } 
    }

在客户端我想要得到的位图，它显示：

 hubproxy.client.updateImage = function (image) { 
      var img = document.createElement("img"); 
      img.src = image; 
      document.body.appendChild(img); 
     };

我必须将它转化成JSON对象？如果我这样做，我怎样才能让它回到客户端的图像？

在此先感谢您的帮助。

来源

2014-10-03 Chad Dienhart

你可以图像转换为字节数组：

public static byte[] ImageToByte(Image img) 
{ 
    ImageConverter converter = new ImageConverter(); 
    return (byte[])converter.ConvertTo(img, typeof(byte[])); 
}

然后它enocde为base64 - 你可以在HTML中使用的base64图片来源：

<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIA..." />

另一种方法是，以节省服务器上的图像并仅返回链接到服务器上的路径，您可以使用类似GUID的名称来生成唯一的名称，并定期清理旧图像或在客户端断开连接后进行清理等。优点是可以减少大型图像上的网络流量 - 您将会节省约37％的流量只发送文件名。

来源

2014-10-03 19:26:27 Giedrius

非常感谢。鉴于图像文件仍然需要传输，您如何节省网络流量？我认为通过发送原始数据我可以节省一些时间，而不会产生将映像写入磁盘的成本。 – 2014-10-03 19:49:31

图像的base64表示比二进制大。 http://stackoverflow.com/questions/11402329/base64-encoded-image-size – 2014-10-04 01:33:08

你不需要写入磁盘，你可以在内存中缓存它，并让控制器使用GUID作为标识符返回映像。使用SignalR发布该GUID – Anders 2014-10-07 07:05:23

如何将位图从ASP.NET传递到JavaScript并显示它？

回答

相关问题