Tutorial Laravel #17: Upload File di Laravel

1. Setup Storage

Laravel menyimpan file upload di folder storage/app/public/. Agar bisa diakses dari browser, perlu dibuat symlink dari public/storage ke storage/app/public:

php artisan storage:link
# Output: The [public/storage] link has been connected to [storage/app/public].

Setelah itu file yang disimpan di storage/app/public/ bisa diakses via URL /storage/namafile.jpg.

2. Form Upload File

<!-- Wajib: enctype dan method POST -->
<form method="POST" action="{{ route('artikel.store') }}" enctype="multipart/form-data">
    @csrf
    <div class="mb-3">
        <label>Gambar Artikel</label>
        <input type="file" name="gambar" class="form-control @error('gambar') is-invalid @enderror"
               accept="image/*">
        @error('gambar')
            <div class="invalid-feedback">{{ $message }}</div>
        @enderror
    </div>
    <button type="submit">Simpan</button>
</form>

3. Proses Upload di Controller

public function store(Request $request)
{
    $request->validate([
        'judul'  => 'required|string|max:200',
        'gambar' => 'nullable|image|mimes:jpg,jpeg,png,webp|max:2048',
    ]);

    $data = $request->only(['judul', 'konten', 'status']);

    // Proses upload jika ada file
    if ($request->hasFile('gambar')) {
        $file  = $request->file('gambar');

        // Store otomatis generate nama unik dan simpan ke storage/app/public/gambar/
        $path  = $file->store('gambar', 'public');
        // Hasilnya: "gambar/abc123def456.jpg"

        $data['gambar'] = $path;
    }

    Artikel::create($data);

    return redirect()->route('artikel.index')->with('success', 'Artikel berhasil disimpan!');
}

4. Menampilkan Gambar di View

@if($artikel->gambar)
    <img src="{{ asset('storage/' . $artikel->gambar) }}"
         alt="{{ $artikel->judul }}"
         class="img-fluid rounded">
@else
    <img src="{{ asset('images/placeholder.jpg') }}" alt="No Image" class="img-fluid rounded">
@endif

5. Update - Ganti Gambar Lama

use IlluminateSupportFacadesStorage;

public function update(Request $request, Artikel $artikel)
{
    $request->validate([
        'judul'  => 'required|string|max:200',
        'gambar' => 'nullable|image|mimes:jpg,jpeg,png,webp|max:2048',
    ]);

    $data = $request->only(['judul', 'konten', 'status']);

    if ($request->hasFile('gambar')) {
        // Hapus gambar lama jika ada
        if ($artikel->gambar && Storage::disk('public')->exists($artikel->gambar)) {
            Storage::disk('public')->delete($artikel->gambar);
        }

        // Upload gambar baru
        $data['gambar'] = $request->file('gambar')->store('gambar', 'public');
    }

    $artikel->update($data);

    return redirect()->route('artikel.index')->with('success', 'Artikel berhasil diperbarui!');
}

6. Hapus File saat Data Dihapus

use IlluminateSupportFacadesStorage;

public function destroy(Artikel $artikel)
{
    // Hapus file gambar dulu
    if ($artikel->gambar && Storage::disk('public')->exists($artikel->gambar)) {
        Storage::disk('public')->delete($artikel->gambar);
    }

    $artikel->delete();

    return redirect()->route('artikel.index')->with('success', 'Artikel berhasil dihapus!');
}

7. Method File yang Berguna

$file = $request->file('gambar');

$file->getClientOriginalName();     // nama asli file: "foto.jpg"
$file->getClientOriginalExtension(); // ekstensi: "jpg"
$file->getMimeType();               // MIME type: "image/jpeg"
$file->getSize();                   // ukuran dalam bytes
$file->hashName();                  // nama hash unik: "abc123.jpg"

// Cara simpan dengan nama kustom
$namaFile = time() . '_' . $file->getClientOriginalName();
$file->storeAs('gambar', $namaFile, 'public');

8. Ringkasan

  • Jalankan php artisan storage:link untuk mengakses file dari browser
  • $request->file('field')->store('folder', 'public') untuk upload dengan nama otomatis
  • Gunakan asset('storage/' . $path) untuk generate URL gambar di view
  • Selalu hapus file lama saat update atau delete data

Tutorial berikutnya membahas middleware di Laravel.


ariq fadhil

Im Ariq Tech, a Top Rated Fullstack Developer with 5+ years of experience, delivering high-quality solutions across 50+ projects.