需要javascript来验证服务器是否已启动，并在服务器未启动时防止页面丢失
需要javascript来验证服务器是否已启动，并在服务器未启动时防止页面丢失
提问于 2020-08-22 10:26:19
我有一个服务器，可以远程驱动我家里的显示器。目前它知道通过每5分钟刷新一次页面来更新链接，但我注意到当服务器宕机时，它会刷新并清除页面。我想让它继续播放最后一张幻灯片，直到服务器重新启动。
下面的代码似乎使页面在服务器死机时变为空白，并在服务器恢复时返回，这很好，但只要服务器关闭，它就会破坏幻灯片放映。由于某些原因，它也不会执行失败模式警报。最终，我想用图片右下角的红色小方框替换警报，但目前我甚至不能让它执行警报代码。
function checkServerStatus()
{
var img = document.createElement("img");
img.onload = function()
{
//Change to reload only if links change in server
location.reload(1);
};
img.onerror = function()
{
//does not display alert and kills page when running live, works here though. Page returns if server comes back up
alert('nope!');
};
img.src = "/static/img/aol.png";
}<!DOCTYPE html>
<html lang="en">
<head>
<!--Kill Favicon request -->
<link rel="icon" href="data:,">
<title>Display: Home</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>
<!--My styles sheet -->
<link rel="stylesheet" type="text/css" href="/static/styles.css">
<!-- My Java Scripts -->
<script src="/static/js/moment.min.js"></script>
<!-- Script from server for moment text generator -->
<script src="/static/scripts.js"></script>
</head>
<script>var myVar = setInterval("checkServerStatus()", 60000);</script>
<div class="full-screen-scroller" style="width: 400px;" background-color: powderblue;>
<div id="myCarousel" class="carousel slide" data-ride="carousel">
<!-- Indicators -->
<ol class="carousel-indicators">
<li data-target="#myCarousel" data-slide-to="0" class="active"></li>
<li data-target="#myCarousel" data-slide-to="1"></li>
</ol>
<!-- Wrapper for slides -->
<div class="carousel-inner">
<div class="item active">
<img style="width: 100%; max-height: 400px;" src="https://media.giphy.com/media/r1fDuPIcs18d2/giphy-downsized-large.gif" alt="Snoop Dog!">
<div class="carousel-caption"><h3>Snoop Dog!</h3></div>
</div>
<div class="item">
<img style="width: 100%; max-height: 400px;" src="https://media.giphy.com/media/WZ5tDWAQrUeuk/giphy.gif" alt="Wowzers!">
<div class="carousel-caption"><h3>Wowzers!</h3></div>
</div>
</div>
</div>
</div>
</body>
</html>
回答 1
Stack Overflow用户
回答已采纳
发布于 2020-08-22 10:32:20
可能是浏览器正在缓存/static/img/aol.png资源，所以当您再次调用checkServerStatus时，即使服务器关闭，浏览器也会给出先前缓存的图像-它会正确加载，从而导致location.reload清除页面。
您可以将查询字符串添加到src，以确保每次都会重新下载它：
img.src = "/static/img/aol.png?t=" + Date.now();页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/63532014
复制相关文章
相似问题
腾讯云开发者
