نوشته های Farzane Kazemi

وقتی rtl: true همه چیز را خراب‌تر کرد! تجربه من از تولید PDF فارسی با pdfmake

Farzane Kazemi — Wed, 01 Jul 2026 09:20:03 +0330

اگر تا به حال خواسته باشید با pdfmake یک فایل PDF فارسی تولید کنید، احتمالاً اولین کاری که انجام می‌دهید این است:rtl: true من هم دقیقاً همین کار را کردم.و مطمئن بودم مشکل حل شده است.اما نتیجه چیزی نبود که انتظارش را داشتم.متن فارسی کاملاً برعکس نمایش داده می‌شد!نه فقط راست‌چین نبود، بلکه ترتیب کلمات هم برعکس شده بود و خروجی عملاً غیرقابل استفاده بود.همان لحظه فهمیدم که قرار نیست این مشکل با یک گزینه ساده حل شود.همه چیز از یک قابلیت ساده شروع شددر حال توسعه قابلیت تولید PDF برای پروژه SaaS خودم بودم؛ یک پلتفرم ساخت سیستم‌های رزرو نوبت برای کسب‌وکارها.همه چیز آماده بود.داده‌ها از دیتابیس خوانده می‌شدند.فونت فارسی هم اضافه شده بود.فقط کافی بود متن‌ها به درستی نمایش داده شوند.به نظر ساده می‌آمد.ولی نبود.اولین اشتباه: اعتماد به rtl: trueوقتی مستندات pdfmake را دیدم و گزینه RTL را پیدا کردم، با خودم گفتم:عالیه! دقیقاً همون چیزیه که لازم دارم.اما خروجی شوکه‌کننده بود.متن فارسی برعکس چاپ می‌شد.نه فونت مشکل داشت.نه داده‌ها.نه Encoding.مشکل از خود نحوه پردازش متن‌های RTL بود.بعد از آن...مثل هر برنامه‌نویس دیگری شروع کردم به جستجو.GitHub Issueها...Stack Overflow...پکیج‌های مختلف...پاسخ‌های قدیمی...راهکارهای عجیب مثل برعکس کردن رشته‌ها قبل از ارسال به pdfmake...حتی چند کتابخانه جایگزین را هم امتحان کردم.بعضی‌ها اصلاً کار نمی‌کردند.بعضی‌ها فقط بخشی از مشکل را حل می‌کردند.بعضی‌ها سال‌ها بود به‌روزرسانی نشده بودند.هر بار فکر می‌کردم «این یکی حتماً جواب می‌دهد» و هر بار دوباره به نقطه اول برمی‌گشتم.صادقانه بگویم، بیشتر زمانم صرف جنگیدن با PDF شد تا توسعه خود محصول.راه‌حلی که تقریباً هیچ‌کس درباره‌اش حرف نمی‌زندبعد از ساعت‌ها جستجو، بالاخره به پکیجی رسیدم که اسمش به طرز عجیبی ساده بود:pdfmake-rtlهمین.بدون ترفند.بدون دستکاری رشته‌ها.بدون برعکس کردن متن.بعد از جایگزین کردن آن، همان داده‌هایی که تا چند دقیقه قبل برعکس چاپ می‌شدند، کاملاً درست نمایش داده شدند.حروف به هم متصل بودند.ترتیب کلمات طبیعی بود.و خروجی دقیقاً همان چیزی بود که انتظار داشتم.لحظه‌ای بود که فقط با خودم گفتم:«کاش زودتر پیدایش کرده بودم!»چیزی که از این تجربه یاد گرفتمگاهی اوقات مستندات رسمی همه جواب را ندارند.گاهی گزینه‌ای که اسمش دقیقاً همان چیزی است که می‌خواهی (rtl)، در عمل مشکل تو را حل نمی‌کند.و گاهی راه‌حل واقعی را نه در صفحه اول گوگل، بلکه وسط یک Issue قدیمی یا یک پکیج کم‌تر شناخته‌شده پیدا می‌کنی.این یکی از همان روزهایی بود که یادم انداخت توسعه نرم‌افزار فقط نوشتن کد نیست؛ بخش بزرگی از آن پیدا کردن راه‌حل مناسب است.اگر شما هم با این مشکل روبه‌رو شدید...اگر از pdfmake استفاده می‌کنید و متن فارسی یا عربی در خروجی PDF برعکس نمایش داده می‌شود، قبل از اینکه ساعت‌ها وقتتان را صرف دستکاری رشته‌ها یا نوشتن راه‌حل‌های موقت کنید، نگاهی به pdfmake-rtl بیندازید.ممکن است همان راه‌حلی باشد که من بعد از ساعت‌ها جستجو در اینترنت پیدایش کردم.اگر این مقاله باعث شود حتی یک توسعه‌دهنده کمتر آن مسیر خسته‌کننده را تکرار کند، ارزش نوشتنش را داشته است.

🛡 امنیت وب برای توسعه دهندگان فرانت اند: راهنمای ساده و کاربردی

Farzane Kazemi — Sat, 26 Jul 2025 20:58:50 +0330

🎯 چرا امنیت وب برای توسعه دهندگان فرانت اند مهم است؟یک سایت رو مثل یه خونه تصور کن:🏠 بک اند = اتاق ها و وسایل باارزش داخل خونه.🚪 فرانت اند = درها و پنجره ها.👉 اگر درها و پنجره ها (فرم ها، فیلدهای ورودی و دکمه ها) ضعیف باشند، هر کسی میتونه وارد خونه بشه.🚨 قانون طلایی امنیت وب❗ به مرورگر اعتماد نکن!هر چیزی که از سمت کاربر میاد — فرم ها، آدرس URL، کوکی ها، فایل های آپلودی — میتونه آلوده باشه.✅ همیشه داده ها رو اعتبارسنجی (Validate) و پاکسازی (Sanitize) کن قبل از اینکه به سرور بفرستی یا روی صفحه نمایش بدهی.🕵️♂️ مهم ترین تهدیدهای امنیتی که باید بشناسی: به زبان ساده این ها ترفندهای معروف هکرها هستند.1. XSS (Cross-Site Scripting) 🕷چی هست؟ هکرها کدهای مخرب (معمولاً جاوااسکریپت) را وارد سایتت میکنند.چرا خطرناک است؟ این کد در مرورگر کاربران به اسم سایت تو اجرا میشود — کوکی میدزدد، لاگین میکند یا حتی کاربران را به سایتهای فیشینگ میفرستد.یک سناریوی ساده:[ هکر کامنت میگذارد: کد مخرب ] ↓ [ کاربر صفحه را باز میکند → مرورگر اسکریپت را اجرا میکند ] ↓ [ اطلاعات کاربر به دست هکر میافتد ] ✅ راهکار برای فرانت اند:ورودی کاربر را به صورت HTML خام رندر نکن.از فریمورک ها (React، Vue، Angular) استفاده کن — اینها داده رو به صورت امن escape می کنن.تگ های خطرناک مثل ، ، رو حذف کن.2. CSRF (Cross-Site Request Forgery) 🎭این تهدید چی هست؟ هکر کاری میکنه کاربر واردشده (Logged in) ناخواسته یک کار مهم انجام بده — مثل انتقال پول.چطور کار میکنه؟تو وارد سایت بانکت هستی.ایمیلی میگیری: «🎁 برای هدیه رایگان کلیک کن!»لینک درواقع یک فرم مخفی انتقال پول هست.مرورگر کوکی لاگین تو رو اتوماتیک میفرسته.💸 پول میره توی حساب هکر.✅ راهکار برای فرانت اند:برای هر فرم CSRF Token بگذار.هرجا ممکن بود کوکی ها رو با ویژگی SameSite ست کن.3. SQL Injection (تزریق SQL) — بیشتر مشکل بک اند 💉مسئولیت کیه؟ بیشتر توسعه دهندگان بک اند.خطر: هکر متن عجیب داخل فیلد وارد میکن تا کوئری دیتابیس خراب شه.💡 مثال:اگر بک اند این کد را اجرا کند:✅ وظیفه فرانت اند: داده های عجیب و مشکوک رو قبل از ارسال به بک اند فیلتر کنه.⚠️ چند تهدید دیگر که باید اسمشونو بدونیClickjacking: هکر صفحه اش رو پشت سایت تو مخفی میکنه. در این صورت وقتی کاربر روی دکمه “پخش ویدیو” کلیک میکنه درواقع دکمه “خرید” رو فشار داده!DoS (Denial of Service): هکر با درخواست های زیاد سایتت رو از کار میاندازه.ترفندهای فایل (File Inclusion & Directory Traversal): هکرها میخوان فایلهای مهم رو بخونن یا اجرا کنن.🛠 چک لیست امنیت برای توسعه دهندگان فرانت اند✅ ۱. پاکسازی و اعتبارسنجی همه داده هابه فرم ها، query string، کوکی ها و فایل های آپلود شده اعتماد نکن.✅ ۲. اصرار روی HTTPSسایت بدون HTTPS یعنی داده های ورودی راحت دزدیده میشن.✅ ۳. از قابلیتهای امنیتی فریمورک ها استفاده کنReact / Vue / Angular به طور پیشفرض داده ها وا امن رندر میکنن — از dangerouslySetInnerHTML فقط در مواقع خاص استفاده کن.✅ ۴. هدرهای امنیتی اضافه کن (با همکاری تیم بک اند)CSP (Content Security Policy): چه اسکریپ تهایی اجازه اجرا دارند.X-Frame-Options: جلوی clickjacking رو میگیره.✅ ۵. اعتبارسنجی سمت کاربرمثلاً اگر یک فیلد ایمیل میخواد، چک کن فرمتش حتما شبیه ایمیل باشد.✅ ۶. آپدیت نگه داشتن کتابخانه هاپکیج های قدیمی npm = درهای باز برای هکرها.🏆 جمع بندی✅ XSS و CSRF بزرگترین تهدیدهایی هستند که باید یادبگیری.✅ از HTTPS، توکن CSRF، هدرهای امنیتی و قابلیت های پیشفرض فریمورک ها استفاده کن.