简体   繁体   English

检查连接状态后重定向到其他页面

[英]Redirecting to other page after checking on connection status

I have a page that will be redirect to other page after 30 second.. Before it does.. It will first check for the connection status..If the connection were available then it will proceed to redirect to next page.. If connection not available then it will remain at the current page (stay).. 我有一个页面,该页面将在30秒后重定向到其他页面。.在此之前..它将首先检查连接状态..如果连接可用,则它将继续重定向到下一页..如果连接不可用可用,它将保留在当前页面(停留)。

Problem is that after it has detected that the connection is offline then it will stay at the current page even after connection is available without refreshing the page.. How can I recheck for connection status? 问题是,在检测到连接已脱机之后,即使连接可用,它也会停留在当前页面而不刷新页面。.如何重新检查连接状态? I mean from offline status and automatically detect the connection availability and move to next page... 我的意思是从离线状态开始,并自动检测连接可用性并转到下一页...

<script type='text/javascript'>
        function Redirect() {
            if (Offline.state === 'up'){
                window.location = "../Offline/FPDTest.aspx";}
        }
        setTimeout('Redirect()', 30000);
</script>

@Muhammad Faiz, use setInterval() method. @Muhammad Faiz,使用setInterval()方法。 on body onload event put your function. on body onload事件将您的功能放到了一起。 This method calls regular interval of time. 此方法调用规则的时间间隔。 Lets say if you gave 5000 the at every 5 second it will called. 可以说,如果您每5秒给出5000个,它将调用。 Now inbetween when the connection found the next call redirect to your FPDTest.aspx page. 现在,在连接找到之间,下一个调用重定向到FPDTest.aspx页。

Refer, this link for more study. 请参考链接以进行更多研究。

For example if you have 2 page Lets say its WebForm1.aspx and WebForm2.aspx then structure of both page will be 例如,如果您有两个页面,假设它的WebForm1.aspx和WebForm2.aspx,则两个页面的结构都是

WebForm1.aspx WebForm1.aspx

<!DOCTYPE html>
<html>
<head>
   <script type='text/javascript'>
       function Redirect() {
           console.log("hello");
            if (navigator.onLine) {
                window.location = "WebForm2.aspx";
            }
        }
</script>
</head>
<body onload="setInterval(function(){ Redirect();}, 5000);">

</body>
</html>

Webform2.aspx will be.. Webform2.aspx将..

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
</head>
<body>

</body>
</html>

Note: here both page must have its seperate body tag if you follow my example. 注意:如果按照我的示例,这两个页面都必须具有单独的body标签。

You can check it by make your internet connection on/off. 您可以通过打开/关闭互联网连接进行检查。 meanwhile make sure your localhost is running. 同时确保您的本地主机正在运行。

Can listen to online/offline events and do whatever you need for each 可以听在线/离线事件,并为每个事件做任何您需要的事情

window.addEventListener('offline', function(e) { 
  console.log('offline'); 
});

window.addEventListener('online', function(e) { 
    console.log('online'); 
});

Using that library you could listen to it's up event 使用该库,您可以收听到up事件

Offline.on("up", (ev)=> {
   window.location = "../Offline/FPDTest.aspx";
});

This will prevent you from calling the function unnecessarily in an interval. 这样可以防止您不必要地间隔调用该函数。 You can unbind the event by doing Offline.off("up"); 您可以通过执行Offline.off("up");取消绑定事件Offline.off("up");

You can unbind the event after 30 seconds. 您可以在30秒后取消绑定该事件。

setTimeout(()=>{
   Offline.off("up");
}, 30000);

please try 请试试

<script type='text/javascript'>
        function Redirect() {
            if (Offline.state === 'up'){
                window.location = "../Offline/FPDTest.aspx";}
        };

        Offline.on('up', function () {
            setTimeout(function(){ Redirect();}, 3000);
        });

</script>

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM