Membuat Aplikasi Windows 8 – 9 – Mengecek Akses Internet

Assalamu’alaikum :)

Jumpa lagi di postingan serial Membuat Aplikasi Windows 8. Apakah anda pernah membuat sebuah aplikasi yang membutuhkan koneksi internet agar dapat berjalan? Misalkan saja RSS Reader. Kalau tidak ada internet pasti tidak bisa jalan kan? Ketika user membuka aplikasi kita dan ternyata user tidak memiliki akses internet, biasanya ditampilkan pesan yang kurang lebih seperti di bawah ini:

No Internet Connection has been found

Nah, sekarang pertanyaannya, gimana caranya kita tau bahwa user tidak memiliki akses internet? Ada dua cara sebenarnya, yang pertama kita tetap jalankan XMLHttpRequest nya lalu ketika hasilnya error maka bisa disimpulkan user tidak memiliki akses internet. Atau kita bisa menggunakan cara yang kedua, yaitu mengecek apakah user memiliki akses internet atau tidak, dengan menggunakan library yang sudah disediakan oleh Windows, yaitu di Windows.Networking . Cara yang kedua yang akan saya terangkan di sini.

Sebelum memulai, semua code javascript yang saya beri di sini saya buat di file terpisah yaitu checkConnection.js, jadi tidak tercampur dengan default.js kecuali di bagian tertentu saja.

Pertama-tama kita harus tau apakah ada profile network yang sedang aktif di komputer atau tidak. Kita bisa mendapatkan profile yang sedang aktif dengan  Windows.Networking.Connectivity.NetworkInformation.getInternetConnectionProfile(); . Fungsi tersebut akan mengembalikan nilai null jika tidak ada profile yang aktif, maka dari itu kita harus melakukan pengecekan.

Ketika komputer kita terhubung pada sebuah jaringan, maka komputer tersebut akan mempunyai 4 level akses, yaitu:

  1. None
  2. Local Access
  3. Constrained Internet Access, dan
  4. Internet Access

Windows sudah meng-enumerasi-kan ke-empat kategori ini ke dalam object  Windows.Networking.Connectivity.NetworkConnectivityLevel dengan membernya masing-masing adalah .none  .localAccess   .constrainedInternetAccess  dan  .internetAccess . Maka dari itu kita gunakan switch-case untuk melist semua kemungkinan yang ada.

Kita bisa memodifikasi sedikit fungsi di atas agar bisa dilakukan sebagai tempat pengecekan apakah ada koneksi internet atau tidak ( isConnected(); ) dan fungsi yang menjalankan sebuah command/call back function ketika komputer sedang memiliki koneksi internet dan menjalankan command yang kedua jika error( ifConnected(command,errorCommand); )

Lalu kita masukkan ketiga fungsi tersebut kedalam Namespace buatan kita “Connection”. Penjelasan mengenai Namespace bisa dilihat di postingan saya sebelumnya di sini.

Okay, selesai dengan fungsinya sekarang mari kita coba. Tambahkan kode berikut di dalam tag body default.html:

Lalu buka default.js dan tambahkan beberapa baris kode berikut ketika aplikasi di-launch sebelum baris  args.setPromise(WinJS.UI.processAll());

Saya rasa kode HTML dan Javascript diatas mudah dimengerti dan straight-forward ya hehe :D

Ketika dijalankan, jika anda menekan tombol yang pertama maka akan menunjukkan Network Profile yang sedang aktif (kalau ada)

No Internet Profile

Jika kita menekn tombol yang kedua maka dia akan mengecek apakah ada koneksi internet atau tidak dan menampilkannya ke dalam MessageDialog.

Success Connect Windows 8

Failed Connect Windows 8

NOTE: Untuk bisa mengutak-ngatik lebih jauh tentang profile Network yang ada, Windows sudah menyediakan cara-caranya di Sample Apps: Network Information Sample. Semua sample Apps bisa di download satu pack di sini (Windows 8 app samples)

Okay, sekian dari saya. Tutorial ini bisa di download source codenya di sini

Referensi:
Kraig Brockschmid. Programming Windows 8 Apps with HTML, CSS, and JavaScript, 2012.
http://social.msdn.microsoft.com/Forums/windowsapps/en-US/43bdf6e1-e2fd-4749-afc3-4cc80d4978bf/check-if-internet-connectivity-exists-

AbangFadli, out :cool:

Wassalamu’alaikum :kr

Ilmu jangan disimpan sendiri, bagikan ke teman-teman anda:

Comments

comments

Ahmad Fadli Basyari

Mahasiswa IT di President University. Memiliki hobi membuat aplikasi mobile, blogging dan menonton film.

Leave a Reply

Your email address will not be published. Required fields are marked *

CAPTCHA *

[+] kaskus emoticons nartzco