یادداشت‌ها

»

کشف فونت های نصب شده در کلاینت

در زمان تنظیم استایل سایت آیت الله سیدعلی حسینی سیستانی (حفظه‌الله) برای زبان اردو، به مشکل خاصی برخورد کردم که در این مطلب به شرح آن مشکل، روش حل و همچنین فوایدش می‌پردازم.
زبان اردو که طرفداران زیادی دارد و در پاکستان و هند رایج است، با فونت‌های معمول (Arial, Tahoma و ...) به خوبی نمایش داده نمی‌شود و اردوزبانان از فونت نستعلیق خاصی (شبیه نستعلیق فارسی) استفاده می‌کنند. این فونت به دلیل سنگینی حجم (حدود 10 مگابایت!) قابل face کردن با css نیست و لذا مجبور بودم فقط نام فونت را در css درج کنم تا اگر آن فونت در سیستم کاربر نصب شده بود، لود شود و الا با همان فونت پیشفرض نمایش داده شود:

body{font-family:"AlQalam Taj Nastaleeq","Jameel Noori Nastaleeq","Nafees nastaleeq","Alvi Nastaleeq";}

مشکل از آنجا شروع می‌شود که برای نمایش سایت با فونت عادی، سایز قلمی مثل 12px مناسب بود اما اگر فونت اردو در دستگاه کاربر نصب بود، سایز 12px بسیار ریز و ناخوانا می‌شد. از سویی اگر font-size را روی عدد بزرگی مثل 20 یا 25 تنظیم می‌کردم و فونت اردو در دستگاه کاربر نصب نشده بود، آنگاه فونت Tahoma با سایز 20/25 بسیار بزرگ می‌شد و نامتناسب.
لذا لازم بود با روشی کشف کنم که آیا یک فونت خاص روی سیستم کاربر نصب شده است یا خیر؟

همانطور که قبلا در مطلب «انواع روش‌های شناسایی و احراز هویت یک کاربر در یک صفحه وب» اشاره کردم، اگر java (نه javascript) یا Adobe Flash Player در دستگاه کاربر نصب باشد، آنگاه می‌توان لیست کل فونت‌های نصب شده در سیستم کاربر را کشف کرد لذا این روش برای همه کاربران نمی‌تواند پیاده شود و لازم بود روشی استفاده شود که برای همه قابل استفاده باشد.

پس از کمی جستجو، با این ایده ساده برخورد کردم که می‌توان دو لایه (div) تعریف کرد و در هر دو یک عبارت یکسان متنی قرار داد و سپس به اولی همان فونت پیشفرض صفحه و به دومی فونت موردنظر را اعمال کنیم و سپس با js عرض (width) هر دو div را بخوانیم. اگر هر دو مساوی بود، به معنای این است که آن فونت روی دستگاه کاربر نصب نشده است.
نوشتن کد js چنین کاری ساده است اما اگر دنبال نمونه کد آماده می‌گردید، این یک نمونه با کمک کتابخانه jQuery و این هم یک نمونه ساده با js خالی.

کاربردهای کشف نصب بودن یا نبودن فونت/فونتهای خاص در دستگاه کاربر

یک فایده آن همین تنظیم استایل است که اشاره شد. یعنی می‌توان سایز فونت را با توجه به نصب بودن/نبودن تنظیم کرد.
اما فایده دیگر آن، همان بحث شناسایی کاربر است. یعنی ما می‌توانیم لیستی مثلا 1000 تایی از فونت‌ها به این اسکریپت بدهیم (همانطور که در لینک بالا می‌بینید) و برنامه تشخیص دهد که از این 1000 فونت، کدام فونت‌ها روی دستگاه کاربر تصب هستند و به این ترتیب می‌توان تا حدی به احراز هویت کاربر کمک کرد...

---

یادداشت‌های مرتبط

1. سرویس های آنلاین رایگان برای نوشتن، تست و بهینه سازی کدهای برنامه نویسی
2. استفاده از فونت دلخواه در صفحات وب
3. امنیت در انگولر جی اس
4. روش های بهبود کیفیت آپلود فایل ها از طریق فرم های صفحات وب
5. تشخیص و کشف نوع، نام و مشخصات مرورگر کاربران سایت
6. انواع روش های شناسایی و احراز هویت کاربران یک صفحه وب
7. قلمرو متغیرها در پی اچ پی و جاوا اسکریپت
8. دسترسی کامل به عناصر آدرس در جاوا اسکریپت
9. درباره نود جی اس
10. افکت های متن با جاوا اسکریپت و جی کوئری
11. خطا در جاوا اسکریپت
12. پایگاه داده در جاوا اسکریپت
13. روش ها و تکنیک های پنهان کردن ایمیل
14. زوم (zoom) و بزرگنمایی تصویر و متن با جاوا اسکریپت و پی اچ پی
15. بازی با زمان!
16. کار با تصاویر در سمت کاربر
17. بهینه سازی آنلاین سی اس اس و جاوا اسکریپت
18. استفاده از Media Queries ها و اصلاح عدم پشتیبانی IE6-8
19. چند لینک جامع برای یادگیری جاوا اسکریپت
20. انواع راه های تولید کد QR با پی اچ پی و جاوا اسکریپت