如何在asp.net中刷新图像？

Question

我正在尝试制作一个基于 ASP.Net 的网站。我不知道如何刷新图像。我正在尝试建立一个指向 IP 摄像机的网站链接。我知道摄像头的来源，也有IP摄像头的授权。有没有人有任何想法这样做？

谢谢 吉米

Answer 1

您可以使用简单的javascript在页面上刷新它。

假设您的相机更新了相同的图像名称imagefromcamera.jpg。然后用简单的 html 或 asp 图像控件在页面上显示它，然后用 javascript 将其更新为：

<img id="LiveImg" width="320" height="320" alt="" src="imagefromcamera.jpg?" /> 
<script>
var myImg = document.getElementById("LiveImg");
if (myImg){
    window.setInterval(function(){
          myImg.src = myImg.src.replace(/\?.*$/, '?' + Math.random());
        }, 3000);
}        
</script>

在图像末尾添加这个随机数，我们确保它不会保存在浏览器的缓存中。这里的计时器需要每隔几秒更新一次，这里假设为 3 秒。

现在，如果您的相机名称不同，您可以使用相同的想法并加载它们。如果您有其他方法可以从相机中获取图像，则可以使用处理程序来发送图像。这是一个类似的例子。我做了一个处理程序名称captureimage.ashx，在javascript端使用相同的代码：

<img id="LiveImg" width="320" height="320" alt="" src="captureimage.ashx?" /> 
<script>
var myImg = document.getElementById("LiveImg");
if (myImg){
    window.setInterval(function(){
          myImg.src = myImg.src.replace(/\?.*$/, '?' + Math.random());
        }, 3000);
}
</script>

在服务器端，处理程序可以是：

public class ReadTheCameraImage : IHttpHandler 
{
     public void ProcessRequest (HttpContext context) 
    {
        context.Response.ContentType = "image/jpeg";
        context.Response.Buffer = false;
        // read the ImageData from what ever source you have
        context.Response.OutputStream.Write(ImageData, 0, ImageData.Length);        
    }

    public bool IsReusable 
    {
        get {
            return false;
        }
    }
}

在这里我想说，这不是实时视频的解决方案，而只是将网络摄像头的捕获显示到页面上，例如在互联网上制作实时网络摄像头来显示某些地方。对于实时视频和实时通信，您需要更复杂的代码，以及将 Adob​​e Flash 播放器与服务器流式传输一起使用、与每个连接的客户端直接连接以及其他东西。

如果您的相机软件支持直接视频流，视频的其他一些答案： how to work with videos in ASP.NET?
How to play audio and video files in web browser?
how can i play vimeo player on image click?

Answer 2

你会发现这篇文章很有帮助UpdatePanel Refresh。如果您不关心回发的闪烁，您还可以在 java-script 中创建一个计时器，并为每个滴答调用 __doPostBack('','');您还可以创建一个可以使用 jQuery 调用的 WebMethod 并以这种方式更新您的图像。