Svelte / الأساسي: المكونات التفاعلية والملكية / الدرس 1
المترجم والمكونات وحدود SvelteKit
افصل ترجمة مكون Svelte عن توجيه SvelteKit وتنفيذ الخادم وسياسة المجال.
في هذه الصفحة
أهداف الدرس
- اشرح أدوار ملفات .svelte والمترجم وإطار التطبيق.
- ميز دليل JavaScript المحلي من سلوك المكون والخادم الذي لم ينفذ.
مترجم المكونات ليس التطبيق كله
يترجم Svelte مصدر المكون إلى سلوك للهدف المختار. تجمع .svelte الشيفرة والبنية والتنسيق المحدود، وتضيف SvelteKit التوجيه والتحميل ومداخل الخادم والنشر. لا توفر الطبقتان تفويض الكائن أو التخزين الدائم تلقائياً. تعرض البوابة بطاقة عامة وتحصل على بيانات مؤهلة عبر حد خادم Kit. سم التمثيل والمصدر والمستدعي قبل الحالة؛ لا يثبت اسم مجلد أو ترجمة ناجحة بيانات المستأجر الصحيح. يضع هذا الفصل مسؤولية كل ضمان عند الخدمة أو النقل أو المكون الذي يستطيع فرضه، بدلاً من نسب كل سلوك آمن إلى الإطار بمجرد استعماله.
اقرأ مكوناً صغيراً بنمط runes
يستقبل الجزء خاصية course بـ$props ويعرض حقلين عامين. runes صياغة يعرفها المترجم لا دوال عادية يثبتها مساعد بالاسم نفسه. يجب أن تحقق البيانات سياسة المصدر والجمهور مسبقاً. يختار المقرر Svelte 5 runes وKit 3 للتطبيق ولا يفرض إعادة كل قديم دفعة واحدة. لم يشغل مكون أو مترجم أو متصفح، فالنتيجة قراءة مستنتجة للعقد. ينبغي ألا يفسر المتعلم نجاح دالة إسقاط منفصلة لاحقاً كأنه تحقق من تحويل هذا الملف أو من معنى استدعاء Rune في سياق لا يقبله المترجم.
<script>
let { course } = $props();
</script>
<article>
<h2>{course.title}</h2>
<p>{course.summary}</p>
</article>يقدم الأب نموذج مقرر معتمداً، ولم يترجم الجزء أو يثبت طلباً أو صلاحية.
حدد موضع التنفيذ قبل استعمال API
قد تشارك الشيفرة في عرض الخادم وإماهة المتصفح؛ لا تتاح واجهة متصفح لأن البنية تفاعلية. تختلف الوحدة الخادمية وload العامة والخادمية في التنفيذ والتسلسل. أبعد الاعتماد وعميل المصدر الخاص عن استيراد المتصفح. يشتق التصيير الإخراج ولا يكتب دائماً لأنه قد يحدث بالتحضير أو التنقل المتكرر. استخدم فعلاً أو مدخلاً صريحاً بسلطة وتحقيق وقواعد إعادة ومعاملة. لا يجعل كون الصفحة تعرض نموذجاً محمياً ذلك المدخل محمياً تلقائياً، إذ يمكن أن يستدعيه طرف دون المرور بواجهة الصفحة.
اختبر شكلاً عاماً واحداً دون مترجم
تعيد الدالة بطاقة جديدة وتحذف ملاحظة داخلية، وتعمل تأكيداتها بـJavaScript دون Svelte. تثبت مفاتيح المساعد فقط لا الهوية أو الأهلية أو الهروب أو التسلسل. قد يسرب مصدر خادمي الخاص إذا أعاده المساعد للصفحة. لا تسلسل كيان التخزين كله لأن المكون يستطيع قراءة خصائصه. يظهر الإسقاط الجمهور قبل الدمج. ينبغي أن يظل ترتيب الأهلية ثم الإسقاط واضحاً؛ فدالة تستبعد note لا تمنح المستدعي حق معرفة وجود مقرر محجوب أو عنوانه، وتحتاج هذه الحقيقة قرار مجال مستقلًا.
function card(record) {return {id:record.id,title:record.title,summary:record.summary};}
const value=card({id:"c1",title:"Svelte foundations",summary:"Public lab card",internalNote:"private-lab"});
console.assert(value.id==="c1" && value.summary==="Public lab card");
console.assert(!Object.hasOwn(value,"internalNote"));تعاد الحقول المختارة وتغيب الملاحظة دون عرض Svelte أو قرار تفويض.
وضح افتراض الإصدار والدليل
روجع توثيق Svelte 5 وKit 3 الرسمي في 2026-10-28؛ ليست المفاهيم ادعاء أحدث تصحيح أو كل ميزة اختيارية. وافق Svelte وKit وVite والموائم وTypeScript والمشغل، وافحص إضافات الفروع الدقيقة. تبقى الأجزاء runnable:false ولا تحاكي النماذج جدولة المترجم أو البنية. لا يثبت المقرر حزمة أو يبدأ خادماً أو يتصل بمصدر مضبوط أو قاعدة أو طابور أو استضافة. يذكر التحقق اللاحق ما نفذ. يحفظ هذا القيد معنى كل تأكيد محلي حتى لا تتحول مادته إلى تقرير بناء أو نشر لم يحدث.
الأخطاء الشائعة وإصلاحها
تعامل rune كدالة JavaScript مستوردة عادية
- لماذا يحدث؟
- اختلطت صياغة يتعرف عليها المترجم بواجهة وقت تشغيل عادية.
- كيف تصلحه؟
- استخدم runes في سياقات الترجمة الموثقة لها فقط.
- كيف تتجنب تكراره؟
- افصل اختبار الدالة العادية عن فحص المترجم الحقيقي.
يستخدم مكون تفاعلي window أثناء تقييم الخادم
- لماذا يحدث؟
- افترض أن وجود التفاعل يجعل كل الشيفرة خاصة بالمتصفح.
- كيف تصلحه؟
- انقل دمج المتصفح إلى دورة حياة أو حد مناسب.
- كيف تتجنب تكراره؟
- اختبر عرض الخادم وسلوك المتصفح مستقلين.
تستقبل صفحة عامة حقول تخزين خاصة
- لماذا يحدث؟
- أعيد كيان المصدر كله دون اختيار ما يناسب الجمهور.
- كيف تصلحه؟
- فوض الكائن وأعد نموذجاً عاماً صريحاً.
- كيف تتجنب تكراره؟
- أكد مفاتيح الإخراج وسلوك الكائن الممنوع.
اختبر فهمك
1. هل تثبت دالة card أن مكون Svelte المعروض آمن؟
اعرض الحل المشروح
لا. تثبت حقول دالة عادية لسجل اصطناعي، ولا تتحقق من المصادقة أو أهلية الكائن أو المترجم أو الهروب أو حدود الخادم والعميل. احتفظ بالدليل المحدود، ثم تحقق من مسار التطبيق الفعلي بهويات آمنة داخل مشروع معزول مأذون.
2. لماذا يجب ألا تقع الكتابات غير القابلة للتراجع أثناء التصيير؟
اعرض الحل المشروح
قد يحدث العرض وقت البناء والتحضير ويتكرر بالتنقل أو التعافي دون قصد كتابة جديد مؤكد، فيكرر الأثر دون توقع. استخدم فعلاً أو مدخلاً صريحاً موثقاً بإدخال متحقق وقواعد إعادة، واجعل التصيير لإنتاج التمثيل المسموح.
أهم ما تعلمته
- يملك Svelte وSvelteKit طبقتين مختلفتين من الإطار.
- تحتاج ادعاءات المترجم والخادم دليلاً يتجاوز الإسقاط المحلي.