Arabic Knowledge blog مدونة المعرفة العربية : Cordova - Network Information كوردوفا

Cordova - Network Information كوردوفا - معلومات الشبكة

يوفر هذا المكون الإضافي معلومات حول شبكة الجهاز.

الخطوة 1 - تثبيت البرنامج المساعد لمعلومات الشبكة

لتثبيت هذا المكون الإضافي ، سنفتح موجه الأوامر ونشغل الكود التالي -

C:\Users\username\Desktop\CordovaProject>cordova plugin 
   add cordova-plugin-network-information

الخطوة 2 - إضافة الأزرار

لنقم بإنشاء زر في index.html سيتم استخدامه للحصول على معلومات حول الشبكة.

<button id = "networkInfo">INFO</button>

الخطوة 3 - إضافة مستمعين الحدث

سنضيف ثلاثة مستمعين للأحداث داخل وظيفة onDeviceReady في index.js . سيستمع المرء للنقرات على الزر الذي أنشأناه من قبل ويستمع الآخران للتغييرات في حالة الاتصال.

document.getElementById("networkInfo").addEventListener("click", networkInfo);
document.addEventListener("offline", onOffline, false);
document.addEventListener("online", onOnline, false);

الخطوة 4 - إنشاء الوظائف

ستعيد وظيفة networkInfo معلومات حول اتصال الشبكة الحالي بمجرد النقر فوق الزر. نحن ندعو طريقة النوع . الوظائف الأخرى هي onOffline و onOnline . تستمع هذه الوظائف إلى تغييرات الاتصال وأي تغيير سيؤدي إلى ظهور رسالة التنبيه المقابلة.

function networkInfo() {
   var networkState = navigator.connection.type;
   var states = {};
   states[Connection.UNKNOWN]  = 'Unknown connection';
   states[Connection.ETHERNET] = 'Ethernet connection';
   states[Connection.WIFI]     = 'WiFi connection';
   states[Connection.CELL_2G]  = 'Cell 2G connection';
   states[Connection.CELL_3G]  = 'Cell 3G connection';
   states[Connection.CELL_4G]  = 'Cell 4G connection';
   states[Connection.CELL]     = 'Cell generic connection';
   states[Connection.NONE]     = 'No network connection';
   alert('Connection type: ' + states[networkState]);
}

function onOffline() {
   alert('You are now offline!');
}

function onOnline() {
   alert('You are now online!');
}