تابع esc_attr در وردپرس

در توسعه قالب‌ها و پلاگین‌های وردپرس، محافظت از خروجی HTML در برابر حملات XSS و سایر مشکلات امنیتی اهمیت بالایی دارد. یکی از توابع کلیدی برای پاک‌سازی مقادیر هنگام قرار دادن آن‌ها در ویژگی‌های (attributes) عناصر HTML، تابع esc_attr() است. در این مقاله به صورت کاربردی و کامل با esc_attr()، تفاوت‌های آن با توابع دیگر و نمونه‌های عملی آشنا می‌شویم.

esc_attr() چیست؟

تابع esc_attr() مقدار ورودی را برای قرار گرفتن داخل یک attribute HTML پاک‌سازی (escape) می‌کند. این عملیات شامل تبدیل کاراکترهای حساس مثل ، “، ‘ و & به معادل‌های امن HTML است تا مرورگر آن‌ها را به عنوان متن تفسیر کند و امکان تزریق اسکریپت یا کدهای مخرب را کاهش دهد.

زمان و محل استفاده

هر زمان که می‌خواهید مقداری را داخل یک ویژگی HTML مانند value، title، alt، placeholder، data-* و غیره قرار دهید باید از esc_attr() استفاده کنید.
قواعد کلی وردپرس: همیشه خروجی را هنگام نمایش پاک‌سازی کنید، نه هنگام ذخیره‌سازی. یعنی sanitize_* هنگام ذخیره و esc_* هنگام نمایش.
برای URLها از esc_url() و برای متن داخل تگ‌ها از esc_html() استفاده کنید. هر کدام برای کانتکست مختلف بهینه‌سازی شده‌اند.

نمونه‌های عملی

<input type="text" name="username" value="<?php echo esc_attr( $username ); ?>" />

در این مثال مقدار متغیر $username قبل از قرار گرفتن در attribute value با esc_attr() پاک‌سازی می‌شود. اگر کاربر رشته‌ای حاوی ” یا < وارد کرده باشد، به شکل امن نمایش داده خواهد شد.

<img src="<?php echo esc_url( $image_url ); ?>" alt="<?php echo esc_attr( $alt_text ); ?>" />

توضیح: آدرس تصویر با esc_url() و متن جایگزین تصویر با esc_attr() پاک می‌شود. URL ها نیاز به قواعد متفاوتی دارند بنابراین از esc_url() استفاده می‌کنیم.

<option value="<?php echo esc_attr( $term_slug ); ?>" <?php selected( $current, $term_slug ); ?>>
    <?php echo esc_html( $term_name ); ?>
</option>

در selectها مقدار value با esc_attr() و متن داخلی option با esc_html() نمایش داده می‌شود. تابع selected() خودش خروجی را کنترل می‌کند ولی اگر متن خارجی درج شود باید پاک‌سازی شود.

مثال پیشرفته: داده‌های JSON در data-attributes

$data = array( 'id' => 12, 'name' => 'Ali & Co' );
<div data-info="<?php echo esc_attr( wp_json_encode( $data ) ); ?>">...</div>

این روش برای منتقل کردن آبجکت‌ها به JavaScript کاربردی است. ابتدا آرایه را با wp_json_encode() به رشته JSON تبدیل می‌کنیم و سپس با esc_attr() آن را برای قرار گرفتن در attribute امن می‌سازیم.

خطاها و نکات رایج

دورانی کردن (double escaping): از پاک‌سازی دوباره مقدارهایی که قبلاً escape شده‌اند بپرهیزید چرا که باعث تبدیل‌های غیرمنتظره می‌شود.
اشتباه در کانتکست: برای متن بین تگ‌ها esc_html() مناسب‌تر است، برای URLها esc_url() و برای کلاس‌ها sanitize_html_class() یا esc_attr() در صورت نیاز.
پاک‌سازی هنگام ذخیره به جای خروجی: sanitize_* برای ذخیره و esc_* برای نمایش — هر دو مهمند اما کاربرد متفاوت دارند.

مقایسه توابع مرتبط

تابع	کاربرد
esc_attr()	پاک‌سازی مقادیر برای قرارگیری داخل attribute
esc_html()	پاک‌سازی متن برای نمایش بین تگ‌های HTML
esc_url()	پاک‌سازی و اعتبارسنجی URLها
sanitize_text_field()	پاک‌سازی هنگام ذخیره برای فیلدهای متنی ساده
sanitize_html_class()	پاک‌سازی مقادیر برای استفاده به‌عنوان class یا id

مثال کامل‌تر و بهبود یافته

// Bad (vulnerable to XSS if $name contains quotes)
echo '<input name="user" value="' . $name . '">';

// Better
echo '<input name="user" value="' . esc_attr( $name ) . '">';

// Best: use printf for readability
printf( '<input name="user" value="%s">', esc_attr( $name ) );

در مثال بالا نسخه اول آسیب‌پذیر است. نسخه دوم با esc_attr() امنیت را افزایش می‌دهد. نسخه سوم با printf خوانایی و نگهداری کد را بهتر می‌کند و الگوی خروجی مشخص‌تر است.

نکات پیشرفته و توصیه‌های تخصصی

همیشه فرض کنید هر داده‌ای که از کاربر یا منابع خارجی می‌آید ناامن است؛ قبل از قرار دادن در attribute آن را با esc_attr() محافظت کنید.
برای کلاس‌های CSS که فقط حروف و اعداد دارند از sanitize_html_class() استفاده کنید؛ چون کاراکترهای غیرمجاز را حذف می‌کند و خروجی مناسب‌تری می‌دهد.
در قالب‌هایی که چندین بار یک مقدار را echo می‌کنید، هر بار هنگام خروجی از esc_attr() استفاده کنید. خروجی امن به اندازه عملکرد اهمیت دارد؛ اگر نگرانی سرعت دارید، اغلب این تابع هزینهٔ قابل توجهی ندارد.
برای رشته‌های ترجمه‌شده، ابتدا ترجمه را انجام دهید و سپس escape کنید، به عنوان مثال: esc_attr__( 'Read more', 'textdomain' ) یا esc_attr( __( 'Read more', 'textdomain' ) ).

جمع‌بندی

تابع esc_attr() یکی از ابزارهای پایه‌ای توسعه امن در وردپرس است. استفاده صحیح از آن هنگام خروجی‌دادن مقادیر داخل attributes باعث جلوگیری از XSS و نمایان شدن رفتارهای ناخواسته می‌شود. آشنایی با تفاوت توابع esc_* و sanitize_* و انتخاب صحیح هر کدام مطابق کانتکست، نشانهٔ مهارت توسعه‌دهندهٔ وردپرس است.

آیا این مطلب برای شما مفید بود ؟

خیر

بله