Laravel 10 + Nginx下根路由/assets资源404错误求助

我在Ubuntu 22系统上部署了Laravel 10项目，使用Nginx作为服务器。当访问根路由/时，加载public/assets目录下的资源频繁出现net::ERR_ABORTED 404 (Not Found)错误，但访问/home路由（对应同一页面、同一资源文件）时却能正常加载。以下是相关配置文件：

Nginx虚拟主机配置 #

server {
    listen 80;

    root /var/www/v2-hexagon/public;

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

    index index.html index.htm index.php;

    server_name compro.hexagon.co.id www.compro.hexagon.co.id;

    charset utf-8;

    location / {
        try_files $uri $uri/ /index.php?$query_string;
    }

    location = /favicon.ico { access_log off; log_not_found off; }
    location = /robots.txt  { access_log off; log_not_found off; }

    location ~ \.php$ {
        fastcgi_pass unix:/var/run/php/php8.1-fpm.sock;
        fastcgi_index index.php;
        fastcgi_param SCRIPT_FILENAME $realpath_root$fastcgi_script_name;
        include fastcgi_params;
    }

    location ~ /\.(?!well-known).* {
        deny all;
    }
}

routes/web.php 文件 #

<?php

use Illuminate\Support\Facades\Route;

Route::get('/', function () {
    return view('Home');
})->name('Home');

Route::get('/home', function () {
    return view('Home');
})->name('Home');

Route::get('/about', function () {
    return view('about');
})->name('About');

Route::get('/Portofolio', function () {
    return view('Portofolio');
})->name('Portofolio');

Route::get('/Services', function () {
    return view('Services');
})->name('Services');

Route::get('/News', function () {
    return view('News');
})->name('News');

Route::get('/Career', function () {
    return view('Career');
})->name('Career');

Route::get('/Contact', function () {
    return view('Contact');
})->name('Contact');

Route::get('/News/Post/{id}', function ($id) {
    return view('singlepost', ['id' => $id]);
})->name('singlepost');

Route::get('/Portofolio/Post/{id}', function ($id) {
    return view('singleporto', ['id' => $id]);
})->name('singleporto');

// Route::get('/about_layout', function () {
//     return view('about_layout');
// });

Route::get('/Service/IT Consultation', function () {
    return view('IT Consultation');
})->name('IT Consultation');


Route::get('/Service/Digital Marketing', function () {
    return view('Digital Marketing');
})->name('Digital Marketing');


Route::get('/Service/Branding', function () {
    return view('Branding');
})->name('Branding');

核心原因 #

问题源于视图中资源使用相对路径引用，导致浏览器在根路由/下解析资源路径时出现异常（部分资源路径被错误解析），而/home路由的层级结构让相对路径解析暂时正常。

步骤1：修正视图资源引用方式 #

在Laravel视图文件（如resources/views/Home.blade.php）中，所有public/assets下的资源必须使用Laravel的asset()辅助函数生成绝对路径，避免相对路径的解析问题。

错误写法（相对路径）：

<link rel="stylesheet" href="assets/css/style.css">
<script src="assets/js/app.js"></script>

正确写法（绝对路径）：

<link rel="stylesheet" href="{{ asset('assets/css/style.css') }}">
<script src="{{ asset('assets/js/app.js') }}"></script>

步骤2：优化Nginx静态资源处理 #

在Nginx虚拟主机配置中添加静态资源专属规则，优先处理静态文件，提升性能并避免不必要的PHP解析：

location ~* \.(css|js|png|jpg|jpeg|gif|ico|svg)$ {
    expires 1y;
    add_header Cache-Control "public, immutable";
}

添加后重启Nginx生效：

sudo systemctl restart nginx

步骤3：验证权限与缓存 #

1. 确保public/assets目录及文件权限正确，Nginx进程可读取：

sudo chown -R www-data:www-data /var/www/v2-hexagon/public/assets
sudo chmod -R 755 /var/www/v2-hexagon/public/assets

2. 清理浏览器缓存或使用无痕模式访问，排除旧缓存影响。

额外检查 #

确认视图中资源引用的文件名与实际文件大小写一致（Linux系统区分大小写），比如避免视图写Assets/css/style.css而实际目录是assets的情况。

内容的提问来源于stack exchange，提问作者Elmo Kucho