DigitalOcean部署Laravel站点白屏 静态资源HTTPS加载报错

所有静态资源请求默认走HTTPS协议，但服务器未配置SSL证书、Nginx也未监听443端口，HTTPS请求直接被拒绝，是页面空白、资源加载报ERR_CONNECTION_REFUSED的核心原因。此外现有Nginx配置、Laravel缓存规则还有几处隐患，按以下步骤逐一修复即可。

1. 清除Laravel固化缓存，关闭强制HTTPS规则 #

之前执行的config:cache会把配置固化到文件里，哪怕改了.env也不会生效，先执行全量缓存清理：

cd /var/www/laravel
sudo php artisan config:clear
sudo php artisan route:clear
sudo php artisan view:clear
sudo php artisan cache:clear

清理完成后检查两处强制HTTPS的配置：

• 打开app/Providers/AppServiceProvider.php，查看boot方法内是否存在URL::forceScheme('https')类的强制HTTPS代码，未配置SSL的情况下直接注释掉这段逻辑。
• 打开webpack.mix.js，检查是否手动指定了https://开头的资源根路径，如果有改为相对路径，修改完成后重新执行npm run prod构建前端资源。

2. 修正Nginx配置 #

现有配置中单独为css、js写的location块缺少资源定位逻辑，会导致静态资源无法正常返回，直接替换server块配置为以下内容：

server {
    listen 80 default_server;
    listen [::]:80 default_server;
    
    root /var/www/laravel/public;
    index index.php index.html index.htm;

    server_name 147.182.184.11;

    # 统一处理静态资源，直接返回文件不走PHP解析
    location ~* \.(css|js|png|jpg|jpeg|gif|ico|svg|woff|woff2|ttf|eot)$ {
        expires 1y;
        add_header Cache-Control "public, immutable";
        try_files $uri =404;
    }

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

    location ~ \.php$ {
        include snippets/fastcgi-php.conf;
        fastcgi_pass unix:/var/run/php/php7.2-fpm.sock;
        fastcgi_param SCRIPT_FILENAME $realpath_root$fastcgi_script_name;
        fastcgi_param DOCUMENT_ROOT $realpath_root;
    }

    location ~ /\.ht {
        deny all;
    }
}

保存配置后先执行语法校验，校验通过再重载服务：

sudo nginx -t
# 输出test is successful后执行重载
sudo systemctl reload nginx

3. 修正项目目录权限 #

Laravel的storage、bootstrap/cache目录需要Web进程的读写权限，权限异常也会导致页面空白，执行以下命令授权：

sudo chown -R www-data:www-data /var/www/laravel
sudo chmod -R 755 /var/www/laravel/storage
sudo chmod -R 755 /var/www/laravel/bootstrap/cache

验证 #

操作完成后打开浏览器无痕窗口，访问http://147.182.184.11，打开开发者工具查看网络面板，确认所有css、js、图片资源均走HTTP协议且返回200状态码即可正常访问。

后续如果需要启用HTTPS，等SSL证书签发完成、Nginx配置好443端口监听后，再将.env中APP_URL改为https://开头，同时开启强制HTTPS跳转规则即可，未完成证书配置前不要启用任何强制HTTPS逻辑。

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