لا تحب الإعلانات؟ يذهب خالية من الإعلانات اليوم 

سياسة محتوى الأمان كتابة رأسية سياسة محتوى الأمان التي تعمل فعليًا

نُشرت في 1 مايو 2026

إعلان · حذف؟

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

تُعرض هذه المذكرة ما يفعله سياسة محتوى (CSP)، وما هي المُوجّهات المهمة، وكيفية كتابة رأس يمنع هجمات حقيقية دون أن يُؤثر على تطبيقك.

ما يفعله سياسة محتوى (CSP) في الواقع

تُخبر المتصفح من أين يُسمح له بتحميل الموارد. فقط الأكواد من هذا المجال. الأسلوب من هذا CDN. الصور من أي مكان. لا توجد أكواد داخلية.

عندما يتلقى المتصفح رأسًا لسياسة محتوى (CSP)، فإنه يُطبّق هذه القواعد قبل تنفيذ أي شيء. إذا أدخلت هجوم على تطبيقات (XSS) مُتسلسلة إلى ملف HTML الخاص بك، فإن سياسة محتوى (CSP) تمنعه على مستوى المتصفح — حتى لو تجاوزت الأكواد المدخلة من قبل تطبيك.

هذا هو القيمة الأساسية: سياسة محتوى (CSP) هي خط الدفاع الثاني عندما تفشل التحقق من المدخلات.

الموجّهات المهمة

تضم سياسة محتوى (CSP) مئات الموجّهات، لكن معظم الرؤوس المُستخدم في الإنتاج تحتاج فقط إلى ستة:

الموجّهة	ما يقيدها	الخطأ الشائع
`default-src`	مُستند إلى أي نوع من الموارد غير المذكورة صراحة	جلسة `'self'`، ثم نسي أن الأسلوب والمرجعات غير مُغطاة
`script-src`	مواقع مصادر الأكواد البرمجية والتنفيذ الداخلي	إضافة `'unsafe-inline'` لإغلاق أخطاء المُطبّق في المتصفح
`style-src`	مواقع مصادر الأسلوب والمسارات الداخلية	نسي أن مصادر CDN أو الأسلوب المُدخل من مكتبات البرمجيات
`img-src`	مواقع الصور بما في ذلك URIs المُستمدة	مُغيب `data:` لصور base64، `blob:` لإسقاطات Canvas
`connect-src`	مواقع الوجهات الخاصة بـ XHR، fetch، WebSocket، وEventSource	نسي أن تُدرج نقاط تحليل الأداء أو مصادر الواجهات
`frame-ancestors`	أي مصادر يمكنها تضمين موقعك في `<iframe>`	الإغفال تمامًا — مما يُترك هجوم التسجيل المُباشر مفتوحًا

frame-ancestors تُستبدل الرأس القديم X-Frame-Options وهي تستحق الإضافة حتى قبل أن تُكمل سياسة محتوى (CSP) في أماكن أخرى.

لماذا `unsafe-inline` تدمير القيمة

عندما تضيف 'unsafe-inline' ل script-srcأنت تخبر المتصفح: انفذ أي مُتسلسل من المُتسلسلات التي تجد، من أي مصدر. وهذا يشمل الأكواد المُدخلة من هجمات XSS.

'unsafe-eval' أسوأ من ذلك — يسمح eval(), Function()و، و setTimeout("string")التي تكون مُستخدمة كأحد مسارات الهجوم حتى في مشاريع نظيفة بشكل عام.

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

الطريقة الصحيحة: أكواد التحقق (Nonces) ومؤشرات التجزئة (Hashes)

إذا كانت لديك أكواد داخلية قانونية، فإن لديك خيارين لا يُفقدان سياسة المُراقبة:

التحقق (Nonces) تُولّد قيمة فريدة لكل تحميل صفحة. تُضاف هذه القيمة إلى رأس سياسة محتوى (CSP) و إلى السمة الخاصة بالكود المُدخل. فقط الأكواد التي تمت مطابقتها للتحقق تُنفذ. nonce التحقق (Hashes)

<!-- CSP header -->
Content-Security-Policy: script-src 'nonce-abc123xyz'

<!-- Inline script with matching nonce -->
<script nonce="abc123xyz">
  window.analyticsId = '...';
</script>

تُحسب بصمة SHA-256 لملف الكود المحدد. أضف هذه البصمة إلى ويمكن للمتصفح تنفيذ هذا الكود المحدد فقط — ولا شيء آخر. script-src يُستخدم التحقق (Nonces) بشكل أفضل في الصفحات الديناميكية حيث تتغير المحتوى مع كل طلب. أما التحقق (Hashes) فيناسب الأكواد الثابتة التي لا تتغير بين التحديثات.

Content-Security-Policy: script-src 'sha256-RFWPLDbv2BY+rCkDzsE+0fr8ylGr2R2faWMhq4lfEQc='

أطلق التثبيت مع وضع التقرير فقط أولًا

إضافة سياسة محتوى (CSP) إلى موقع موجود دون اختبار هو السبب في تدميره في الإنتاج. ابدأ برأس التقرير فقط بدلاً من ذلك:

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

Content-Security-Policy-Report-Only: default-src 'self'; script-src 'self' 'nonce-{random}'; report-uri /csp-violations

أغلب تطبيقات سياسة محتوى (CSP) التي تُوقف المواقع تفوت هذه الخطوة.

سياسة محتوى (CSP) حقيقية لتطبيق SaaS عادي

إليك رأس جاهز للإنتاج لتطبيق يستخدم CDN، Google Analytics، وStripe. كل موجّهة مُوضحة:

مع قيمة عشوائية مُشفّرة لكل طلب — مثل

Content-Security-Policy:
  # Tight default: only load from your own origin
  default-src 'self';

  # Scripts: your origin, GA tag manager via nonce, Stripe.js
  script-src 'self' https://www.googletagmanager.com https://js.stripe.com 'nonce-{SERVER_NONCE}';

  # Styles: your origin and Google Fonts CSS
  style-src 'self' https://fonts.googleapis.com;

  # Fonts: your origin and Google Fonts CDN
  font-src 'self' https://fonts.gstatic.com;

  # Images: your origin, CDN subdomain, and base64 data URIs
  img-src 'self' https://cdn.yourdomain.com data:;

  # Fetch/XHR: your API, GA collection endpoint, Stripe API
  connect-src 'self' https://www.google-analytics.com https://api.stripe.com;

  # Stripe renders its fields in an iframe
  frame-src https://js.stripe.com;

  # Nobody should be framing your app
  frame-ancestors 'none';

  # Block <object> and <embed> entirely
  object-src 'none';

  # Force HTTP requests to upgrade to HTTPS
  upgrade-insecure-requests;

كيفية تكوين CORS في Express، FastAPI، و Nginx {SERVER_NONCE} في PHP أو base64_encode(random_bytes(16)) في Node. crypto.randomBytes(16).toString('base64') أخطاء شائعة في سياسة محتوى (CSP)

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

تسمح لأي مصدر بتحميل الأكواد. قد تُعتبر هذه السياسة كأنها لا توجد أصلًا. script-src * نسي أن تشمل الفروع الفرعية.

تغطي فقط المُصدر الدقيق. 'self' هي مصدر مختلف ويحتاج إلى تضمينه بشكل صريح تحت https://api.yourdomain.com إهمال connect-src.

الحماية من التسجيل المُباشر مستقلة عن حماية من هجمات XSS. أضفها بشكل منفصل عن مجموعة الموجّهات الأخرى. frame-ancestors. إضافة سياسة محتوى (CSP) في أماكن متعددة.

إذا كان CDN وتطبيقك يضعان رأس سياسة محتوى (CSP)، فإن السلوك يصبح غير متوقع. اجعله في طبقة واحدة — عادةً في خادم الأصل أو مُحَوّل العودة. بدون معالج.

مطلوبة، يتم رفض الرمز من قبل المتصفح. يجب تحديد الموقع بدقة: report-uri تُنتج طلبات POST إلى نقطة الوجهة في كل تحميل صفحة متأثرة. إما أن تتعامل معها أو أن توجهها إلى خدمة مثل Report URI. بناء رأسك بدون تجربة مُضاعفة

تُصبح عملية تتبع كل المواقع التي تُحمّل منها الموارد عبر الأكواد، الأسلوب، الأحرف، الصور، وطلبات الواجهات مُرهقة بسرعة. يُمكنك استخدام مُولد رأس سياسة محتوى (CSP) عبر الإنترنت

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

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

إذا كان مُحدد الحماية (CSP) مُفرطًا فهو مجرد تزيين، وإذا كان مُفرطًا جدًا فإنه يُعطل المستخدمين. ابدأ بوضع التحقق فقط (report-only)، ثم قم بتعزيزه من هناك، واستخدم الرموز (nonces) عند الحاجة لاستخدام سكربتات داخلية. يجب أن يجعل سياسة الحماية مهمة المهاجمين أكثر، وليس مهمةك.