مشکل CORS policy در نمایش فونت‌ها در وب
با بررسی یکی دیگر از خطاهای خاص و ویژه ی صفحات وب که تخت عنوان آموزش‌های مبتنی بر تجربه است در خدمت شما هستیم.
در این آموزش به بررسی رفع خطای:
Access to font at from origin has been blocked by CORS policy: No ‘Access-Control-Allow-Origin’ header is present on the requested resource
می‌پردازیم. این پست یک محتوای آموزشی ساده نیست که فقط نوشته شود بلکه بعد از رخ دادن همین خطا برای خود ما اقدام به رفع آن گرفتیم و طبق رویکردهای سایت آن را با شما به اشتراک می‌گذاریم.
مشکل CORS policy در نمایش فونت‌ها در وب
مشکل CORS policy در نمایش فونت
بعد از طراحی یکی از پروژه‌هایی که تحت php اجرا شده بود و از لوکال به سرور اصلی منتقل شد خیلی جالب بود که فونت در صفحات موجود بود و آدرس آن‌ها درست بود اما فونت‌ها لود نمیشد. کمی بیش‌تر بررسی کردیم و در بخش console مرورگر با خطای
Access to font at from origin has been blocked by CORS policy: No ‘Access-Control-Allow-Origin’ header is present on the requested resource
برخوردیم. بعد از جستجوهای مکرر در سایت‌های مختلف مثل stackoverflow روش حل این مشکل را یافتیم.
حل مشکل CORS policy در صفحات وب
برای این کار وارد کنترل بپنل cpanel خود شوید.
وارد فایل منیجر خود شوید و در مسیر public_html فایل htaccess را پیدا کنید و به حالت ویرایش این فایل بروید؛ در انتهای این فایل کد زیر را اضافه کنید:
<IfModule mod_headers.c> Header set Access-Control-Allow-Origin "*" </IfModule> <FilesMatch ".(eot|ttf|otf|woff)"> Header set Access-Control-Allow-Origin "*" </FilesMatch>
نکته:
- قبل از هرگونه ویرایشی نسخه‌ی پشتیبان از پروژه‌ی خود تهیه کنید.
- کد بالا تست شده و نتیجه ی عملی دارد در صورتی که برای شما این کد کار نکرد می‌توانید در این لینک روش‌های دیگری را نیز مشاهده کنید.
- اگر روش‌های بهتری برای انجام این کار سراغ دارید در بخش نظرات برای ما ارسال کنید.
برای دریافت فونت فارسی برای صفحات وب روی این لینک کلیک کنید.