Sam*_*Tee 5 html javascript xmlhttprequest cache-control browser-cache
序幕
我的Web应用程序(关键字:HTML,JavaScript,jQuery; 必须工作:IE8 +,Chrome,FF)必须从一种WebCam呈现实时图像数据.这个"WebCam"集成了一个提供实时图像数据的网络服务器BMP.
通过设置标签的src属性来"下载"图像数据img.
问题
我想分析客户端的图像数据.为此,我想使用XMLHttpRequest(使用此提供的stackoverflow答案)预先下载图像,然后更新标记的src属性img.据我所知,浏览器应该使用通过下载的缓存图像数据XMLHttpRequest.
问题是,浏览器(IE8 +,FF和Chrome)向服务器发出另一个请求以再次下载图像(即它不使用缓存数据或者数据首先没有缓存).
如何启用浏览器缓存数据并使用它而不是发出另一个请求？
附录
服务器发送一个Cache-Control: max-age=5, publicfor Chrome和一个Cache-Control: no-store, max-age=5用于所有其他浏览器.
在Chrome中,我可以通过发送一个来处理第二个请求304 Not Modified.浏览器将使用缓存的图像.在所有其他(提到的)浏览器中,这不起作用.
更新1
我知道,我可以使用数据URI方案来更新src属性.但是,这对IE8不起作用(参见上面的要求),因为IE8仅支持最大32KB.
我通过做显而易见的事情解决了这个问题：
首先img通过隐藏（通过设置src）请求图像。这样图像就会被浏览器缓存。
之后通过AJAX请求图像二进制数据。由于浏览器随后使用上述缓存数据，因此我可以分析图像数据，而无需发出另一个请求。
更新src“可见”图像的 。
这样我就可以实现我所需要的：通过先前的数据分析查看“实时”图像，而无需两次请求图像。