2014-11-05 14:47:38 +00:00
# Online/Offline Event Detection
Online and offline event detection can be implemented in the renderer process
using standard HTML5 APIs, as shown in the following example.
_main.js_
```javascript
2016-07-26 01:39:25 +00:00
const {app, BrowserWindow} = require('electron')
2014-11-05 14:47:38 +00:00
2016-07-26 01:39:25 +00:00
let onlineStatusWindow
2016-05-04 18:11:51 +00:00
app.on('ready', () => {
2016-07-26 01:39:25 +00:00
onlineStatusWindow = new BrowserWindow({ width: 0, height: 0, show: false })
onlineStatusWindow.loadURL(`file://${__dirname}/online-status.html`)
})
2014-11-05 14:47:38 +00:00
```
_online-status.html_
```html
2015-03-04 13:29:02 +00:00
<!DOCTYPE html>
2014-11-05 14:47:38 +00:00
< html >
2015-11-10 08:48:24 +00:00
< body >
< script >
2016-05-04 18:11:51 +00:00
const alertOnlineStatus = () => {
2016-07-26 01:39:25 +00:00
window.alert(navigator.onLine ? 'online' : 'offline')
}
2015-11-10 08:48:24 +00:00
2016-07-26 01:39:25 +00:00
window.addEventListener('online', alertOnlineStatus)
window.addEventListener('offline', alertOnlineStatus)
2015-11-10 08:48:24 +00:00
2016-07-26 01:39:25 +00:00
alertOnlineStatus()
2015-11-10 08:48:24 +00:00
< / script >
< / body >
2014-11-05 14:47:38 +00:00
< / html >
```
2015-09-01 02:17:59 +00:00
There may be instances where you want to respond to these events in the
main process as well. The main process however does not have a
`navigator` object and thus cannot detect these events directly. Using
2015-04-16 03:31:12 +00:00
Electron's inter-process communication utilities, the events can be forwarded
2015-03-26 15:20:31 +00:00
to the main process and handled as needed, as shown in the following example.
2014-11-05 14:47:38 +00:00
_main.js_
```javascript
2016-07-26 01:39:25 +00:00
const {app, BrowserWindow, ipcMain} = require('electron')
let onlineStatusWindow
2016-05-04 18:11:51 +00:00
app.on('ready', () => {
2016-07-26 01:39:25 +00:00
onlineStatusWindow = new BrowserWindow({ width: 0, height: 0, show: false })
onlineStatusWindow.loadURL(`file://${__dirname}/online-status.html`)
})
2014-11-05 14:47:38 +00:00
2016-05-04 18:11:51 +00:00
ipcMain.on('online-status-changed', (event, status) => {
2016-07-26 01:39:25 +00:00
console.log(status)
})
2014-11-05 14:47:38 +00:00
```
_online-status.html_
```html
2015-03-04 13:29:02 +00:00
<!DOCTYPE html>
2014-11-05 14:47:38 +00:00
< html >
2015-11-10 08:48:24 +00:00
< body >
< script >
2016-07-26 01:39:25 +00:00
const {ipcRenderer} = require('electron')
2016-05-04 18:11:51 +00:00
const updateOnlineStatus = () => {
2016-07-26 01:39:25 +00:00
ipcRenderer.send('online-status-changed', navigator.onLine ? 'online' : 'offline')
}
2015-11-10 08:48:24 +00:00
2016-07-26 01:39:25 +00:00
window.addEventListener('online', updateOnlineStatus)
window.addEventListener('offline', updateOnlineStatus)
2015-11-10 08:48:24 +00:00
2016-07-26 01:39:25 +00:00
updateOnlineStatus()
2015-11-10 08:48:24 +00:00
< / script >
< / body >
2014-11-05 14:47:38 +00:00
< / html >
```
2016-10-13 14:15:39 +00:00
In Chrome and Safari, if the browser is not able to connect to a local area network (LAN) or a router, it is offline; all other conditions return true. So while you can assume that the browser is offline when it returns a false value, you cannot assume that a true value necessarily means that the browser can access the internet. You could be getting false positives, such as in cases where the computer is running a virtualization software that has virtual ethernet adapters that are always "connected." Therefore, if you really want to determine the online status of the browser, you should develop additional means for checking.
