حل عدم نمایش CSS و HTML در فایل های میزبان لاراول

اگر با لاراول کار می کنید و متوجه شدید که فایل های CSS و HTML شما به درستی نمایش داده نمی شوند، به خصوص پس از استقرار برنامه، شما تنها نیستید. این مشکل به ویژه در هنگام انتقال از یک محیط توسعه محلی به یک سرور تولید رایج است. در این مقاله علت این مشکل را بررسی می کنیم و راه حلی ساده ارائه می دهیم.

درک موضوع

هنگامی که برنامه لاراول شما میزبانی می شود، ممکن است با وضعیتی مواجه شوید که فایل های CSS و HTML به درستی بارگیری نمی شوند. این اغلب به دلیل استفاده از طرح URL نادرست برای پیوندهای دارایی شما اتفاق می افتد. در یک محیط محلی، برنامه معمولاً از طریق HTTP اجرا می شود. با این حال، در یک محیط تولید، اغلب از طریق HTTPS اجرا می شود.

علائم رایج

• Stylesheets (CSS) در HTML شما اعمال نمی شود.
• فایل های HTML به درستی رندر نمی شوند.
• خطاهای کنسول مرورگر نشان دهنده مشکلات محتوای مختلط است.

این علائم معمولاً به دلیل ارائه دارایی های برنامه از طریق HTTP ایجاد می شوند در حالی که خود سایت از طریق HTTPS بارگیری می شود و در نتیجه منابع به دلیل محدودیت های امنیتی مسدود می شود.

راه حل

راه حل این مشکل شامل اطمینان از این است که همه URL های تولید شده توسط لاراول از طرح صحیح (HTTP یا HTTPS) بر اساس محیط استفاده می کنند. این را می توان با اجبار HTTPS در محیط تولید به دست آورد. در اینجا نحوه انجام آن آمده است:

راهنمای گام به گام

1. ارائه دهنده خدمات برنامه را باز کنید

هدایت به app/Providers/AppServiceProvider.php در پروژه لاراول شما

1. ارائه دهنده خدمات برنامه را تغییر دهید

را به روز کنید AppServiceProvider کلاس برای اجبار HTTPS در محیط های غیر محلی. کدی که باید اضافه یا تغییر دهید در اینجا آمده است:

   

   namespace App\Providers;

   use Illuminate\Support\ServiceProvider;
   use Illuminate\Pagination\Paginator;
   use Illuminate\Support\Facades\Blade;
   use Illuminate\Support\Facades\URL;

   class AppServiceProvider extends ServiceProvider
   {
       /**
        * Register any application services.
        *
        * @return void
        */
       public function register()
       {
           if (env('APP_ENV') !== 'local') {
               URL::forceScheme('https');
           }
       }

       /**
        * Bootstrap any application services.
        *
        * @return void
        */
       public function boot()
       {
           Paginator::useBootstrap();
       }
   }

توضیح کد

• فضای نام و واردات: مطمئن شوید که فضای نام صحیح و دستورات وارد کردن را در بالای فایل خود دارید.
• روش ثبت نام: در register روش، بررسی می کنیم که آیا محیط برنامه (APP_ENV) نیست local. اگر این شرط درست باشد، استفاده از HTTPS را مجبور می کنیم URL::forceScheme('https');.
• روش بوت: boot روش جایی است که ما می توانیم بوت استرپ اضافی را انجام دهیم. در این مثال، ما از Bootstrap برای صفحه بندی استفاده می کنیم، اما ممکن است تنظیمات دیگری نیز در اینجا داشته باشید.

چرا این کار می کند

با اجبار کردن طرح URL به HTTPS در محیط های غیر محلی، اطمینان حاصل می کنیم که همه پیوندهای دارایی به درستی با طرح HTTPS ایجاد می شوند. این از مشکلات محتوای مختلط جلوگیری می کند و تضمین می کند که فایل های CSS و HTML شما به درستی بارگیری می شوند.

نکات اضافی

• پیکربندی محیط: از خود اطمینان حاصل کنید .env فایل به درستی تنظیم شده است APP_ENV=production برای محیط تولید شما
• کش پیکربندی را پاک کنید: پس از ایجاد تغییرات در پیکربندی خود، کش پیکربندی را با آن پاک کنید php artisan config:cache.
• نسخه دارایی: از نسخه سازی Laravel Mix برای جلوگیری از مشکلات کش مرورگر استفاده کنید: mix.version() در شما webpack.mix.js.

نتیجه

با اصلاح AppServiceProvider برای اجبار HTTPS در محیط های تولید، می توانید مشکلات مربوط به عدم نمایش صحیح فایل های CSS و HTML را در برنامه لاراول خود حل کنید. این تغییر ساده و در عین حال موثر تضمین می کند که دارایی های شما همیشه بر اساس طرح صحیح ارائه می شود و یکپارچگی و امنیت برنامه شما حفظ می شود.

هر گونه سوالی را بپرسید یا تجربیات خود را در نظرات زیر به اشتراک بگذارید! کد نویسی مبارک!