الدليل الشامل لأمان الويب: CORS وCSP وHSTS

1. CORS (Cross-Origin Resource Sharing): تأمين واجهات برمجة التطبيقات (APIs) الخاصة بك

لفهم CORS، يجب عليك أولًا فهم سياسة المصدر الواحد (Same-Origin Policy – SOP). بشكل افتراضي، تمنع متصفحات الويب صفحات الويب من إرسال طلبات إلى نطاق (مصدر) مختلف عن ذلك الذي قدّم الصفحة. على سبيل المثال، لا يمكن لنص برمجي على https://myblog.com جلب بيانات خاصة بشكل عشوائي من https://api.mybank.com. هذه آلية دفاع أساسية مدمجة وحاسمة.

لكن التطبيقات العالمية الحديثة لا مركزية بشكل كبير. فقد تكون واجهتك الأمامية مستضافة على Vercel، وواجهة برمجة التطبيقات الخاصة بك على AWS، وصورك على Cloudflare. CORS هو البروتوكول الذي يتيح لك تجاوز SOP بأمان. فهو يستخدم رؤوس HTTP متخصصة لإخبار المتصفح: “لا بأس بأن يصل هذا النطاق الخارجي المحدد إلى مواردي.”

• طلب الفحص المسبق (Preflight Request): بالنسبة للطلبات المعقّدة (مثل إرسال بيانات JSON عبر POST أو PUT)، يرسل المتصفح أولًا طلب OPTIONS غير مرئي (طلب “الفحص المسبق”) لسؤال الخادم عمّا إذا كان الطلب الفعلي مسموحًا به. إذا وافق الخادم، يُرسَل الطلب الحقيقي.
• الخطأ القاتل: يشعر العديد من المطورين بالإحباط من أخطاء CORS ويقومون ببساطة بضبط Access-Control-Allow-Origin: * (الرمز العام). هذه ثغرة أمنية كارثية، لأنها تسمح حرفيًا لأي موقع على الإنترنت باستعلام واجهة برمجة التطبيقات الخاصة بك. حدّد دائمًا مصادر دقيقة وموثوقة.

2. CSP (Content Security Policy): الدرع النهائي ضد XSS

البرمجة النصية عبر المواقع (Cross-Site Scripting – XSS) هي واحدة من أكثر الثغرات الأمنية شيوعًا وخطورة على الويب. تحدث عندما يتمكّن قرصان من حقن JavaScript ضار في موقعك (على سبيل المثال، من خلال قسم تعليقات ضعيف). عندما يزور مستخدم الصفحة، يُنفَّذ النص الضار، فيسرق ملفات تعريف ارتباط جلسته أو يُعيد توجيهه إلى موقع تصيّد احتيالي.

يعمل CSP كحارس صارم للغاية لصفحة الويب الخاصة بك. إنه رأس HTTP يتيح لمديري المواقع الإعلان عن “قائمة بيضاء” معتمدة من الموارد الديناميكية المسموح بتحميلها. إذا حاول نص برمجي التنفيذ، لكن مصدره ليس في القائمة البيضاء، فإن المتصفح يحظره ببساطة.

3. HSTS (HTTP Strict Transport Security): فرض المسار الآمن

لقد قمت بتثبيت شهادة SSL/TLS، وموقعك يُحمَّل عبر HTTPS. أنت آمن، أليس كذلك؟ ليس تمامًا. عندما يكتب المستخدم yourdomain.com يدويًا في متصفحه، غالبًا ما يعتمد الطلب الأولي افتراضيًا على بروتوكول http:// غير المشفّر. في ذلك الجزء من الثانية قبل أن يُعيد خادمك توجيهه إلى https://، يمكن لقرصان متصل بنفس شبكة Wi-Fi العامة تنفيذ هجوم الوسيط (Man-In-The-Middle – MITM) لتجريد SSL، واعتراض حركة المرور.

يزيل HSTS هذه النافذة من الثغرات تمامًا. عندما يرسل الخادم رأس HSTS، فإنه يصدر أمرًا صارمًا للمتصفح: “لمدة X من الوقت القادم، لا تحاول أبدًا تحميل هذا الموقع عبر HTTP. اجبر HTTPS داخليًا قبل أن يغادر الطلب الجهاز حتى.” علاوة على ذلك، يمكنك إرسال نطاقك إلى قائمة HSTS المُحمَّلة مسبقًا (HSTS Preload List) العالمية، المُدمجة برمجيًا في Chrome وFirefox وSafari، مما يضمن اتصال المستخدمين بأمان حتى في زيارتهم الأولى.

4. التطبيق: مقاطع تهيئة الخادم

يتطلب تطبيق هذه السياسات تعديل تهيئة خادمك. إليك مقطعًا جاهزًا للإنتاج لـNginx يُعِدّ CORS صارمًا، وCSP قويًا، وHSTS بأقصى درجات الأمان.

server {
    listen 443 ssl http2;
    server_name www.yourglobaldomain.com;

    # 1. تهيئة HSTS
    # فرض HTTPS لمدة سنة واحدة (31536000 ثانية)، وتضمين النطاقات الفرعية، والسماح بالتحميل المسبق
    add_header Strict-Transport-Security "max-age=31536000; includeSubDomains; preload" always;

    # 2. تهيئة CSP (Content Security Policy)
    # السماح فقط بالنصوص البرمجية من نطاقك وGoogle Analytics. منع النصوص البرمجية المضمّنة.
    add_header Content-Security-Policy "default-src 'self'; script-src 'self' https://www.google-analytics.com; img-src 'self' data: https:; style-src 'self' 'unsafe-inline';" always;

    # 3. تهيئة CORS (لكتلة API)
    location /api/ {
        # لا تستخدم أبدًا '*' في بيئة الإنتاج. حدّد نطاقات الواجهة الأمامية الموثوقة بدقة.
        add_header 'Access-Control-Allow-Origin' 'https://www.yourfrontend.com' always;
        add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS, PUT, DELETE' always;
        add_header 'Access-Control-Allow-Headers' 'Authorization, Content-Type' always;

        # التعامل مع طلبات الفحص المسبق
        if ($request_method = 'OPTIONS') {
            add_header 'Access-Control-Allow-Origin' 'https://www.yourfrontend.com';
            add_header 'Access-Control-Max-Age' 1728000;
            add_header 'Content-Type' 'text/plain; charset=utf-8';
            add_header 'Content-Length' 0;
            return 204;
        }
    }
}

الخاتمة: الأمان هو SEO

في نظام الويب البيئي الحديث، يرتبط الأمان وSEO ارتباطًا وثيقًا. تستخدم Google صراحةً HTTPS كإشارة ترتيب، وخوارزمياتها حسّاسة للغاية لمقاييس أمان المستخدم. من خلال تطبيق CORS وCSP وHSTS بشكل صحيح، فأنت لا تحمي بيانات مستخدميك فحسب — بل تبني أصلًا رقميًا مرنًا وموثوقًا به بشدة ستوصي به محركات البحث بثقة للجمهور العالمي. دقّق رؤوس HTTP الخاصة بك اليوم وأغلق الأبواب أمام الجهات الخبيثة.

الوسوم: #WebSecurity #CORS #ContentSecurityPolicy #HSTS #CyberSecurity #GlobalSEO #HTTPS #TechStandards