أدوات المطورين · محرر HTML WYSIWYG
من DOM إلى الترميز: كيف يشكل تسلسل HTML الداخلي HTML الذي تحصل عليه
· كيف يعمل
أتش تي أم أل html-entities سير عمل المطور
يشرح القواعد التي تتبعها المتصفحات عند تحويل شجرة DOM مرة أخرى إلى سلسلة HTML، بدءًا من الهروب والكيانات وحتى العناصر الفارغة واقتباس السمات، ولماذا تظهر مخرجات المحرر بالطريقة التي تظهر بها.
لماذا يعود <br> كـ <br /> في هذا المطهر
جزء المصدر الذي يحتوي على `<br>` يترك هذا المطهر كـ `<br />`. هذه النتيجة ليست دليلاً على أن كل متصفح يقوم بإجراء تسلسل HTML بشرطة مائلة. إنه اختيار متعمد في أداة إعادة كتابة السلسلة ToolAcre، والتي يُصدر فرع العنصر الفارغ الخاص بها مسافة وشرطة مائلة للعناصر المسموح بها br وhr.
التمييز يمنع التفسير الخاطئ الشائع. تتم قراءة السطح المرئي من خلال لغة HTML الداخلية، ولكن يتم بعد ذلك ترميز المصدر المنسوخ وإعادة بنائه بواسطة رمز التطبيق. ما يتلقاه المستخدمون يعكس كلاً من سلسلة DOM التي أنشأها المتصفح واصطلاحات الإخراج الأضيق لـ ToolAcre، بما في ذلك الأسماء المستعارة والسمات المصفاة والعلامات المتوازنة.
إدخال الرموز المميزة وإعادة كتابة القائمة المسموح بها - هذا ليس تسلسل HTML داخلي للمتصفح
يقوم برنامج الرمز المميز بمسح الأحرف دون إنشاء عقد DOM أو استدعاء DOMParser. فهو يتعرف على النص والتعليقات والإعلانات وعلامات البداية وعلامات النهاية وأجسام عناصر النص الخام. يكرر التعقيم هذا التسلسل المسطح، مع الحفاظ على الهياكل المسموح بها، وفك الأغلفة العادية غير المعروفة، وقمع الحاويات الخطرة بمحتوياتها.
وبالتالي، لا يتم الحفاظ على التهجئة الأصلية. تصبح الأسماء ذات الحالة المختلطة صغيرة؛ يصبح b قويًا، ويصبح i em، ويصبح Strike وdel s، وins يصبح u. يتم إعادة إنشاء الإخراج من الرموز المميزة المقبولة بدلاً من إرجاعه كسلسلة فرعية أصلية، لذلك يختفي تنسيق المصدر والتفاصيل غير المدعومة حسب التصميم.
الهروب من النص والسمات أثناء تطبيع الكيانات المعروفة
يتم فك تشفير النص أولاً ثم يتم الهروب مرة أخرى. تصبح علامات الضم `&`، وتصبح العلامات الأصغر من والأكبر من `<` و`>`، وتختفي أحرف التحكم المحظورة. يحافظ هذا الطلب على `&` ثابتًا عبر التمريرات المتكررة بدلاً من تحويله إلى `&amp;`.
تتبع قيم السمات مسار هروب أكثر صرامة يقتبس أيضًا علامات الاقتباس المزدوجة وعلامات الاقتباس المفردة والأقواس الزاوية وعلامات الضم. يتم فك تشفير الكيانات المعروفة قبل إصدار السمات المقبولة. تثبت الاختبارات عدم القدرة على استعلامات النص والارتباط، لكن الكود لا يعد بالحفاظ على تهجئة كل كيان مؤلف مثل المرجع المسمى مقابل المرجع الرقمي.
العناصر الفارغة وعلامات الإغلاق المتوازنة في أداة إعادة الكتابة المخصصة
يُسمح فقط بـ br وhr ويتم تصنيفهما على أنهما فارغان في مجموعة الإخراج. لا يتلقون علامات الإغلاق أبدًا. بالنسبة للعناصر المسموح بها غير الفارغة، يتم تسجيل التداخل في المكدس المفتوح. يؤدي الإغلاق المتقاطع مثل قوي حول em إلى إغلاق العناصر الداخلية أولاً، مما يؤدي إلى إنتاج علامات متوازنة بدلاً من الحفاظ على ترتيب تالف.
يتم إغلاق العناصر غير المغلقة في النهاية، بينما يتم تجاهل علامات الإغلاق الضالة. هذه هي سياسة الموازنة الخاصة بأداة إعادة الكتابة، وليست تنفيذًا كاملاً لاسترداد الأخطاء في المتصفح HTML5. يحذر المصدر نفسه من فروق المحلل اللغوي، ولهذا السبب يجب عدم تسويق المخرجات كمطهر عالمي للمدخلات المعادية.
يتم إدراج السمات في القائمة المسموح بها ونقلها؛ أمر المصدر وحده ليس العقد
لا توجد حقيبة سمة عامة على قيد الحياة. الفقرات والعناوين لا تسمح بأي شيء؛ تسمح الروابط بـ href والعنوان؛ الاختصارات تسمح بالعنوان؛ تسمح الاقتباسات بالاستشهاد؛ تسمح القوائم المرتبة بالبدء والكتابة. يتم وضع علامات اقتباس مزدوجة على كل قيمة منبعثة، وتكتسب الروابط المقبولة أيضًا `rel="noopener noreferrer nofollow"`.
يتبع ترتيب السمات الرموز المميزة المقبولة وحقل rel المضاف، لكن الاعتماد على الترتيب سيكون هشًا. المعنى يكمن في الأسماء والقيم المسموح بها. يتم إسقاط بداية عدد صحيح مشوه، ويتم رفض أنظمة href أو الاستشهاد غير الآمنة، وتولد السمات غير المعروفة أسباب الإزالة بدلاً من أن تصبح بصمت جزءًا من العلامات المنشورة.
مثال عملي: تمرير مقتطف ذهابًا وإيابًا عبر معقم ToolAcre
حاول `<B class="loud">A & B<br></B><a href="javascript:alert(1)">open</a>`. تتم إزالة الفئة، ويتم تعيين B إلى قوي، ويظل علامة العطف الموجودة علامة عطف واحدة، ويصبح br مغلقًا ذاتيًا، ويفقد الارتباط غير الآمن الخاص به href مع الاحتفاظ بنص الارتباط المرئي.
يقوم وضع المصدر الجميل بعد ذلك بوضع عناصر الكتلة المدعومة على الأسطر والمسافات البادئة لقائمة الأطفال. فهو يترك المحتوى المضمّن معًا ويحافظ على النص داخل الملف السابق. التنسيق عبارة عن تمريرة سهلة القراءة للمخرجات المعاد كتابتها بالفعل؛ إنه ليس محلل أمان ثانٍ ولا يستعيد المسافة البيضاء التي أزالتها التسوية السابقة.
ما لا يغطيه هذا — المتصفح، XML أو XHTML التسلسل
لا تصف هذه المقالة ضمانات تسلسل المتصفح الأصلي، أو XMLSerializer، أو بناء الجملة XHTML أو قواعد علامة الإغلاق HTML الاختيارية بشكل عام. وهو يوثق الاتفاقيات التي يمكن ملاحظتها في هذا المستودع. تم حذف المطالبات المتعلقة بـ ` ` على وجه التحديد لأن جدول الكيان المحلي، وليس برنامج تسلسل المتصفح العام، يحدد المراجع المسماة التي تم التعرف عليها.
يقوم منشئ المعاينة بتعقيم الجزء مرة أخرى وتغليفه في مستند كامل ذي طابع فاتح. نسخة HTML تُرجع الجزء؛ تنزيل HTML يقوم بإرجاع هذا المستند. تلك هي القطع الأثرية المختلفة عمدا. اقرأ تسمية الإجراء قبل افتراض أن الملف الذي تم تنزيله مطابق للبايت للمصدر المنسوخ.
الخلاصة: المُسلسِل متسق، لكن مدخلاتك لم تكن كذلك — يلخص كيفية التنبؤ بمخرجات المحرر وكيف يُظهر محرر ToolAcre's HTML WYSIWYG ما ينتجه المتصفح بالفعل
توقع ToolAcre باتباع مراحله: إنشاء رمز مميز للسلسلة، وفك تشفير الكيانات المدعومة، وتطبيق الأسماء المستعارة للعناصر والقوائم المسموح بها، وفحص عناوين URL، وموازنة العلامات المقبولة، ومخرجات الهروب، وطباعتها بشكل جميل اختياريًا. يشرح هذا التسلسل النتيجة الفعلية بشكل أكثر دقة من القول بأن لغة HTML الداخلية تحافظ ببساطة على مصدر المؤلف أو تقوم بتسلسله.
استخدم الوضع المصدر لمراقبة إعادة الكتابة باستخدام أداة صغيرة قبل معالجة مسودة طويلة. يرفض المطهر المستندات التي يزيد طولها عن 500,000 من الأحرف، لذلك يفشل الإدخال كبير الحجم بدلاً من تجميد علامة التبويب. احتفظ بسياسة HTML الخاصة بالوجهة منفصلة عن المجموعة الفرعية المضغوطة عمدًا لهذا المحرر.