إرسال بيانات المرشد في Chrome 39

Ewa Gasperowicz

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

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

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

تُضيف طريقة navigator.sendBeacon() البيانات إلى "قائمة الانتظار" ليتم إرسالها من خلال المتصفّح في أقرب وقت ممكن، ولكنّها لا تبطئ عملية التنقّل. يتم عرض القيمة true إذا تمكّن المتصفّح من إضافة البيانات إلى "قائمة الانتظار" بنجاح لنقلها. بخلاف ذلك، يتم عرض false.

لنفترض أنّ لدينا نقطة نهاية خادم متاحة لتلقّي بيانات ال beacon من صفحتنا على هذا العنوان:

https://putsreq.herokuapp.com/Dt7t2QzUkG18aDTMMcop

إذا أضفنا طريقة sendBeacon() في معالِج الحدث pagehide، ستتلقّى نقطة النهاية البيانات عندما ينتقل المستخدم بعيدًا عن الصفحة:

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

بدلاً من ذلك، يمكنك الانتقال إلى صفحة فحص PutsReq لمعرفة ما إذا تم استلام بيانات الإشارة.

هناك أيضًا عنصر مخصّص Polymer يتيح لك إرسال بيانات ال beacon‏ - <beacon-send>. يمكنك الاطّلاع عليها على ebidel.github.io/beacon-send.