Laravel 8 + Nginx-来自public/的app.css和app.js资源未加载-找不到404 [英] Laravel 8 + nginx - app.css and app.js resources from public/ not loading - 404 not found

问题描述

这似乎是一个重复的问题，但这是不同的.相信我，我为此研究了整个堆栈，laracast，reddit和github

我在具有 nginx 的 ubuntu VM 上有一个 Laravel 应用程序.我有这个问题我的Laravel 8应用程序没有加载 app.css public/中的 app.js 个文件.我已经运行了 npm install&npm运行dev/prod ，但我仍然遇到404错误-在Chrome中找不到控制台.因此，我的 app.css和.js 仍然存在并且运行良好 public/css-/js 文件夹.该路径也会正确生成资源/资产.仍然无法正常工作.我尝试了几种服务器块配置，但没有成功.

I have a Laravel app on a ubuntu VM with nginx. The issue I have with my Laravel 8 app is that it's not loading the app.css and app.js files from public/. I have ran npm install & npm run dev/prod but I still got the 404 error - not found in the chrome console. So my app.css and .js are alive and well in my public/css - /js folders.The path is also generated correctly for the resources/assets.Still not working. I have tried several server block configurations, with no succes.

如果您遇到相同的问题并尝试 npm install and run dev ，使用 asset 辅助函数生成 path ，< script src ="{{asset('/js/app.js')}}'";延迟<</script> 和< link href =" {{asset('/css/app.css')}}"rel ="stylesheet"> ，它仍然不是工作，请在下面查看我的答案，*这可能为您节省我所花的1周时间搜索.* 强调文本

If you have the same issue and have tried npm install and run dev, using the asset helper function to generate the path, <script src="{{ asset('/js/app.js') }}" defer></script> and <link href="{{ asset('/css/app.css') }}" rel="stylesheet"> and it's still not working check my answer bellow, *it might save you the 1 week I spent searching.*emphasized text

推荐答案

如果您的配置与我相同，则该解决方案非常简单.

The solution, if you have the same configuration as me, is painfully simple.

我在/home/myUsername/myLaravelAppName 中安装了Laravel应用，并在/var/www/myLaravelSiteName - /var/www/myLaravelSiteName 是服务网站的默认Nginx根目录-

I installed my Laravel app in the /home/myUsername/myLaravelAppName with a symlink for index.php in/var/www/myLaravelSiteName - /var/www/myLaravelSiteName being the default nginx root for serving websites - as you know.

解决方案:还为/public/css/和/public/js/目录中的每个都建立符号链接到 /var/www/myLaravelSiteName ，因为 index.php symlink 也不同时提供/public/中的css和js文件夹 .对我来说很明显.

The solution: make a symlink also for each of the /public/css/ and /public/js/ directories to /var/www/myLaravelSiteName, because the index.php symlink does not also serve css and js folders from /public/.Apparently this was not so obvious for me.

或者您可以将整个/public/目录符号链接到/var/wwwmyLaravelSiteName .

如果这仍然不起作用，则可能还有其他问题，请继续搜索，因为有针对这些问题的其他修复程序.一种快速但肮脏"的解决方法是使用引导程序中的在线 CDN链接并将其添加到 app.blade.php 中.可以，但是不推荐.

If this still does not work you might have other issues so keep searching as there are other fixes for those. One quick but 'dirty' fix would be using the online CDN links from bootstrap and adding them in app.blade.php. It will work but it's not recommended.

此外，必须添加您添加的任何新的自定义css/js文件，因此首选正确的功能方式.这些服务器必须具有符号链接，并且如果单独使用而不是与整个public/目录一起使用，则必须具有良好的符号链接.

PS.别忘了将符号链接从可用站点转换为启用站点.

PS. do not forget to make the symlink from sites-available to sites-enabled.

我正在工作的服务器块:

My working server block:

server {
    listen 80;
    listen [::]:80;



    root /var/www/laravel;


    add_header X-Frame-Options "SAMEORIGIN";
    add_header X-XSS-Protection "1; mode=block";
    add_header X-Content-Type-Options "nosniff";

    charset utf-8;

    index index.php index.html index.htm ;

    server_name laravel www.laravel;

    location = /favicon.ico { access_log off; log_not_found off; }
    location = /robots.txt  { access_log off; log_not_found off; }
    
    location / {
        try_files $uri $uri/ /index.php?$query_string;
    }

    location ~ \.php$ {
        
        include /etc/nginx/fastcgi_params;
        fastcgi_split_path_info ^(.+\.php)(/.+)$;
        fastcgi_pass unix:/var/run/php/php7.4-fpm.sock;
        fastcgi_index index.php;
        fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name;
        try_files $uri = 404;
    }

    location ~* \.(jpg|jpeg|png|gif|css|js|ico|html)$ {

        access_log off;
        expires max;
        log_not_found off;
    }


    location ~/\.ht {
        deny all;
    }

    sendfile off;

}

这篇关于Laravel 8 + Nginx-来自public/的app.css和app.js资源未加载-找不到404的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！