أمان الويب / المتوسط: دفاعات المتصفح وتفسير البيانات / الدرس 7
ترميز المخرجات ومنع XSS
أبقِ غير الموثوق بيانات في كل سياق عرض وميّز الترميز والتنقية وثقة القالب.
في هذه الصفحة
أهداف الدرس
- حدد حدود تفسير النص والسمة والرابط والنص البرمجي.
- استخدم افتراض الإطار الآمن واستثناءً ضيقاً مراجعاً.
تحدد الوجهة الدفاع المناسب
قد يكون العنوان نص أعمال صحيحاً ويحتاج معاملة مختلفة في نص HTML أو السمة أو URL أو JavaScript. يحفظ منع XSS الفصل بين البيانات وتفسير المتصفح التنفيذي. لا تعوض دالة عامة تحذف الحروف غير المعتادة واجهات آمنة للسياق. فضل قالباً يهَرّب تلقائياً ومصرف DOM نصياً، وراجع كل خام مقصود. لا تترجم نص المستخدم قالباً، ولا تفترض سلامته لمجيئه من قاعدة أو موظف مصادق؛ فقد تبقى البيانات المخزنة غير موثوقة عند حد جديد.
رمّز النص العادي لسياق معلن
يهرب المثال الكامل عنواناً سليماً لنص HTML والسمة المقتبسة وفق مساعد Python الموثق. يوضح تحول الترقيم لتمثيل مرمز دون حمولة هجوم أو عرض صفحة. ليس مرمز JavaScript أو CSS أو URL ولا منقياً لـ HTML الغني. احفظ قيمة المجال بعقدها، ثم طبق المعالجة عند الوجهة. قد يسبب تكرار الترميز خطأ العرض، وقد يعيد فك النص غير الموثوق عميانياً فتح الحد. تتبع مكان كل تحويل بدلاً من إصلاح المظهر بتجاوز الهروب.
from html import escape
label = 'Workshop "A" & notes'
encoded = escape(label, quote=True)
assert encoded == "Workshop "A" & notes"
assert label == 'Workshop "A" & notes'يعمل دون اتصال بمكتبة قياسية ونص مخترع ويحفظ القيمة الأصلية. تثبت التأكيدات هذا التمثيل فقط، لا سلامة تنفيذ المتصفح لكل سياق أو التطبيق كاملاً.
اختر مصرف نص عندما تتطلب الميزة نصاً
ينشئ جزء المتصفح فقرة ويعين textContent، بدلاً من تفسير سلسلة كـ HTML. يحصل المحيط على حاوية موثوقة ويقرر حق المستخدم في قراءة القيمة؛ فهذا حد محتوى لا تفويض. يوفر الاستيفاء عادة معالجة نصية مكافئة، بينما تحتاج التوجيهات الخام والعارضات الخارجية مراجعة. قد يغير المصرف التنسيق والوصول، فاختبر المحتوى الشرعي والمهمة. افصل المحتوى والقالب التنفيذي ولو بدت المعاينة الغنية أسهل. الجزء توضيحي ولا ينفذ ضد صفحة.
const title = 'Workshop "A" & notes'
const paragraph = document.createElement("p")
paragraph.textContent = title
container.replaceChildren(paragraph)يتطلب حاوية يملكها التطبيق وDOM متصفح فعلياً. يضع نصاً لا صياغة HTML، ولم ينفذ اختبار متصفح. لا يستخدم المثال طلب شبكة ومحتواه مخترع سليم فقط.
امنح الغني عقد تنقية مصاناً
إذا احتاج المنتج HTML غنياً فعلاً، فحدد العناصر والسمات والروابط وسلوك الموارد المسموح بها بمنقٍّ معتمد مصان. راجع الإصدار والإعداد، ولا تعدل الناتج بعمليات نصية غير آمنة بعد تنقيته. للناتج استخدام مقصود، لا كل سياق. تحمل الروابط والتنسيق والتضمين وقدرات المتصفح مخاطرها، ولا تحلل HTML بتعبيرات منتظمة منزلية. تكمل CSP الدفاع ولا تعوض المصرف والمعالجة السياقية. اختبر التنسيق العادي المدعوم والرفض معاً حتى لا يصبح الحظر كسراً للميزة.
راجع تدفق البيانات عبر العرض الفعلي
تتبع القيمة من المصدر والتخزين إلى القالب وتحويل العميل والمصرف النهائي. اختبر الترقيم السليم والنص الدولي المدعوم في بيئة مكوّن أو متصفح مفوضة. راجع الخام وحالة الاستيعاب والأدوات الخارجية وصفحات الخطأ، لا النموذج الرئيسي وحده. لا ترسل حمولة لهدف حقيقي للتدريب. سجل السياق وإصدار أداة التنقية؛ فنجاح الهروب محلياً لا يثبت غياب مصرف غير آمن بمسار آخر. أبقِ منع XSS وإذن الخادم وCSRF والأسرار ضوابط مكملة لا بدائل.
الأخطاء الشائعة وإصلاحها
يستخدم مرمز HTML داخل JavaScript
- لماذا يحدث؟
- عوملت سياقات التفسير كمتماثلة.
- كيف تصلحه؟
- استخدم واجهة آمنة للوجهة الفعلية.
- كيف تتجنب تكراره؟
- احصر المصارف عند المراجعة.
يفعل الخام لإصلاح الترقيم
- لماذا يحدث؟
- تجاوز الحد لإصلاح المظهر.
- كيف تصلحه؟
- صحح الترميز دون تفسير النص HTML.
- كيف تتجنب تكراره؟
- اختبر الترقيم وتكرار الترميز.
تسمى CSP الدفاع الوحيد
- لماذا يحدث؟
- حلت سياسة المتصفح محل سلامة المصدر والمصرف.
- كيف تصلحه؟
- أعد العرض الآمن واجعل CSP طبقة إضافية.
- كيف تتجنب تكراره؟
- راجع السياسة وتدفق البيانات معاً.
اختبر فهمك
1. يحوي عنوان بالقاعدة علامة &. هل يعرض خاماً؟
اعرض الحل المشروح
لا؛ العنوان نص عادي يستخدم هروب القالب أو مصرف نص آمناً. حقق في الترميز المزدوج منفصلاً. لا يحول تخزين القيمة في قاعدة بيانات مضمونها إلى ترميز تنفيذي موثوق، ولا يبرر وجود علامة ترقيم تجاوز الحد الآمن للنص.
2. ضُبط منقٍّ للغني. ما الذي يتحقق؟
اعرض الحل المشروح
تحقق من الإصدار المدعوم وسياسة السماح وسياق الناتج وما يحدث بعد التنقية وسلوك الروابط وتكامل العرض الفعلي. اختبر التنسيق الشرعي والحدود، ولا تنسب للمنقّي حل التفويض أو جميع مخاطر المتصفح؛ يظل لكل منها عقد ودليل مستقلان.
أهم ما تعلمته
- يحدد السياق الآلية الآمنة.
- للنص وHTML الغني عقدان مختلفان.
- تكمل المصارف والتنقية المصانة سياسة المتصفح.