تمت ترجمة هذه الصفحة بواسطة Cloud Translation API‏.

تجارب أكثر ثراءً بلا اتصال بالإنترنت من خلال واجهة برمجة التطبيقات Periodic Background Sync API

يمكنك مزامنة بيانات تطبيق الويب في الخلفية للحصول على تجربة تشبه التطبيق أكثر.

Jeff Posnick

Joe Medley

هل سبق لك أن تعرضت لأي من المواقف التالية؟

قيادة قطار أو مترو أنفاق في حالة مزاجية غير مستقرة أو بدون اتصال بالإنترنت
تقييد مشغّل شبكة الجوّال بسبب مشاهدة عدد كبير جدًا من الفيديوهات
العيش في بلد يكافح فيه معدل نقل البيانات لمواكبة الطلب

إذا حدث ذلك، شعرت بالتأكيد بالاستياء بسبب تنفيذ إجراءات معيّنة على الويب، وتساءلت عن سبب تحسين أداء التطبيقات الخاصة بنظام التشغيل في هذه الحالات. يمكن للتطبيقات الخاصة بالنظام الأساسي جلب محتوى جديد مثل المقالات الإخبارية أو معلومات الطقس في وقت مبكر. حتى لو لم تكن هناك شبكة في مترو الأنفاق، سيظل بإمكانك قراءة الأخبار.

تمكّن ميزة "المزامنة الدورية في الخلفية" لتطبيقات الويب من مزامنة البيانات بشكل دوري في الخلفية، ما يجعل تطبيقات الويب أقرب إلى سلوك أي تطبيق خاص بالنظام الأساسي.

تجربة الإيماءة

يمكنك تجربة المزامنة الدورية في الخلفية مع تطبيق العرض التوضيحي المباشر. وقبل استخدامه، تأكَّد مما يلي:

أنت تستخدم الإصدار 80 من متصفّح Chrome أو إصدار أحدث.
عليك تثبيت تطبيق الويب قبل تفعيل المزامنة الدورية في الخلفية.

المفاهيم والاستخدام

تتيح لك المزامنة الدورية للخلفية عرض محتوى جديد عند إطلاق تطبيق ويب تقدّمي أو صفحة مدعومة من مشغّل الخدمات. ويقوم بذلك عن طريق تنزيل البيانات في الخلفية عندما لا يتم استخدام التطبيق أو الصفحة. يمنع ذلك تحديث محتوى التطبيق بعد الإطلاق أثناء عرضه. والأفضل من ذلك، أنها تمنع التطبيق من عرض مؤشر سريان عمل المحتوى قبل التحديث.

بدون مزامنة الخلفية الدورية، يجب أن تستخدم تطبيقات الويب طُرقًا بديلة لتنزيل البيانات. وأحد الأمثلة الشائعة هو استخدام الإشعارات الفورية لتنبيه عامل الخدمة. تتم مقاطعة المستخدم برسالة مثل "تتوفّر بيانات جديدة". تحديث البيانات هو أثر جانبي في الأساس. لا يزال بإمكانك استخدام الإشعارات الفورية للحصول على التحديثات المهمة حقًا، مثل الأخبار العاجلة

يمكن الخلط بين المزامنة الدورية للخلفية ومزامنة الخلفية بسهولة. وعلى الرغم من أن لهما أسماء متشابهة، إلا أن حالات الاستخدام الخاصة بهما مختلفة. من بين أمور أخرى، يتم استخدام المزامنة في الخلفية بشكل شائع لإعادة إرسال البيانات إلى الخادم عند إخفاق طلب سابق.

تحسين تفاعل المستخدمين

تم إجراء المزامنة بشكل غير صحيح، فقد تؤدي المزامنة الدورية في الخلفية إلى إهدار موارد المستخدمين. قبل طرحه، مرّ Chrome بفترة تجريبية للتأكّد من صحته. يشرح هذا القسم بعض قرارات التصميم التي اتخذها Chrome لجعل هذه الميزة مفيدة قدر الإمكان.

قرار Chrome الأول بشأن التصميم هو أن تطبيق الويب لا يمكنه استخدام المزامنة الدورية في الخلفية إلا بعد أن يثبّته الشخص على جهازه ويشغّله كتطبيق منفصل. لا تتوفر المزامنة الدورية في الخلفية في سياق علامة تبويب عادية في Chrome.

وعلاوة على ذلك، نظرًا لأن Chrome لا يريد أن تستهلك تطبيقات الويب غير المستخدمة أو التي نادرًا ما يتم استخدامها البطارية أو البيانات بدون مبرر، صمّم Chrome ميزة مزامنة الخلفية الدورية بحيث يضطر المطوّرون إلى تحقيق الربح منها من خلال تقديم قيمة للمستخدمين. بتعبير آخر، يستخدم Chrome نتيجة التفاعل مع الموقع الإلكتروني (about://site-engagement/) لتحديد ما إذا كان يمكن أن تحدث المزامنات الدورية في الخلفية لتطبيق ويب معيّن ووتيرة حدوثها. وبعبارة أخرى، لن يتم تنشيط حدث periodicsync على الإطلاق ما لم تكن نتيجة التفاعل أكبر من صفر، وتؤثِّر قيمته في معدّل إطلاق حدث periodicsync. وهذا يضمن أن التطبيقات الوحيدة التي تتم مزامنتها في الخلفية هي التطبيقات التي تستخدمها بنشاط.

تشارك المزامنة الدورية للخلفية بعض أوجه التشابه مع واجهات برمجة التطبيقات والممارسات الحالية على الأنظمة الأساسية الشائعة. على سبيل المثال، تسمح المزامنة لمرّة واحدة في الخلفية إلى جانب الإشعارات بدفع الإشعارات لفترة أطول قليلاً (عبر مشغّل الخدمات) بعد أن يغلق المستخدم الصفحة. في معظم الأنظمة الأساسية، من الشائع أن يثبت الأشخاص تطبيقات يمكنها الوصول إلى الشبكة بشكل دوري في الخلفية لتوفير تجربة مستخدم أفضل للتحديثات المهمة وجلب المحتوى مسبقًا ومزامنة البيانات وما إلى ذلك. وبالمثل، تعمل المزامنة الدورية في الخلفية أيضًا على تمديد عمر منطق تطبيق الويب لتعمل على فترات منتظمة لمدة بضع دقائق في كل مرة.

وإذا سمح المتصفح بحدوث ذلك بشكل متكرر وبدون قيود، قد يؤدي ذلك إلى بعض المخاوف بشأن الخصوصية. إليك كيفية تعامل Chrome مع هذا الخطر المتعلق بالمزامنة الدورية في الخلفية:

لا يحدث نشاط المزامنة في الخلفية إلا على الشبكة التي سبق أن اتصل بها الجهاز. وينصح Chrome بالاتصال بالشبكات التي تديرها جهات موثوق بها فقط.
كما هو الحال مع جميع اتصالات الإنترنت، تكشف المزامنة الدورية في الخلفية عن عناوين IP للعميل والخادم الذي يتواصل معه واسم الخادم. ولتقليل هذا التعرض إلى ما يحدث تقريبًا إذا لم تتم مزامنة التطبيق إلا عندما يكون في المقدمة، يحد المتصفح من معدل تكرار عمليات المزامنة في خلفية التطبيق لتتماشى مع عدد مرات استخدام الشخص لهذا التطبيق. وإذا توقف الشخص عن التفاعل بشكل متكرر مع التطبيق، فسيتم إيقاف تشغيل المزامنة الدورية في الخلفية. وهذا تحسُّن صافي مقارنةً بالوضع الراهن في التطبيقات الخاصة بنظام التشغيل.

متى يمكن استخدامها؟

تختلف قواعد الاستخدام باختلاف المتصفّح. للتلخيص مما ورد أعلاه، يضع Chrome المتطلبات التالية على المزامنة الدورية في الخلفية:

نتيجة معيّنة لتفاعل المستخدم.
توفُّر شبكة تم استخدامها سابقًا.

لا يمكن للمطوّرين التحكم في توقيت المزامنة. وسيتوافق تكرار المزامنة مع عدد مرات استخدام التطبيق. (لاحظ أن التطبيقات الخاصة بنظام التشغيل لا تقوم بذلك حاليًا). كما يأخذ أيضًا طاقة الجهاز وحالة الاتصال.

متى يجب استخدامها؟

عندما يستيقظ مشغّل الخدمات للتعامل مع حدث periodicsync، تكون لديك الفرصة لطلب البيانات بدون الإلزام بذلك. وعند معالجة الحدث، يجب مراعاة ظروف الشبكة ومساحة التخزين المتاحة وتنزيل كميات مختلفة من البيانات استجابةً لذلك. يمكنك استخدام الموارد التالية للمساعدة:

الأذونات

بعد تثبيت مشغّل الخدمة، استخدِم Permissions API لطلب البحث عن periodic-background-sync. يمكنك القيام بذلك من نافذة أو سياق عامل تقديم الخدمات.

const status = await navigator.permissions.query({
  name: 'periodic-background-sync',
});
if (status.state === 'granted') {
  // Periodic background sync can be used.
} else {
  // Periodic background sync cannot be used.
}

تسجيل مزامنة دورية

كما سبق وذكرنا، تتطلب المزامنة الدورية في الخلفية مشغّل خدمات. استرداد PeriodicSyncManager باستخدام ServiceWorkerRegistration.periodicSync وطلب register() من خلاله. يتطلب التسجيل كلاً من علامة والحد الأدنى للمزامنة (minInterval). تحدد العلامة المزامنة المسجلة حتى يمكن تسجيل عمليات مزامنة متعددة. في المثال أدناه، اسم العلامة هو 'content-sync' وminInterval هو يوم واحد.

const registration = await navigator.serviceWorker.ready;
if ('periodicSync' in registration) {
  try {
    await registration.periodicSync.register('content-sync', {
      // An interval of one day.
      minInterval: 24 * 60 * 60 * 1000,
    });
  } catch (error) {
    // Periodic background sync cannot be used.
  }
}

التحقق من التسجيل

يمكنك استدعاء periodicSync.getTags() لاسترداد مصفوفة من علامات التسجيل. يستخدم المثال أدناه أسماء العلامات للتأكد من أن تحديث ذاكرة التخزين المؤقت نشط لتجنب التحديث مرة أخرى.

const registration = await navigator.serviceWorker.ready;
if ('periodicSync' in registration) {
  const tags = await registration.periodicSync.getTags();
  // Only update content if sync isn't set up.
  if (!tags.includes('content-sync')) {
    updateContentOnPageLoad();
  }
} else {
  // If periodic background sync isn't supported, always update.
  updateContentOnPageLoad();
}

ويمكنك أيضًا استخدام getTags() لعرض قائمة بعمليات التسجيل النشطة في صفحة إعدادات تطبيق الويب حتى يتمكّن المستخدمون من تفعيل أنواع معيّنة من التحديثات أو إيقافها.

الاستجابة لحدث مزامنة دوري في الخلفية

للاستجابة لحدث دوري في الخلفية للمزامنة، أضِف معالج أحداث periodicsync إلى مشغّل الخدمة. سيحتوي عنصر event الذي تم تمريره إليه على معلَمة tag تتطابق مع القيمة المستخدمة أثناء التسجيل. على سبيل المثال، إذا تم تسجيل مزامنة دورية في الخلفية بالاسم 'content-sync'، سيصبح event.tag عندها 'content-sync'.

self.addEventListener('periodicsync', (event) => {
  if (event.tag === 'content-sync') {
    // See the "Think before you sync" section for
    // checks you could perform before syncing.
    event.waitUntil(syncContent());
  }
  // Other logic for different tags as needed.
});

إلغاء تسجيل مزامنة

لإنهاء عملية مزامنة مسجّلة، استدعِ periodicSync.unregister() باسم المزامنة التي تريد إلغاء تسجيلها.

const registration = await navigator.serviceWorker.ready;
if ('periodicSync' in registration) {
  await registration.periodicSync.unregister('content-sync');
}

واجهات

في ما يلي عرض سريع للواجهات التي تقدّمها واجهة برمجة التطبيقات Regionic Background Sync API.

PeriodicSyncEvent. يتم تمريره إلى معالِج أحداث "ServiceWorkerGlobalScope.onperiodicsync" في وقت اختيار المتصفّح.
PeriodicSyncManager. لتسجيل عمليات المزامنة الدورية وإلغاء تسجيلها، وتوفير علامات للمزامنات المسجّلة. استرجع مثيل هذه الفئة من الخاصية ServiceWorkerRegistration.periodicSync`.
ServiceWorkerGlobalScope.onperiodicsync. يسجِّل المعالج لاستلام PeriodicSyncEvent.
ServiceWorkerRegistration.periodicSync. يعرض مرجعًا إلى PeriodicSyncManager.

مثال

جارٍ تعديل المحتوى

يستخدم المثال التالي مزامنة خلفية دورية لتنزيل أحدث المقالات لموقع إخباري أو مدونة في ذاكرة التخزين المؤقت. لاحظ اسم العلامة، الذي يشير إلى نوع المزامنة ('update-articles'). ويتم تضمين استدعاء updateArticles() في event.waitUntil() بحيث لا يتم إنهاء عامل الخدمة قبل أن يتم تنزيل المقالات وتخزينها.

async function updateArticles() {
  const articlesCache = await caches.open('articles');
  await articlesCache.add('/api/articles');
}

self.addEventListener('periodicsync', (event) => {
  if (event.tag === 'update-articles') {
    event.waitUntil(updateArticles());
  }
});

إضافة مزامنة دورية في الخلفية إلى تطبيق ويب حالي

كانت هذه المجموعة من التغييرات مطلوبة لإضافة مزامنة دورية في الخلفية إلى تطبيق ويب تقدّمي حالي. يتضمن هذا المثال عددًا من عبارات التسجيل المفيدة التي تصف حالة المزامنة الدورية في الخلفية في تطبيق الويب.

تصحيح الأخطاء

قد يمثل الحصول على عرض شامل للمزامنة الدورية في الخلفية أثناء الاختبار محليًا. توفر المعلومات حول عمليات التسجيل النشطة والفترات الزمنية التقريبية للمزامنة وسجلات أحداث المزامنة السابقة سياقًا قيمًا أثناء تصحيح أخطاء سلوك تطبيق الويب. لحسن الحظ، يمكنك العثور على كل هذه المعلومات من خلال ميزة تجريبية في "أدوات مطوري البرامج في Chrome".

تسجيل النشاط المحلي

يتم تنظيم قسم المزامنة الدورية في الخلفية في "أدوات مطوري البرامج" حول الأحداث الرئيسية في مراحل نشاط المزامنة الدورية في الخلفية، وهي التسجيل للمزامنة وإجراء المزامنة في الخلفية وإلغاء التسجيل. للحصول على معلومات حول هذه الأحداث، انقر على بدء التسجيل.

أثناء التسجيل، ستظهر الإدخالات في "أدوات مطوري البرامج" بما يتوافق مع الأحداث، مع تسجيل السياق والبيانات الوصفية لكل منها.

مثال على البيانات المسجّلة للمزامنة الدورية في الخلفية

بعد تفعيل ميزة التسجيل لمرة واحدة، ستظل مفعّلة لمدة تصل إلى ثلاثة أيام، ما يتيح لأدوات مطوّري البرامج تسجيل معلومات تصحيح الأخطاء المحلية المتعلّقة بالمزامنات في الخلفية التي قد تتم في الخلفية، وحتى لساعات في المستقبل.

محاكاة الأحداث

قد يكون تسجيل النشاط في الخلفية مفيدًا في هذه الحالة، ولكن في بعض الأحيان قد تحتاج إلى اختبار المعالج "periodicsync" فورًا بدون انتظار بدء الحدث وفقًا للوتيرة الطبيعية.

يمكنك إجراء ذلك من خلال قسم مشغِّلو الخدمات ضمن لوحة التطبيق في "أدوات مطوري البرامج في Chrome". ويسمح لك حقل المزامنة الدورية بتوفير علامة للحدث لكي تستخدمه، وتشغيلها كما تشاء.

ملاحظة: يتطلّب تشغيل حدث periodicsync يدويًا استخدام الإصدار 81 من Chrome أو إصدار أحدث.

يعرض قسم "مشغِّلو الخدمات" في لوحة التطبيق حقلاً نصيًا وزرًا "مزامنة دورية".

استخدام واجهة "أدوات مطوري البرامج"

بدءًا من الإصدار 81 من Chrome، سترى قسم المزامنة الدورية في الخلفية في لوحة تطبيق أدوات مطوّري البرامج.

لوحة التطبيق تعرض قسم "مزامنة الخلفية الدورية"