我正试图摆脱浏览器中令人讨厌的内存泄漏。
这就是我想要做的： - 我会定期尝试使用javascript刷新HTML页面中的图像。 - 所有代码都应与Internet Explorer 6或更高版本以及Firefox兼容。
你可以在下面找到我的代码。
这就是我观察到的：每次轮询新图像时，浏览器似乎都会将前一个图像保留在其缓存中。因此，chrome9 / Internet Explorer 6和8 / Safari 5的内存使用率在时间上保持线性增长。当我向图像添加no-cache标头时，只有firefox（3.6）似乎表现正常。我已经将刷新率设置得相当高（10ms），以便快速查看内存增长情况。
我已经尝试过的： - 将标头添加到禁用缓存的图像：仅适用于Firefox 这是响应头：
HTTP / 1.1 200 OK日期：2011年2月14日星期一11:17:02 GMT服务器：Apache / 2.2.9（Debian）PHP / 5.2.6-1 + lenny9与Suhosin-Patch mod_python / 3.3.1 Python / 2.5。 2 X-Powered-By：PHP / 5.2.6-1 + lenny9 Pragma：no-cache Cache-control：no-cache，no-store，must-revalidate，max-age = 1，max-stale = 0，post -check = 0，pre-check = 0，max-age = 0 Expires：Mon，14 Feb 2011 11:17:02 GMT Content-Length：358 Keep-Alive：timeout = 15，max = 100 Connection：Keep-Alive内容类型：image / png
- 通过POST方法以base64字符串格式请求图像（POST请求默认不缓存）：没有区别 - 将设置变量之类的各种内容称为null并调用clearInterval或类似方法。 - 每次我提出请求时，更改/不更改图像名称。 - 在iFrame中加载下面的代码并每隔5秒刷新一次iFrame似乎会清除除IE6之外的所有浏览器中的内存，因此这不是一个解决方案。 - 许多其他似乎不起作用的东西。
我希望你们中任何一个聪明的家伙都能帮助我。我变得非常绝望=）
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache, no-store, must-revalidate, max-age=-1, max-stale=0, post-check=0, pre-check=0">
<meta http-equiv="expires" content="-1">
<style type="text/css">
body {
padding: 0px;
margin: 0px;
background-color: #B0B9C0;
}
img {
width: 167px;
height: 125px;
background-color: #B0B9C0;
border: none;
}
</style>
<script type="text/javascript">
var previewUrl = "http://nick-desktop/image/";
var previewImage = document.createElement("img");
var previewTimeout = 10;
var previewWidth = 200;
var previewHeight = 80;
var timerID = 0;
function initialize() {
if(previewTimeout==null || previewUrl == null || previewWidth==null || previewHeight==null) return;
document.body.appendChild(previewImage);
previewImage.src = previewUrl;
previewImage.style.width = previewWidth+"px";
previewImage.style.height = previewHeight+"px";
timerID = setInterval(doPoll, previewTimeout);
}
function doPoll() {
previewImage.src = previewUrl + new Date().getTime()+".png";
}
</script>
</head>
<body onload="initialize()">
</body>
试试这个：
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache, no-store, must-revalidate, max-age=-1, max-stale=0, post-check=0, pre-check=0">
<meta http-equiv="expires" content="-1">
<style type="text/css">
body {
padding: 0px;
margin: 0px;
background-color: #B0B9C0;
}
img {
width: 167px;
height: 125px;
background-color: #B0B9C0;
border: none;
}
</style>
<script type="text/javascript">
var previewUrl = "http://nick-desktop/image/";
var previewTimeout = 10;
var previewWidth = 200;
var previewHeight = 80;
var timeout;
window.onload = function() {
if(previewTimeout==null || previewUrl == null || previewWidth==null || previewHeight==null) return;
doPoll();
}
function doPoll() {
clearTimeout(timeout);
document.body.innerHTML = "";
var previewImage = null;
previewImage = document.createElement("img");
previewImage.style.width = previewWidth+"px";
previewImage.style.height = previewHeight+"px";
previewImage.onload = function() { timeout = setTimeout(doPoll, previewTimeout); };
document.body.appendChild(previewImage);
previewImage.src = previewUrl + "image.png?datetime=" + new Date().getTime();
}
</script>
</head>
<body>
</body>
</html>