أداة المحادثة وContent-Security-Policy: ما الذي يجب السماح به

إذا كان موقعك يعيّن سياسة CSP، فقد لا تُحمَّل المحادثة دون أي رسالة خطأ. نشرح التوجيهات التي تحتاجها الأداة، ولماذا لا حاجة إلى unsafe-inline.

Content-Security-Policy ترويسة يخبر بها الموقع المتصفح من أين يُسمح بتحميل السكربتات والتنسيقات والبيانات. إنها حماية مفيدة لكنها صارمة: كل ما لم يُسمح به صراحةً يحظره المتصفح، ومن دون أي خطأ ظاهر على الصفحة. ولهذا فإن الشكوى الأكثر شيوعًا من المواقع التي تستخدم CSP هي: «ألصقنا الكود، لكن زر المحادثة لا يظهر».

ثلاثة توجيهات للأداة

تحمّل الأداة سكربتًا، وتضيف تنسيقاتها الخاصة، وتتبادل الرسائل مع الخادم. أي أن نطاق Webchatix يجب أن يكون موجودًا في ثلاثة توجيهات:

وإذا كنتم تتبادلون الصور في المحادثة، فأضف النطاق نفسه إلى img-src أيضًا: فمعاينات الصور تُحمَّل من خادمنا. الصيغة الدقيقة للمقتطف وقائمة التوجيهات موجودة في قسم «أداة الموقع» من التوثيق.

لماذا لا حاجة إلى unsafe-inline

في السابق كانت الأداة تُدرج تنسيقاتها مباشرة في الصفحة عبر الوسم <style>، فكانت المواقع ذات السياسة الصارمة مضطرة إلى الإبقاء على 'unsafe-inline' في style-src. ولم يكن الـ hash أو الـ nonce حلًّا هنا: فالأداة تتحدّث تلقائيًا، وكانت قيمة الـ hash ستتغير مع كل إصدار. أما الآن فالتنسيقات في ملف منفصل على نطاقنا — يكفي السماح بالنطاق، دون أي استثناءات للتنسيقات المضمّنة.

إذا كانت السياسة قديمة

يحدث أن يكون النطاق مُدرجًا بالفعل في script-src وconnect-src، لكنه غائب عن style-src. لمثل هذه المواقع لدى الأداة طريق احتياطي: إذا كانت التنسيقات المضمّنة مسموحًا بها في الصفحة، فإنها تجلب ملف التنسيقات نفسه وتُدرجه بنفسها. تبدو المحادثة حينها كالمعتاد، لكن الأصح مع ذلك أن تضيف النطاق إلى style-src.

الوجه الآخر: النطاقات المسموح بها

سياسة CSP تحمي موقعك، أما حقل Allowed origins (CORS) في إعدادات الموقع فيحمي محادثتك: فهو يحدد العناوين التي تقبل الأداة الاتصال منها أصلًا. من المريح ترك النجمة * خلال فترة الاختبار، لكن على الموقع الفعلي يُفضَّل أن تسرد نطاقاتك مفصولة بفواصل. عن هذا وعن إجراءات أخرى تجد المزيد في قسم «الأمان وGDPR».

كيف تتحقق في دقيقة

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

→ كل المقالات