تخيل معي أنك تشاهد فيلمًا على الهاتف المحمول أو حتى تلعب لعبة على الكمبيوتر، والمتصفح ليس مغلقًا فحسب، بل لا يعمل إطلاقًا. لا فيسبوك مفتوح، ولا أمازون، ولا حتى موقع التسوق الذي زرته قبل قليل. ولكن فجأة، يظهر لك إشعار من الأسفل يخبرك: “المنتج الذي رأيته عاد إلى المخزن، سارع بطلبه بسرعة قبل أن ينفد”. فتتساءل في نفسك: “كيف لا يزال هذا الموقع يعمل؟ هل يراقبني؟”.
لا تقلق، لا يوجد سحر ولا تجسس. هناك قصة بسيطة تحدث في الخفاء، وخلفها تقنيات متقدمة مثل جافا سكريبت، الـ Service Worker، والـ Push API، بالإضافة إلى التشفير، وحتى طرف ثالث غامض وهو الـ Push Service. دعنا نروي القصة من البداية.
البداية: بوابة الاتصال الخفية
لنفترض أنك دخلت إلى موقع ما، وظهرت لك الرسالة أو السؤال المألوف الذي يظهر لنا جميعًا: “هل تسمح للموقع بإرسال إشعارات إليك؟”. وكالعادة، يضغط الكثيرون على “سماح” (Allow). هذه اللحظة تبدو بسيطة جدًا من الخارج، ولكن من الداخل، هي اللحظة التي فتحت بوابة اتصال بينك وبين الموقع، بوابة تظل تعمل حتى لو كان الموقع مغلقًا.
بمجرد أن يوافق المستخدم، يحدث أمران مهمان:
- تخزين الصلاحية: المتصفح يُخزّن صلاحية إرسال الإشعارات التي منحتها للموقع.
- طلب الاشتراك: يطلب الموقع، عبر جافا سكريبت، الاشتراك في خدمة الإشعارات (Push Notifications).
// مثال على طلب الاشتراك في الإشعارات
serviceWorkerRegistration.pushManager.subscribe({
userVisibleOnly: true,
applicationServerKey: applicationServerKey
});
هنا، يتدخل المتصفح ويرسل هذا الطلب إلى شيء مهم جدًا وهو الـ Push Service. هذه الخدمة هي ببساطة “مكتب البريد” الرسمي لشركة المتصفح. فإذا كنت تستخدم جوجل كروم مثلًا، فهذه الخدمة تسمى FCM (Firebase Cloud Messaging).
رحلة الإشعار: من الخادم إلى شاشتك
يرسل المتصفح لك ما يسمى بـ PushSubscription
، وهو كائن (object) يحتوي على معلومات حيوية:
endpoint
: وهو العنوان الفريد الذي ستُرسل إليه الرسائل.keys
: وهي مفاتيح تستخدم لتشفير محتوى الإشعار لضمان خصوصيته.expirationTime
: وهو وقت انتهاء صلاحية هذا الاشتراك.
هذه هي البيانات التي يرسلها موقع الويب إلى الخادم الخاص به لتخزينها. الآن، أصبح لدى الخادم عنوان المستخدم (Endpoint) ومفاتيح التشفير.
عندما يريد الخادم إرسال إشعار، فإنه يستخدم بروتوكولًا يسمى Web Push Protocol. يقوم بإعداد رسالة، يشفرها باستخدام المفاتيح التي لديه، ويرسلها إلى الـ Push Service. بدورها، تقوم الـ Push Service بتوصيل هذه الرسالة إلى المتصفح الخاص بالمستخدم.
ماذا لو كان الجهاز غير متصل بالإنترنت؟ لا مشكلة. تخزن الـ Push Service الرسالة مؤقتًا وتنتظر أول فرصة متاحة لإرسالها فورًا. يمكن للمطورين أيضًا إضافة بيانات وصفية (metadata) للتحكم في عملية التسليم:
TTL
(Time To Live): وقت صلاحية الإشعار.Urgency
: درجة الاستعجال (عالية أو منخفضة).Topic
: نوع الرسالة لتصنيفها.
كل هذا يساعد الـ Push Service على فهم أهمية الرسالة، ولمن يجب أن تُرسل، ومتى.
البطل الخفي: الـ Service Worker
وهنا يظهر بطل القصة الذي يعمل دائمًا في الخلفية: الـ Service Worker. حتى لو لم يكن الموقع مفتوحًا، يمكن للمتصفح تفعيل الـ Service Worker بمجرد وصول رسالة الدفع (Push message). يستقبل الـ Service Worker الحدث ويستخدم showNotification()
ليُظهر الإشعار على جهاز المستخدم فورًا.
// Service Worker يستمع لحدث الدفع
self.addEventListener('push', function(event) {
const title = 'إشعار جديد';
const options = {
body: 'وصلك شيء جديد!',
icon: 'images/icon.png',
badge: 'images/badge.png'
};
event.waitUntil(self.registration.showNotification(title, options));
});
والأجمل من ذلك، عندما يضغط المستخدم على الإشعار، يمكنك توجيهه إلى صفحة معينة باستخدام clients.openWindow()
.
// توجيه المستخدم عند النقر على الإشعار
self.addEventListener('notificationclick', function(event) {
event.notification.close();
event.waitUntil(
clients.openWindow('https://example.com')
);
});
وهذا يعني أن إشعارًا واحدًا يمكن أن يؤدي إلى نقرة، ثم إلى صفحة منتج، ومن ثم إلى عملية شراء جديدة.
سلاح ذو حدين
ولكن كن حذرًا، فالإشعارات ليست لعبة. إنها أداة قوية جدًا يمكنك أن تبني بها ثقة المستخدم أو تخسره إلى الأبد. فإذا استخدمتها بشكل صحيح، يمكنك إيصال محتوى مهم في الوقت المناسب وللمستخدم المناسب. لكن إذا أفرطت في استخدامها، سيختار الناس حظرك (block)، أو إلغاء الاشتراك (unsubscribe)، أو حتى تجنب موقعك تمامًا. فمن منا لا تصله إشعارات مزعجة يدفعه ذلك إلى حظرها أو حتى إلغاء تثبيت التطبيق من على الهاتف تمامًا.
خاتمة
في المرة القادمة عندما يصلك إشعار بسيط من موقع ما، تذكر أن هناك سلسلة كاملة من الأحداث تعمل في الخلفية: جافا سكريبت، Push API، Push Service، التشفير، Service Worker، وواجهة الإشعارات (Notifications API). كل هذا لكي تصلك جملة من سطرين فقط، إذا وصلت في الوقت المناسب، فإنها تصبح كنزًا.