انتقل إلى محتوى الدرس

Safe CDN Setup with SRI التضمين الآمن عبر CDN

تعلّم طرق تثبيت Bootstrap 5.3 عبر CDN المحمي ببصمة SRI أو الملفات المحلية أو npm، وابنِ قالب البداية القياسي بلغة HTML5 مع فحصه في أدوات المطور.
3 صفوف تعليمية
بوتستراب 5
0 مشاهدة

شرح صفوف ومحتوى الفقرة

الصف 1 شرح توضيحي

عند ربط ملفات خارجية من شبكة CDN عامة، لا تكتفِ بكتابة عنوان الرابط وحده أبداً؛ بل احرص دائماً على إرفاق السمتين الأمنيتين المعتمدتين في التوثيق الرسمي على وسمي <link> و <script> وهما سمة integrity المحتوية على بصمة التجزئة SHA-384 وسمة crossorigin="anonymous".

تفعّل هاتان السمتان آلية سلامة الموارد الفرعية SRI؛ حيث يحسب المتصفح البصمة الرقمية للملف فور تنزيله ويقارنها بالقيمة المتوقعة، فإن تغيّر بايت واحد نتيجة اختراق الخادم الخارجي أو التلاعب بالشبكة أوقف المتصفح تنفيذ الملف فوراً لحماية مستخدميك.

الصف 2 كود برمجي
HTML
<div class="container">
  <h2>SRI Security Verification</h2>
  <p>Pair CDN links with integrity + crossorigin.</p>
  <p id="sriNote"></p>
</div>
<script>
  document.getElementById('sriNote').textContent =
    'Format: sha384-<base64-hash> + anonymous CORS';
</script>
الصف 3 ملاحظة هامة