الفرق بين المراجعتين لصفحة: «Cordova/cordova plugin network information»
لا ملخص تعديل |
جميل-بيلوني (نقاش | مساهمات) طلا ملخص تعديل |
||
(مراجعتان متوسطتان بواسطة مستخدمين اثنين آخرين غير معروضتين) | |||
سطر 1: | سطر 1: | ||
<noinclude>{{DISPLAYTITLE:إضافة حال الشبكة في كوردوفا}}</noinclude> | <noinclude>{{DISPLAYTITLE:إضافة حال الشبكة في كوردوفا}}</noinclude> | ||
[[تصنيف: Cordova]] | [[تصنيف: Cordova]] | ||
[[تصنيف: Plugin]] | [[تصنيف: Cordova Plugin]] | ||
توفر إضافة حالة الشبكة ( | توفر إضافة حالة الشبكة (cordova-plugin-network-information) تقديمًا لإصدار قديم من [http://www.w3.org/TR/2011/WD-netinfo-api-20110607/ الواجهة البرمجية لمعلومات الشبكة]، إذ توفر معلومات حول حالة الاتصال بشبكة الاتصال الخليوية (cellular) والشبكة اللاسلكي (wifi)، وتتحقق مما إذا كان الجهاز متصلًا بالإنترنت. | ||
للحصول على بعض الأفكار حول كيفية استخدام هذه الإضافة، | للحصول على بعض الأفكار حول كيفية استخدام هذه الإضافة، انتقل إلى [[Cordova/cordova plugin network information#.D9.85.D8.AB.D8.A7.D9.84 .D8.AA.D9.88.D8.B6.D9.8A.D8.AD.D9.8A|ا<nowiki/>لمثال التوضيحي]] في أسفل هذه الصفحة. | ||
== التثبيت == | == التثبيت == | ||
سطر 10: | سطر 10: | ||
== المنصات المدعومة == | == المنصات المدعومة == | ||
*أندرويد | *[[Cordova/platforms android|أندرويد]] | ||
*Browser | *Browser | ||
*iOS | *[[Cordova/platforms ios|iOS]] | ||
*ويندوز | *[[Cordova/platforms windows|ويندوز]] | ||
== <code>Connection</code> == | == <code>Connection</code> == | ||
يُوفر الكائن <code>connection</code>، الذي يمكن الحصول عليه عبر <code>navigator.connection</code>، معلوماتٍ حول الاتصال بشبكة الاتصال الخليوية (cellular) والشبكة اللاسلكي (wifi). | |||
=== | === الخاصيات === | ||
*<code>connection.type</code> | *<code>connection.type</code> | ||
=== | ===الثوابت=== | ||
*<code>Connection.UNKNOWN</code> | *<code>Connection.UNKNOWN</code> | ||
*<code>Connection.ETHERNET</code> | *<code>Connection.ETHERNET</code> | ||
سطر 31: | سطر 31: | ||
*<code>Connection.NONE</code> | *<code>Connection.NONE</code> | ||
==<code>connection.type</code>== | |||
توفر هذه الخاصية طريقة سريعة لتحديد حالة اتصال الجهاز بالشبكة، ونوع الاتصال. | توفر هذه الخاصية طريقة سريعة لتحديد حالة اتصال الجهاز بالشبكة، ونوع الاتصال. | ||
ألق نظرة على المثال التالي:<syntaxhighlight lang="javascript">function checkConnection() { | |||
<syntaxhighlight lang="javascript">function checkConnection() { | |||
var networkState = navigator.connection.type; | var networkState = navigator.connection.type; | ||
var states = {}; | var states = {}; | ||
سطر 50: | سطر 49: | ||
} | } | ||
checkConnection();</syntaxhighlight> | checkConnection();</syntaxhighlight> | ||
=== التغييرات في الواجهة البرمجية=== | |||
حتى الإصدار 2.3.0 من كوردوفا، كان المطورون يصلون إلى الكائن <code>Connection</code> عبر التعبير <code>navigator.network.connection</code>، وبعد ذلك تم تغييره إلى <code>navigator.connection</code> ليتطابق مع مواصفات W3C. لكنه لا يزال متوفرًا | حتى الإصدار 2.3.0 من كوردوفا، كان المطورون يصلون إلى الكائن <code>Connection</code> عبر التعبير <code>navigator.network.connection</code>، وبعد ذلك تم تغييره إلى <code>navigator.connection</code> ليتطابق مع مواصفات W3C. لكنه لا يزال متوفرًا بشكله القديم، غير أنّه أصبح مٌهملًا الآن، وسيُزال في الإصدارات القادمة. | ||
=== ملاحظات خاصة بمنصة iOS === | |||
* يتعذر على منصات iOS دون الإصدار | * يتعذر على منصات iOS دون الإصدار السابع اكتشافَ نوع الاتصال بالشبكة الخليوية. | ||
* تُعيّن الخاصية <code>navigator.connection.type</code> إلى القيمة <code>Connection.CELL</code> لجميع البيانات | * تُعيّن الخاصية <code>navigator.connection.type</code> إلى القيمة <code>Connection.CELL</code> لجميع البيانات الخليوية. | ||
=== ملاحظات خاصة بمنصة ويندوز === | |||
* عند تشغيل التطبيق على محاكي Windows Phone 8.1، فستكون الخاصية <code>navigator.connection.type</code> مساوية دائمًا للقيمة <code>Connection.ETHERNET</code>. | * عند تشغيل التطبيق على محاكي Windows Phone 8.1، فستكون الخاصية <code>navigator.connection.type</code> مساوية دائمًا للقيمة <code>Connection.ETHERNET</code>. | ||
=== ملاحظات خاصة بالمتصفحات (Browsers) === | |||
* لا يمكن للمتصفح اكتشاف نوع الاتصال بالشبكة. إذ تُضبط الخاصية <code>navigator.connection.type</code> دائمًا | * لا يمكن للمتصفح اكتشاف نوع الاتصال بالشبكة. إذ تُضبط الخاصية <code>navigator.connection.type</code> دائمًا إلى القيمة <code>Connection.UNKNOWN</code> عند الاتصال بالإنترنت. | ||
== أحداث متعلقة بالشبكة == | == أحداث متعلقة بالشبكة == | ||
سطر 65: | سطر 64: | ||
===<code>offline</code>=== | ===<code>offline</code>=== | ||
يُطلق هذا الحدث عند انقطاع اتصال التطبيق (offline)، وعندما لا يكون الجهاز | يُطلق هذا الحدث عند انقطاع اتصال التطبيق (offline)، وعندما لا يكون الجهاز متصلًا بالإنترنت. | ||
<syntaxhighlight lang="javascript">document.addEventListener("offline", yourCallbackFunction, false);</syntaxhighlight> | <syntaxhighlight lang="javascript">document.addEventListener("offline", yourCallbackFunction, false);</syntaxhighlight>يُطلق الحدث <code>offline</code> عندما يفقد جهازٌ مُتصلٌ اتصالَهُ بالشبكة، بحيث يتعذر على التطبيق الوصول إلى الإنترنت. يعتمد هذا الحدث على نفس معلومات الواجهة البرمجية للكائن <code>Connection</code>، ويُطلق عندما تصبح قيمة الخاصية <code>connection.type</code> مساوية للقيمة <code>NONE</code>. | ||
عادةً، يجب أن تستخدم التطبيقات التابعَ <code>document.addEventListener</code> لإرفاق مُنصتٍ للأحداث (event listener) بمجرد إطلاق الحدث [[Cordova/events#deviceready|<code>deviceready</code>]]. | |||
إليك المثال التالي:<syntaxhighlight lang="javascript">document.addEventListener("offline", onOffline, false); | |||
<syntaxhighlight lang="javascript">document.addEventListener("offline", onOffline, false); | |||
function onOffline() { | function onOffline() { | ||
// offline معالجة الحدث | // offline معالجة الحدث | ||
سطر 83: | سطر 79: | ||
===<code>online</code>=== | ===<code>online</code>=== | ||
يُطلق هذا الحدث عندما | يُطلق هذا الحدث عندما يصبح أحد التطبيقات متصلًا بالإنترنت، وعند توصيل الجهاز بالإنترنت. | ||
<syntaxhighlight lang="javascript">document.addEventListener("online", yourCallbackFunction, false);</syntaxhighlight> | <syntaxhighlight lang="javascript">document.addEventListener("online", yourCallbackFunction, false);</syntaxhighlight>يُطلق الحدث <code>online</code> عندما يتصل جهاز غير متصلٍ بالشبكة للسماح بوصول تطبيقٍ ما إلى الإنترنت. ويعتمد على نفس معلومات الواجهة البرمجية للكائن <code>Connection</code>، ويُطلَق عندما تتغير قيمة الخاصية <code>connection.type</code> من <code>NONE</code> إلى أي قيمة أخرى. | ||
في العادة، يجب أن تستخدم التطبيقاتُ التابعَ <code>document.addEventListener</code> لإرفاق منصتٍ بحدثٍ بمجرد إطلاق الحدث <code>[[Cordova/events#deviceready|deviceready]]</code>. | |||
إليك مثال سريع عن ذلك:<syntaxhighlight lang="javascript">document.addEventListener("online", onOnline, false); | |||
<syntaxhighlight lang="javascript">document.addEventListener("online", onOnline, false); | |||
function onOnline() { | function onOnline() { | ||
// online معالجة الحدث | // online معالجة الحدث | ||
سطر 103: | سطر 96: | ||
تعرض الشيفرات البرمجية الموجودة في هذا القسم أمثلةً لتغيير سلوك التطبيق باستخدام الحدثين <code>online</code> و <code>offline</code> وحالات الاتصال بالشبكة. | تعرض الشيفرات البرمجية الموجودة في هذا القسم أمثلةً لتغيير سلوك التطبيق باستخدام الحدثين <code>online</code> و <code>offline</code> وحالات الاتصال بالشبكة. | ||
سنبدأ بإنشاء | سنبدأ بإنشاء الكائن <code>FileEntry</code> الجديد (<code>data.txt</code>) لاستخدامه لجمع البيانات. استدع الدالة التالية في معالج الحدث <code>[[Cordova/events#deviceready|deviceready]]</code>. | ||
'''ملاحظة''': يتطلب هذا المثال تثبيت [[Cordova/cordova plugin file|إضافة الملفات]]. | '''ملاحظة''': يتطلب هذا المثال تثبيت [[Cordova/cordova plugin file|إضافة الملفات]]. | ||
سطر 121: | سطر 114: | ||
document.addEventListener("online", onOnline, false);</syntaxhighlight> | document.addEventListener("online", onOnline, false);</syntaxhighlight> | ||
ستعالج دالة التطبيق <code>onOnline</code> الحدث <code>online</code>. في معالج الحدث، | ستعالج دالة التطبيق <code>onOnline</code> الحدث <code>online</code>. في معالج الحدث، تحقَّق من الحالة الراهنة للشبكة. تعامل مع كل أنواع الاتصال باستثناء النوع <code>Connection.NONE</code>. وحاول تحميل ملف إن حصلت على اتصال. | ||
<syntaxhighlight lang="javascript">function onOnline() { | <syntaxhighlight lang="javascript">function onOnline() { | ||
// online معالجة الحدث | // online معالجة الحدث | ||
سطر 137: | سطر 130: | ||
إن فشل استدعاء التابع <code>upload</code> الخاص بالكائن <code>FileTransfer</code>، فاستدع دالة التطبيق <code>offlineWrite</code> لحفظ البيانات الحالية في مكان ما. | إن فشل استدعاء التابع <code>upload</code> الخاص بالكائن <code>FileTransfer</code>، فاستدع دالة التطبيق <code>offlineWrite</code> لحفظ البيانات الحالية في مكان ما. | ||
'''ملاحظة''': يتطلب هذا المثال الإضافة <code>FileTransfer</code>. | '''ملاحظة''': يتطلب هذا المثال تثبيت الإضافة <code>FileTransfer</code>. | ||
<syntaxhighlight lang="javascript">function tryToUploadFile() { | <syntaxhighlight lang="javascript">function tryToUploadFile() { | ||
// يحتوي على عنوان صالح يُشير إلى ملف نصي على الجهاز fileURL نفترض أن المتغير | // يحتوي على عنوان صالح يُشير إلى ملف نصي على الجهاز fileURL نفترض أن المتغير | ||
سطر 159: | سطر 152: | ||
};</syntaxhighlight> | };</syntaxhighlight> | ||
إليك شيفرة الدالة <code>offlineWrite</code> | إليك شيفرة الدالة <code>offlineWrite</code>: | ||
'''ملاحظة''': يتطلب هذا المثال [[Cordova/cordova plugin file|إضافة الملفات]]. | '''ملاحظة''': يتطلب هذا المثال [[Cordova/cordova plugin file|إضافة الملفات]]. | ||
سطر 181: | سطر 174: | ||
console.log("lost connection"); | console.log("lost connection"); | ||
}</syntaxhighlight> | }</syntaxhighlight> | ||
== انظر | == انظر أيضًا== | ||
*إضافة <nowiki/>[[Cordova/events|الأحداث]] | *إضافة <nowiki/>[[Cordova/events|الأحداث]] | ||
*إضافة <nowiki/>[[Cordova/cordova plugin file|الوصول إلى الملفات]] | *إضافة <nowiki/>[[Cordova/cordova plugin file|الوصول إلى الملفات]] |
المراجعة الحالية بتاريخ 07:49، 25 ديسمبر 2018
توفر إضافة حالة الشبكة (cordova-plugin-network-information) تقديمًا لإصدار قديم من الواجهة البرمجية لمعلومات الشبكة، إذ توفر معلومات حول حالة الاتصال بشبكة الاتصال الخليوية (cellular) والشبكة اللاسلكي (wifi)، وتتحقق مما إذا كان الجهاز متصلًا بالإنترنت.
للحصول على بعض الأفكار حول كيفية استخدام هذه الإضافة، انتقل إلى المثال التوضيحي في أسفل هذه الصفحة.
التثبيت
يمكن تثبيت هذه الإضافة عبر الأمر:
cordova plugin add cordova-plugin-network-information
المنصات المدعومة
Connection
يُوفر الكائن connection
، الذي يمكن الحصول عليه عبر navigator.connection
، معلوماتٍ حول الاتصال بشبكة الاتصال الخليوية (cellular) والشبكة اللاسلكي (wifi).
الخاصيات
connection.type
الثوابت
Connection.UNKNOWN
Connection.ETHERNET
Connection.WIFI
Connection.CELL_2G
Connection.CELL_3G
Connection.CELL_4G
Connection.CELL
Connection.NONE
connection.type
توفر هذه الخاصية طريقة سريعة لتحديد حالة اتصال الجهاز بالشبكة، ونوع الاتصال.
ألق نظرة على المثال التالي:
function checkConnection() {
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]);
}
checkConnection();
التغييرات في الواجهة البرمجية
حتى الإصدار 2.3.0 من كوردوفا، كان المطورون يصلون إلى الكائن Connection
عبر التعبير navigator.network.connection
، وبعد ذلك تم تغييره إلى navigator.connection
ليتطابق مع مواصفات W3C. لكنه لا يزال متوفرًا بشكله القديم، غير أنّه أصبح مٌهملًا الآن، وسيُزال في الإصدارات القادمة.
ملاحظات خاصة بمنصة iOS
- يتعذر على منصات iOS دون الإصدار السابع اكتشافَ نوع الاتصال بالشبكة الخليوية.
- تُعيّن الخاصية
navigator.connection.type
إلى القيمةConnection.CELL
لجميع البيانات الخليوية.
ملاحظات خاصة بمنصة ويندوز
- عند تشغيل التطبيق على محاكي Windows Phone 8.1، فستكون الخاصية
navigator.connection.type
مساوية دائمًا للقيمةConnection.ETHERNET
.
ملاحظات خاصة بالمتصفحات (Browsers)
- لا يمكن للمتصفح اكتشاف نوع الاتصال بالشبكة. إذ تُضبط الخاصية
navigator.connection.type
دائمًا إلى القيمةConnection.UNKNOWN
عند الاتصال بالإنترنت.
أحداث متعلقة بالشبكة
offline
يُطلق هذا الحدث عند انقطاع اتصال التطبيق (offline)، وعندما لا يكون الجهاز متصلًا بالإنترنت.
document.addEventListener("offline", yourCallbackFunction, false);
يُطلق الحدث offline
عندما يفقد جهازٌ مُتصلٌ اتصالَهُ بالشبكة، بحيث يتعذر على التطبيق الوصول إلى الإنترنت. يعتمد هذا الحدث على نفس معلومات الواجهة البرمجية للكائن Connection
، ويُطلق عندما تصبح قيمة الخاصية connection.type
مساوية للقيمة NONE
.
عادةً، يجب أن تستخدم التطبيقات التابعَ document.addEventListener
لإرفاق مُنصتٍ للأحداث (event listener) بمجرد إطلاق الحدث deviceready
.
إليك المثال التالي:
document.addEventListener("offline", onOffline, false);
function onOffline() {
// offline معالجة الحدث
}
ملاحظات خاصة بمنصة iOS
أثناء بدء التشغيل الأولي، يستغرق أول حدثٍ offline
(إن كان مُطبّقا) ثانيةً واحدةً على الأقل قبل إطلاقه.
online
يُطلق هذا الحدث عندما يصبح أحد التطبيقات متصلًا بالإنترنت، وعند توصيل الجهاز بالإنترنت.
document.addEventListener("online", yourCallbackFunction, false);
يُطلق الحدث online
عندما يتصل جهاز غير متصلٍ بالشبكة للسماح بوصول تطبيقٍ ما إلى الإنترنت. ويعتمد على نفس معلومات الواجهة البرمجية للكائن Connection
، ويُطلَق عندما تتغير قيمة الخاصية connection.type
من NONE
إلى أي قيمة أخرى.
في العادة، يجب أن تستخدم التطبيقاتُ التابعَ document.addEventListener
لإرفاق منصتٍ بحدثٍ بمجرد إطلاق الحدث deviceready
.
إليك مثال سريع عن ذلك:
document.addEventListener("online", onOnline, false);
function onOnline() {
// online معالجة الحدث
}
ملاحظات خاصة بمنصة iOS
أثناء بدء التشغيل الأولي، يستغرق الحدث online
الأول (إن وُجد) ثانية واحدةً على الأقل قبل إطلاقه، وتكون قيمة الخاصية connection.type
قبل ذلك مساوية للقيمة UNKNOWN
.
مثال توضيحي
تعرض الشيفرات البرمجية الموجودة في هذا القسم أمثلةً لتغيير سلوك التطبيق باستخدام الحدثين online
و offline
وحالات الاتصال بالشبكة.
سنبدأ بإنشاء الكائن FileEntry
الجديد (data.txt
) لاستخدامه لجمع البيانات. استدع الدالة التالية في معالج الحدث deviceready
.
ملاحظة: يتطلب هذا المثال تثبيت إضافة الملفات.
var dataFileEntry;
function createSomeData() {
window.requestFileSystem(window.TEMPORARY, 5 * 1024 * 1024, function (fs) {
console.log('file system open: ' + fs.name);
// انشاء ملف جديد، أو فتح ملف موجود
fs.root.getFile("data.txt", { create: true, exclusive: false }, function (fileEntry) {
dataFileEntry = fileEntry;
}, onErrorCreateFile);
}, onErrorLoadFs);
}
بعد ذلك، أضف مُنصتَين (listeners) للحدثين online
و offline
في معالج الحدث deviceready
.
document.addEventListener("offline", onOffline, false);
document.addEventListener("online", onOnline, false);
ستعالج دالة التطبيق onOnline
الحدث online
. في معالج الحدث، تحقَّق من الحالة الراهنة للشبكة. تعامل مع كل أنواع الاتصال باستثناء النوع Connection.NONE
. وحاول تحميل ملف إن حصلت على اتصال.
function onOnline() {
// online معالجة الحدث
var networkState = navigator.connection.type;
if (networkState !== Connection.NONE) {
if (dataFileEntry) {
tryToUploadFile();
}
}
display('Connection type: ' + networkState);
}
الشيفرة السابقة ستستدعي دالة التطبيق tryToUploadFile
عند إطلاق الحدث online
.
إن فشل استدعاء التابع upload
الخاص بالكائن FileTransfer
، فاستدع دالة التطبيق offlineWrite
لحفظ البيانات الحالية في مكان ما.
ملاحظة: يتطلب هذا المثال تثبيت الإضافة FileTransfer
.
function tryToUploadFile() {
// يحتوي على عنوان صالح يُشير إلى ملف نصي على الجهاز fileURL نفترض أن المتغير
var fileURL = getDataFileEntry().toURL();
var success = function (r) {
console.log("Response = " + r.response);
display("Uploaded. Response: " + r.response);
}
var fail = function (error) {
console.log("An error has occurred: Code = " + error.code);
offlineWrite("Failed to upload: some offline data");
}
var options = new FileUploadOptions();
options.fileKey = "file";
options.fileName = fileURL.substr(fileURL.lastIndexOf('/') + 1);
options.mimeType = "text/plain";
var ft = new FileTransfer();
// Content-Security-Policy تأكد من إضافة نطاق عنوان الخادم إلى الوسم
// index.html في الملف
ft.upload(fileURL, encodeURI(SERVER), success, fail, options);
};
إليك شيفرة الدالة offlineWrite
:
ملاحظة: يتطلب هذا المثال إضافة الملفات.
function offlineWrite(offlineData) {
// FileEntry لأجل FileWriter انشاء كائن
dataFileEntry.createWriter(function (fileWriter) {
fileWriter.onwriteend = function () {
console.log("Successful file write...");
display(offlineData);
};
fileWriter.onerror = function (e) {
console.log("Failed file write: " + e.toString());
};
fileWriter.write(offlineData);
});
}
عند وقوع الحدث offline
، افعل شيئًا ما، مثل تنبيه المستخدم. في هذا المثال، سنعرض رسالة عبر دالة سطر الأوامر log
.
function onOffline() {
// offline معالجة الحدث
console.log("lost connection");
}
انظر أيضًا
- إضافة الأحداث
- إضافة الوصول إلى الملفات
- دليل تطوير الإضافات في كوردوفا