Laravel+Vite集成spatie/laravel-csp时nonce始终为空问题

核心问题分析 #

你遇到的问题本质是自定义nonce生成器的实现逻辑有误，导致Vite没有正确接收到nonce值，因此无法自动为生成的script标签添加nonce属性。虽然Spatie CSP能拿到正确的nonce并设置到响应头，但Vite端没有同步到这个值。

具体修复步骤 #

1. 修正自定义Nonce生成器代码 #

你的LaravelViteNonceGenerator需要先生成随机nonce，同时把值同步给Vite，再返回给Spatie CSP。替换原代码为：

<?php

namespace App\Support;

use Illuminate\Support\Str;
use Laravel\Vite\Vite;

class LaravelViteNonceGenerator
{
    public function __invoke(): string
    {
        // 生成符合CSP要求的随机nonce（长度建议32位以上）
        $nonce = Str::random(32);
        
        // 将nonce传递给Vite实例，让Vite生成script标签时带上该属性
        app(Vite::class)->useCspNonce($nonce);
        
        // 返回nonce给Spatie CSP，用于构建CSP响应头
        return $nonce;
    }
}

原代码直接返回Vite::useCspNonce()的写法错误，因为useCspNonce()方法在不传参时是获取当前nonce，而非生成/设置；若之前未设置，返回值就是空。

2. 检查中间件顺序 #

在app/Http/Kernel.php的web中间件组中，AddCspHeaders中间件应放在所有输出响应内容的中间件之前（比如StartSession、VerifyCsrfToken之后，ShareErrorsFromSession之前），确保nonce在页面渲染前就已生成：

protected $middlewareGroups = [
    'web' => [
        // ...其他中间件
        \Illuminate\Session\Middleware\StartSession::class,
        \Illuminate\View\Middleware\ShareErrorsFromSession::class,
        \Spatie\Csp\AddCspHeaders::class, // 放在这里
        // ...其他中间件
    ],
];

3. 清除缓存验证 #

执行以下命令清除配置和视图缓存，避免旧配置干扰：

php artisan config:clear
php artisan view:clear

验证结果 #

完成上述修改后，刷新页面：

• 检查响应头的Content-Security-Policy字段，确认包含'nonce-xxx'；
• 查看页面源码中@vite生成的<script>标签，应自动带有nonce="xxx"属性，且值与CSP头中的一致。

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