Javascript Online & Offline
Herkese merhabalar bugün sizlerle Javascript ile birlikte internet bağlantısının kesilip kesilmediğini anlamaya çalışacağız.Örneğin bir kullanıcı ilgili sayfaya girip form verilerini doldur ve o anda interneti kesildi işte tam bu anda kişiye internetinde kopma oldugunu ve onun için ilgili verileri kaydetip kaydetmeyeceğini sorup verileri storage yazarak kişinin interneti geldiginde form verilerini storage üzerinden doldurup kişiye daha iyi bir deneyim sağlayabiliriz.
Yapılandırma ;
index.js dosyamı oluşturup aşağıdaki gibi kodluyorum.
const el = document.getElementById("onlyOfflineVisible")window.addEventListener(("online"), (e) => {
console.log("e", e)
el.style.display = "none"
})window.addEventListener(("offline"), (e) => {
console.log("e", e)
//storage verileri kaydet
el.style.display = "flex"
})
daha sonra index.html dosyamı olusturup aşağıdaki gibi kodluyorum.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title><style>
#onlyOfflineVisible{
display: none;
}
</style>
</head>
<body><div id="onlyOfflineVisible">İnternet Bağlantınızda Bir Sorun Vardır</div><div>Merhaba :)</div><script src="./index.js"></script></body>
</html>
ve işlem tamam artık internet bağlantısı kesildiğinde bunu saptıyor olacak ve ilgili div’i gösteriyor olacağım , siz bunu yukarıda anlattıgım senaryo gibi uygulayabilir yada çeşitli senaryolara göre uyarlayabilirsiniz.
Herkese İyi Çalışmalar Dilerim.
