网络摄像头流式传输 - 以可变间隔将图像流式传输到图像控制系统？

Question

我遇到问题，连接速度慢的用户无法正确获取图像Feed。

我每秒向Ajax更新面板中的图片框发送新图片，使用Ajax计时器。

所以如果他们的速度实在太慢，一个图像犯规负载下一个进来前充分，所以他们从来没有得到整个画面......

任何想法？

Answer 1

在JavaScript中使用图像OnLoad事件。换句话说，在最后一个没有完全加载之前，不要加载新的图像。

也许你不应该使用更新面板。图片标签（包括其大小，外观和位置）保持不变;它是变化的来源。而不是更新的一切，我建议做以下在客户端：

1. 在开始的时候，加载第一图像（不更新面板）。
2. 在客户端将OnLoad事件的监听程序添加到<img />。
3. 当图片完全加载时，通过查询服务器以获取更新的图片来重新加载。例如，您可能会考虑拥有一个ASP.NET页面Camera.aspx，该页面服务于从相机抓取的最新照片。可以肯定的页面确实是查询，<img />元素的src属性更改为Camera.aspx?t=1，Camera.aspx?t=2等

在服务器端（所以没有JavaScript在这里会），所抓取的图像存储在数据库中，因此Camera.aspx将查询最后存储的记录，检索它并直接发送给客户端（指定适当的Response.ContentType和使用Response.OutputStream）。

为了获得更好的视觉反应，您可能还需要考虑并行使用两个图像元素：第一个加载时，显示第二个，反之亦然。它可能会更好，但我不确定，所以在选择合适的方法之前进行测试。