Saya mencoba mendeteksi secara akurat saat browser offline, menggunakan acara online dan offline HTML5.
Ini kode saya:
<script>
// FIREFOX
$(window).bind("online", applicationBackOnline);
$(window).bind("offline", applicationOffline);
//IE
window.onload = function() {
document.body.ononline = IeConnectionEvent;
document.body.onoffline = IeConnectionEvent;
}
</script>
Ini berfungsi dengan baik ketika saya hanya menekan "Bekerja offline" di Firefox atau IE, tetapi ini bekerja secara acak ketika saya benar-benar mencabut kabelnya.
Apa cara terbaik untuk mendeteksi perubahan ini? Saya ingin menghindari panggilan ajax berulang dengan batas waktu.
javascript
jquery
offline
jquery-events
network-connection
Pierre Duplouy
sumber
sumber
Jawaban:
Vendor browser tidak dapat menyetujui tentang cara mendefinisikan offline. Beberapa browser memiliki fitur Bekerja Offline, yang mereka anggap terpisah dari kurangnya akses jaringan, yang sekali lagi berbeda dengan akses internet. Semuanya berantakan. Beberapa vendor browser memperbarui flag navigator.onLine ketika akses jaringan yang sebenarnya hilang, yang lainnya tidak.
Dari spesifikasi:
Akhirnya, spesifikasi mencatat:
sumber
Vendor browser utama berbeda dalam arti "offline".
Chrome dan Safari akan mendeteksi saat Anda "offline" secara otomatis - artinya acara dan properti "online" akan aktif secara otomatis saat Anda mencabut kabel jaringan.
Firefox (Mozilla), Opera, dan IE menggunakan pendekatan yang berbeda, dan menganggap Anda "online" kecuali Anda secara eksplisit memilih "Mode Offline" di browser - meskipun Anda tidak memiliki sambungan jaringan yang berfungsi.
Ada argumen yang valid untuk perilaku Firefox / Mozilla, yang diuraikan dalam komentar laporan bug ini:
https://bugzilla.mozilla.org/show_bug.cgi?id=654579
Namun, untuk menjawab pertanyaan - Anda tidak dapat mengandalkan acara / properti online / offline untuk mendeteksi apakah sebenarnya ada konektivitas jaringan.
Sebaliknya, Anda harus menggunakan pendekatan alternatif.
Bagian "Catatan" dari artikel Pengembang Mozilla ini menyediakan tautan ke dua metode alternatif:
https://developer.mozilla.org/en/Online_and_offline_events
"Jika API tidak diterapkan di browser, Anda dapat menggunakan sinyal lain untuk mendeteksi apakah Anda sedang offline termasuk mendengarkan peristiwa kesalahan AppCache dan respons dari XMLHttpRequest"
Ini menautkan ke contoh pendekatan "mendengarkan peristiwa kesalahan AppCache":
http://www.html5rocks.com/en/mobile/workingoffthegrid/#toc-appcache
... dan contoh pendekatan "mendeteksi kegagalan XMLHttpRequest":
http://www.html5rocks.com/en/mobile/workingoffthegrid/#toc-xml-http-request
HTH, - Cad
sumber
updates this property when the OS reports a change in network connectivity on Windows, Linux, and OS X.
(menurut dokumen yang Anda sebutkan). Jadi tidak hanya offline jika Anda menjelajah dengan browser "mode Offline"Saat ini ada pustaka JavaScript open source yang melakukan pekerjaan ini: disebut
Offline.js
.https://github.com/HubSpot/offline
Pastikan untuk memeriksa README lengkap . Ini berisi acara yang bisa Anda ikuti.
Ini halaman uji . Ini indah / memiliki UI umpan balik yang bagus! :)
sumber
Cara terbaik yang bekerja sekarang di semua Browser Utama adalah dengan Script berikut:
Sumber: http://robertnyman.com/html5/offline/online-offline-events.html
sumber
Sejak baru-baru ini,
navigator.onLine
menunjukkan hal yang sama di semua browser utama, dan dengan demikian dapat digunakan.Versi terlama yang mendukung ini dengan cara yang benar adalah: Firefox 41 , IE 9, Chrome 14 dan Safari 5.
Saat ini ini akan mewakili hampir seluruh spektrum pengguna, tetapi Anda harus selalu memeriksa kemampuan apa yang dimiliki pengguna laman Anda.
Sebelum FF 41, itu hanya akan ditampilkan
false
jika pengguna meletakkan browser secara manual dalam mode offline. Di IE 8, properti berada dibody
, bukanwindow
.sumber: caniuse
sumber
The
window.navigator.onLine
atribut dan peristiwa yang terkait saat ini tidak dapat diandalkan pada browser web tertentu ( terutama Firefox desktop yang ) seperti dikatakan @Junto, jadi aku menulis fungsi kecil (menggunakan jQuery) yang memeriksa secara berkala status konektivitas jaringan dan meningkatkan sesuaioffline
danonline
acara:Anda bisa menggunakannya seperti ini:
Untuk mendengarkan acara offline dan online (dengan bantuan jQuery):
sumber
navigator.onLine berantakan
Saya menghadapi ini ketika mencoba melakukan panggilan ajax ke server.
Ada beberapa kemungkinan situasi ketika klien sedang offline:
Solusi yang saya gunakan adalah mengontrol status diri saya dengan javascript. Saya mengatur kondisi panggilan yang berhasil, dalam hal lain saya menganggap klien sedang offline. Sesuatu seperti ini:
sumber
Di HTML5 Anda dapat menggunakan
navigator.onLine
properti. Lihat di sini:http://www.w3.org/TR/offline-webapps/#related
Mungkin perilaku Anda saat ini acak karena javascript hanya menyiapkan variabel "browser" dan kemudian mengetahui apakah Anda sedang offline dan online, tetapi tidak benar-benar memeriksa Sambungan Jaringan.
Beri tahu kami jika ini yang Anda cari.
Salam,
sumber
Silakan temukan modul require.js yang saya tulis untuk Offline.
Silakan baca posting blog ini dan beri tahu saya pemikiran Anda. http://zen-and-art-of-programming.blogspot.com/2014/04/html-5-offline-application-development.html Berisi contoh kode menggunakan offline.js untuk mendeteksi ketika klien sedang offline.
sumber
Anda dapat mendeteksi offline lintas browser dengan mudah seperti di bawah ini
Anda dapat mengganti yoururl.com dengan
document.location.pathname
.Inti dari solusinya adalah, coba sambungkan ke nama domain Anda, jika Anda tidak dapat tersambung - Anda sedang offline. bekerja lintas browser.
sumber
Saya menggunakan opsi FALLBACK dalam manifes cache HTML5 untuk memeriksa apakah aplikasi html5 saya online atau offline dengan:
Di halaman html saya menggunakan javascript tot membaca konten file txt online / offline:
Saat offline script akan membaca konten offline.txt. Berdasarkan teks di file, Anda dapat mendeteksi jika halaman web online offline.
sumber
Inilah solusi saya.
Diuji dengan IE, Opera, Chrome, FireFox, Safari, sebagai Phonegap WebApp di IOS 8 dan sebagai Phonegap WebApp di Android 4.4.2
Solusi ini tidak berfungsi dengan FireFox di localhost.
================================================== ===============================
onlineCheck.js (jalur file: "root / js / onlineCheck.js):
================================================== ===============================
index.html (jalur file: "root / index.html"):
================================================== ===============================
checkOnline.php (jalur file: "root"):
sumber
Nah, Anda bisa mencoba plugin javascript yang bisa memonitor koneksi browser secara real time dan memberi tahu pengguna jika internet atau koneksi browser dengan internet terputus.
Plugin Wiremonkey Javascript dan demonya dapat Anda temukan di sini
sumber
Menggunakan Badan Dokumen:
Menggunakan Acara Javascript:
Referensi :
Badan-Dokumen: Acara
Javascript-Acara online : Acara online dan offline
Pemikiran Tambahan:
Untuk mengirim sekitar "koneksi jaringan tidak sama dengan koneksi internet" Masalah dari metode di atas: Anda dapat memeriksa koneksi internet satu kali dengan ajax pada aplikasi start dan mengkonfigurasi mode online / offline. Buat tombol sambungkan kembali agar pengguna dapat online. Dan tambahkan pada setiap permintaan ajax yang gagal fungsi yang menendang pengguna kembali ke mode offline.
sumber
window.addEventListener('online', updateOnlineStatus(event) );
karena Anda memanggil fungsi updateOnlineStatus () dengan segera. Seharusnyawindow.addEventListener('online', updateOnlineStatus );