تغییر مشخصات HTML: فرار < و > در صفات

میشال بنتکوفسکی
Michał Bentkowski

تاریخ انتشار: 12 ژوئن 2025

در 20 می 2025، مشخصات HTML برای فرار از < و > در ویژگی ها به روز شد و به جلوگیری از آسیب پذیری های جهش XSS (mXSS) کمک کرد. این تغییر در Chrome 138 ایجاد شد که در 28 مه 2025 به نسخه بتا ارتقا یافت و در 24 ژوئن 2025 به پایداری تبدیل خواهد شد.

این پست تأثیر ویژگی HTML فرار از تغییر را بر توسعه‌دهندگان وب و شکست‌های احتمالی شرح می‌دهد. منطق امنیتی پشت این تغییر در پست مرتبط ما در وبلاگ مهندسی امنیت توضیح داده شده است.

چه چیزی تغییر کرد

فرض کنید یک عنصر <div> دارید که ویژگی data-content آن مقدار "<u>hello</u>" دارد. وقتی div.outerHTML را می خوانید چه اتفاقی می افتد؟

از لحاظ تاریخی، شما HTML زیر را دریافت می کنید:

<div data-content="<u>hello</u>"></div>

پس از تغییر، HTML زیر را دریافت خواهید کرد:

<div data-content="&lt;u&gt;hello&lt;/u&gt;"></div>

قبلاً، نه < و نه > در صفت ها فرار نمی کردند. حالا هر دوی این شخصیت ها همیشه فراری هستند.

چیزی که تغییر نکرد

این تغییر به طور انحصاری نحوه تبدیل قطعات HTML را به یک نمایش رشته در طول سریال‌سازی تغییر می‌دهد. تأثیر به سناریوهایی محدود می شود که در آن به خصوصیات innerHTML یا outerHTML دسترسی پیدا می شود، یا زمانی که متد getHTML() روی یک عنصر فراخوانی می شود. این عملیات ساختار DOM موجود را می گیرد و یک نمایش متنی HTML تولید می کند.

این تغییر بر تجزیه HTML تاثیری ندارد . HTML زیر را در نظر بگیرید:

<div id="div1" data-content="<u>hello</u>"></div>
<div id="div2" data-content="&lt;u&gt;hello&lt;/u&gt;"></div>

هر دو div دقیقاً به یک شکل تجزیه می‌شوند و در هر دو مورد div.dataset.content "<u>hello</u>" را برمی‌گرداند.

چه چیزی نمی شکند؟

اگر از هر API DOM مانند getAttribute ، getAttributeNS ، dataset یا attributes برای بازیابی مقادیر مشخصه استفاده می‌کنید، آن‌ها همان مقادیر رمزگشایی‌شده قبلی را به‌خصوص با < و > decoded برمی‌گردانند.

مثال زیر را در نظر بگیرید، که در آن تمام خطوط console.log "<u>" را ثبت می کنند:

<div data-content="&lt;u&gt;"></div>
const div = document.querySelector("div");
// All of the following will log "<u>"
console.log(div.getAttribute("data-content"));
console.log(div.dataset.content);
console.log(div.attributes['data-content'].value);

چه چیزی می تواند بشکند؟

innerHTML و outerHTML برای دریافت ویژگی ها

اگر از innerHTML یا outerHTML برای استخراج مقدار یک ویژگی استفاده کنید، کد شما ممکن است شکسته شود. به مثال زیر، هرچند کمی پیچیده، توجه کنید:

<div data-content="<u>"></div>
const div = document.querySelector("div");
const content = div.outerHTML.match(/"([^"]+)"/)[1];
console.log(content);

این کد پس از این تغییر رفتار متفاوتی از خود نشان خواهد داد. قبلاً content برابر "<u>" بود اما اکنون "&lt;u&gt;" است. .

توجه داشته باشید که تجزیه HTML با عبارات منظم توصیه نمی شود . اگر نیاز به دریافت مقدار یک ویژگی دارید، از API های DOM که در بخش های قبلی توضیح داده شد استفاده کنید.

تست های پایان به انتها

اگر خط لوله CI/CD دارید که در آن از Chromium برای تولید HTML استفاده می‌کنید، و آزمایش‌هایی برای مقایسه HTML با مقدار مورد انتظار ثابت نوشته‌اید، اگر هر ویژگی حاوی < یا > باشد، این آزمایش‌ها ممکن است شکسته شوند.

این یک شکست مورد انتظار است—شما باید مقدار مورد انتظار را به روز کنید تا همه کاراکترهای < و > به &lt; و &gt;, به ترتیب.

خلاصه

این پست وبلاگ تغییری را در مشخصات HTML توضیح می‌دهد که باعث می‌شود مرورگرها شروع به فرار از < و > در ویژگی‌ها کنند تا با جلوگیری از برخی موارد جهش XSS، امنیت را بهبود بخشد.

این تغییر در تاریخ 24 ژوئن 2025 در Chromium (نسخه 138) و Firefox (نسخه 140) برای همه کاربران در دسترس خواهد بود. همچنین در Safari 26 Beta که باید در سپتامبر 2025 منتشر شود، گنجانده شده است.

اگر فکر می‌کنید که این تغییر وب‌سایت شما را خراب کرده است و راه آسانی برای رفع آن ندارید، لطفاً یک اشکال را در https://issues.chromium.org/ ثبت کنید.

اطلاعات تکمیلی