如何处理 Net Core 中的 net::ERR_INTERNET_DISCONNECTED 错误
How can I handle net::ERR_INTERNET_DISCONNECTED error in Net Core
我正在播放流式直播广播 mp3 媒体,但是当互联网连接断开时,流式播放停止并且即使互联网连接恢复也不会再播放。
我想处理连接,当连接断开时,我需要向用户显示一条消息,如 'your connection is disconnected, check and refresh the page'。
如何使用 Javascript 或 C# 处理此问题?
您应该检查 javascript 服务器是否已连接。然后如果客户端没有连接到服务器,你可以刷新页面。
使用下面的代码片段
- 使用 chrome 开发者工具将浏览器置于 offline/online
window.addEventListener("offline", (event) => {
const online = document.getElementById("online");
const offline = document.getElementById("offline");
online.style.display = "none";
offline.style.display = "block";
});
window.addEventListener("online", (event) => {
const online = document.getElementById("online");
const offline = document.getElementById("offline");
online.style.display = "block";
offline.style.display = "none";
setInterval(async() => {
online.style.display = "none";
}, 10000);
});
@import url("https://fonts.googleapis.com/css?family=Quicksand&display=swap");
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
body {
font-family: Quicksand;
margin: 0;
display: flex;
height: 100vh;
align-items: center;
justify-content: center;
background-color: #ffb457;
transition: background-color var(--duration);
-webkit-tap-highlight-color: transparent;
}
.alert-container {
position: fixed;
top: 0;
width: 100%;
}
.alert {
margin: 10px;
padding: 10px;
display: none;
position: relative;
border-radius: 5px;
box-shadow: 0 0 15px 5px #ccc;
}
.simple-alert {
background-color: #ebebeb;
border-left: 5px solid #6c6c6c;
}
.simple-alert .close {
border-color: #6c6c6c;
color: #6c6c6c;
}
.success-alert {
background-color: #a8f0c6;
border-left: 5px solid #178344;
}
.success-alert .close {
border-color: #178344;
color: #178344;
}
.danger-alert {
background-color: #f7a7a3;
border-left: 5px solid #8f130c;
}
.danger-alert .close {
border-color: #8f130c;
color: #8f130c;
}
.warning-alert {
background-color: #ffd48a;
border-left: 5px solid #8a5700;
}
.warning-alert .close {
border-color: #8a5700;
color: #8a5700;
}
<a href="https://www.freecodecamp.org/news/how-to-check-internet-connection-status-with-javascript/">
Reference
</a>
<div class="alert-container">
<div class="alert success-alert" id="online">
<h4>Your device is connected to the internet.</h4>
</div>
<div class="alert danger-alert" id="offline">
<h4>Your device lost its internet connection.</h4>
</div>
</div>
我正在播放流式直播广播 mp3 媒体,但是当互联网连接断开时,流式播放停止并且即使互联网连接恢复也不会再播放。
我想处理连接,当连接断开时,我需要向用户显示一条消息,如 'your connection is disconnected, check and refresh the page'。
如何使用 Javascript 或 C# 处理此问题?
您应该检查 javascript 服务器是否已连接。然后如果客户端没有连接到服务器,你可以刷新页面。
使用下面的代码片段
- 使用 chrome 开发者工具将浏览器置于 offline/online
window.addEventListener("offline", (event) => {
const online = document.getElementById("online");
const offline = document.getElementById("offline");
online.style.display = "none";
offline.style.display = "block";
});
window.addEventListener("online", (event) => {
const online = document.getElementById("online");
const offline = document.getElementById("offline");
online.style.display = "block";
offline.style.display = "none";
setInterval(async() => {
online.style.display = "none";
}, 10000);
});
@import url("https://fonts.googleapis.com/css?family=Quicksand&display=swap");
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
body {
font-family: Quicksand;
margin: 0;
display: flex;
height: 100vh;
align-items: center;
justify-content: center;
background-color: #ffb457;
transition: background-color var(--duration);
-webkit-tap-highlight-color: transparent;
}
.alert-container {
position: fixed;
top: 0;
width: 100%;
}
.alert {
margin: 10px;
padding: 10px;
display: none;
position: relative;
border-radius: 5px;
box-shadow: 0 0 15px 5px #ccc;
}
.simple-alert {
background-color: #ebebeb;
border-left: 5px solid #6c6c6c;
}
.simple-alert .close {
border-color: #6c6c6c;
color: #6c6c6c;
}
.success-alert {
background-color: #a8f0c6;
border-left: 5px solid #178344;
}
.success-alert .close {
border-color: #178344;
color: #178344;
}
.danger-alert {
background-color: #f7a7a3;
border-left: 5px solid #8f130c;
}
.danger-alert .close {
border-color: #8f130c;
color: #8f130c;
}
.warning-alert {
background-color: #ffd48a;
border-left: 5px solid #8a5700;
}
.warning-alert .close {
border-color: #8a5700;
color: #8a5700;
}
<a href="https://www.freecodecamp.org/news/how-to-check-internet-connection-status-with-javascript/">
Reference
</a>
<div class="alert-container">
<div class="alert success-alert" id="online">
<h4>Your device is connected to the internet.</h4>
</div>
<div class="alert danger-alert" id="offline">
<h4>Your device lost its internet connection.</h4>
</div>
</div>