Per garantire che una web app sia online in modo affidabile, possiamo utilizzare JavaScript per effettuare richieste di rete e verificare la disponibilità del server.
Utilizzo di fetch() per verificare lo stato
Il metodo più semplice e moderno per controllare se una web app è online è utilizzare fetch() per inviare una richiesta a un endpoint e gestire la risposta.
async function isAppOnline(url) {
try {
const response = await fetch(url, { method: 'HEAD', cache: 'no-store' });
return response.ok;
} catch (error) {
return false;
}
}
Utilizzo di navigator.onLine
Un altro metodo consiste nell'usare navigator.onLine, che verifica se il browser ha una connessione a Internet. Tuttavia, questo metodo non garantisce che la web app sia effettivamente raggiungibile.
window.addEventListener('online', () =>, console.log('Sei online!'));
window.addEventListener('offline', () => console.log('Sei offline!'));Strategia combinata
Per una verifica più affidabile, possiamo combinare navigator.onLine con una richiesta fetch() per confermare la disponibilità del server:
async function checkAppStatus(url) {
if (!navigator.onLine) {
return false;
}
return await isAppOnline(url);
}
Chiamando questa funzione periodicamente, possiamo monitorare lo stato della web app e aggiornare l'interfaccia utente di conseguenza.
Conclusione
Per verificare se una web app è online in modo affidabile, è consigliabile combinare la verifica della connessione di rete con un effettivo test di accessibilità del server tramite fetch(). Questo approccio fornisce risultati più precisi rispetto all'uso esclusivo di navigator.onLine.