Laravel Blade循环中无法显示供应商Logo图片问题求助

问题根源 #

数据库logoimg字段存储的是PHP临时文件路径，而非文件上传至storage/supplier_logo后的实际相对路径，导致模板无法读取正确的图片地址。

修复步骤 #

1. 修正控制器的文件存储逻辑 #

修改创建供应商的控制器代码，确保上传文件后将实际存储的相对路径存入数据库，而非临时路径：

public function store(Request $request)
{
    // 按需添加数据验证规则
    $validated = $request->validate([
        'name' => 'required|string',
        'address' => 'required|string',
        'logoimg' => 'nullable|image|max:2048', // 限制图片类型和大小
    ]);

    $supplier = new Supplier();
    $supplier->name = $request->name;
    $supplier->address = $request->address;

    // 处理Logo上传
    if ($request->hasFile('logoimg')) {
        // 将文件存储到storage/app/public/supplier_logo，返回相对路径
        $storagePath = $request->file('logoimg')->store('supplier_logo', 'public');
        // 若需自定义文件名，改用storeAs：
        // $fileName = uniqid() . '.' . $request->file('logoimg')->getClientOriginalExtension();
        // $storagePath = $request->file('logoimg')->storeAs('supplier_logo', $fileName, 'public');
        
        // 把相对路径存入数据库
        $supplier->logoimg = $storagePath;
    }

    $supplier->save();
    return redirect()->route('suppliers.index');
}

2. 创建Storage软链接 #

Laravel的public磁盘默认指向storage/app/public，需将该目录软链接到项目根目录的public文件夹，前端才能访问存储的文件：

执行Artisan命令：

php artisan storage:link

3. 修正Blade模板的图片访问路径 #

在@foreach循环中，用Laravel辅助函数生成正确的图片URL：

@foreach($suppliers as $supplier)
    <div class="supplier-item">
        <h3>{{ $supplier->name }}</h3>
        <p>{{ $supplier->address }}</p>
        <!-- 用asset拼接路径 -->
        <img src="{{ asset('storage/' . $supplier->logoimg) }}" alt="{{ $supplier->name }} Logo">
        <!-- 或使用Storage::url()方法 -->
        <!-- <img src="{{ Storage::url($supplier->logoimg) }}" alt="{{ $supplier->name }} Logo"> -->
    </div>
@endforeach

4. 修复已有错误数据 #

若数据库中已存在错误的临时路径记录，需手动更新logoimg字段为对应文件在storage/app/public/supplier_logo中的相对路径，或重新上传Logo覆盖错误数据。

额外注意事项 #

• 确保storage/app/public/supplier_logo目录有读写权限，可执行命令设置：chmod -R 755 storage
• 若使用自定义磁盘配置，需在config/filesystems.php中确认public磁盘配置正确

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