在线/离线事件检测

优质
小牛编辑
127浏览
2023-12-01

在渲染器进程中,使用标准HTML5 API实现在线和离线事件检测,例子:
main.js
1
const {app, BrowserWindow} = require('electron')
2

3
let onlineStatusWindow
4

5
app.on('ready', () => {
6
onlineStatusWindow = new BrowserWindow({ width: 0, height: 0, show: false })
7
onlineStatusWindow.loadURL(`file://${__dirname}/online-status.html`)
8
})
Copied!

online-status.html
1
<!DOCTYPE html>
2
<html>
3
<body>
4
<script>
5
const alertOnlineStatus = () => {
6
window.alert(navigator.onLine ? 'online' : 'offline')
7
}
8

9
window.addEventListener('online', alertOnlineStatus)
10
window.addEventListener('offline', alertOnlineStatus)
11

12
alertOnlineStatus()
13
</script>
14
</body>
15
</html>
Copied!

你也许会希望在主程序中回应这些事件,但由于主进程中不存在navigator对象,所以无法直接检测在线还是离线。
不过,你可以使用Electron的进程间通信方法将事件进行转发到主进程进行处理,例子:
main.js
1
const {app, BrowserWindow, ipcMain} = require('electron')
2
let onlineStatusWindow
3
//ready时启用监听
4
app.on('ready', () => {
5
//隐藏窗口载入渲染进程,以便获取通信状态
6
onlineStatusWindow = new BrowserWindow({ width: 0, height: 0, show: false })
7
onlineStatusWindow.loadURL(`file://${__dirname}/online-status.html`)
8
})
9
//主进程中从渲染进程通信的网络状态
10
ipcMain.on('online-status-changed', (event, status) => {
11
console.log(status)
12
})
Copied!

online-status.html
1
<!DOCTYPE html>
2
<html>
3
<body>
4
<script>
5
const {ipcRenderer} = require('electron')
6
//定义内容
7
const updateOnlineStatus = () => {
8
ipcRenderer.send('online-status-changed', navigator.onLine ? 'online' : 'offline')
9
}
10
//启动监听
11
window.addEventListener('online', updateOnlineStatus)
12
window.addEventListener('offline', updateOnlineStatus)
13
updateOnlineStatus()
14
</script>
15
</body>
16
</html>
Copied!

注意: 除了Electron未连接局域网(LAN)或路由器被视为离线(脱机)之外,其他条件都返回 true
尽管如此,当 navigator.onLine 返回一个 false值时,你不能想当然的以为 true即已联网,因为联网状态可以轻易伪造,比如计算机使用虚拟化软件始终连接着虚拟以太网网络适配器.
所以,如果要确定 Electron的真实联网状态,您应该使用更多检查手段。