Upload Gambar Ke Database Menggunakan PHP

Beberapa waktu yang lalu pada tutorial Upload Foto Dengan PHP terdapat komentar dari pembaca yang request untuk menerbitkan tutorial tentang peyimpanan gambar ke database, untuk itu pada kesempatan kali ini kita akan membahas mengenai Cara Upload File atau Foto ke Database menggunakan source php sederhana. Berikut detail langkah pembuatannya.

Langkah 1

Sebelum membuat form silahkan buat terlebih dahulu database dengan nama PalComTech dan tabel dengan nama tb_gambar serta buat juga satu field dengan nama foto pada tabel tb_gambar tersebut.

clip_image002

Langkah 2

Buatlah form yang digunakan untuk upload file, form yang sederhana dapat menggunakan source code sebagai berikut, simpan dengan nama form_upload.php.

<html>

<title>Upload Your Picture</title>

<style type="text/css">

<!--

.style1 { font-family: Verdana;

font-size: 12px;

color: #008000;

}

.style3 {font-family: Verdana; font-size: 12px; color: #008000; font-weight: bold; }

-->

</style>

</head>

<body>

<form method="post" action="proses_simpan.php" enctype="multipart/form-data">

<table width="275" border="0" align="center">

<tr>

<td width="278" height="50" colspan="3" align="center" class="style3">Silahkan Pilih Foto Anda Profil Anda... :)</td>

</tr>

<tr>

<td><input name="gambar" type="file" class="style1" id="gambar" size="25" /></td>

</tr>

<tr>

<td height="30" colspan="3" align="center"><input type="submit" name="button" class="style1" value="Upload" />

<input name="button2" type="reset" class="style1" id="button" value="Reset" />

 </td>

</tr>

</table>

</form>

</body>

</html>

Langkah 3

Selanjutnya ketikkan script prosessimpan.php dengan source code berikut.

<?php

$host = "localhost";

$user = "root";

$pass = "123456";

$d_base = "PalComTech";

mysql_connect($host, $user, $pass) or die ("Koneksi ke Server Gagal, Brow...".mysql_error());

mysql_select_db($d_base) or die ("Database gax ditemukan...Buat dulu gih... :)".mysql_error());

$tipe_gambar = array('image/jpeg','image/bmp', 'image/x-png');

$nama = $_FILES['gambar']['name'];

$ukuran = $_FILES['gambar']['size'];

$tipe = $_FILES['gambar']['type'];

$error = $_FILES['gambar']['erorr'];

if($nama !=="" && $ukuran > 0 && $error == 0){

if(in_array(strtolower($tipe), $tipe_gambar)){

$move=move_uploaded_file($_FILES['gambar']['tmp_name'], 'gambar/'.$nama);

if($move){

mysql_query("INSERT INTO tb_gambar SET foto='$nama'") or die ("Upz...foto gagal diupload, silahkan coba lagi ... ".mysql_error());

header("location:tampil.php");

}else{

echo"<script>alert('Gagal di pindah ke temporari server, silahkan coba beberapa saat lagi...');window.history.go(-1);</script>";

}

}else{

echo "<script>alert('Sori brow selain JPEG, BMP, dan PNG tidak diperkenankan...*_*...');window.history.go(-1);</script>";

}

}else{

echo"<script>alert('oOoo, Pilih foto dulu brow...*_*...');window.history.go(-1);</script>";

}

?>

Langkah 4

Setelah berhasil membuat script simpan kita dapat melengkapinya dengan script yang digunakan untuk menampilkan foto yang telah di upload dan disimpan di database. Ketik script dibawah ini dan simpan dengan nama tampil.php.

<html>

<head>

<title>Galeri Foto</title>

</head>

<body>

<table width="200" border="0" align="center">

<?php

$host = "localhost";

$user = "root";

$pass = "123456";

$d_base = "PalComTech";

mysql_connect($host, $user, $pass) or die ("Koneksi ke Server Gagal, Brow...".mysql_error());

mysql_select_db($d_base) or die ("Database gax ditemukan...Buat dulu gih... :)".mysql_error());

$query=mysql_query("SELECT * FROM tb_gambar");

while($result=mysql_fetch_array($query)){

?>

<tr>

<td><img src="gambar/<?php echo $result["foto"]; ?>" alt="" width="200" height="150"></td>

</tr>

<?php

}

?>

<tr>

<td><a href="form_upload.php">Kembali</a></td>

</tr>

</table>

</body>

</html>

Langkah 5

Langkah terahir silahkan buat folder baru didalam folder utama (direktori tempat kita menyimpan script) dengan nama gambar dan biarkan saja kosong, folder ini nantinya akan digunakan untuk menyimpan semua gamabr yang kita upload.

Test Script

Setelah semua script diatas selesai di buat, silahkan jalankan file form_upload.php melalui webserver hingga tampil seperti gamabr berikut :

clip_image002[7]

clip_image004

Script diatas akan segera berjalan ketika kita mengklik tombol upload, script yang terdapat di file proses_simpan.php akan segera memeriksa apakah gambar yang kita upload terdapat kesalahan atau tidak, jika ada misalnya kita mengupload gambar dengan tipe diluar ketentuan yang diteteapkan (JPEG, BMP dan PNG) maka script akan menampilkan pesan kesalahan sebagai berkut.

Pesan error ini didapat karena kita memberikan validasi untuk tidak menerima jika file yang diupload tidak bertipe JPEG, BMP atau PNG.

Sebaliknya jika kita memasukka tipe yang sesuai maka script akan segera memindahkan file tersebut ke direktori/folder gambar dan menyimpan nama file nya ke database serta akan menampilkannya.

clip_image006

 

Keterangan :

  • v array(‘image/jpeg’,’image/bmp’, ‘image/x-png’ );  menentukan tipe gambar yang boleh di upload.
  • v $_FILES['gambar'] ['name'] Mengambil nama file yang sedang diupload.
  • v $_FILES['gambar']['type'] Mengambil tipe gambar yang sedang diupload.
  • v $_FILES['gambar']['size'] mengambil ukuran file (dalam byte).
  • v $_FILES['gambar']['tmp_name'] Nama file temporer dari file yang sedang diupload yang disimpan di temporari folder server.
  • v $_FILES['gambar']['error'] Error Code yang berhubungan dengan file yang sedang diupload.

Penting :

Kode HTML form harus menggunakan atribut enctype=”multipart/form-data” agar file yang dimasukkan bisa diupload.

Semoga berhasil dipraktekkan ya… Open-mouthed smile

A. Efryanto

Efry bekerja sebagai staff pengajar di LKP PalComTech Prabumulih. Bidang materi yang diajarkan adalah pemrograman seperti PHP.

35 comments

  1. Mantap gan……berbagi terus caknyo……:)

  2. @abi – berbagi sambil terus belajar bi… :)

  3. @p khotop – waduh ada p khotop…ngumpet dulu ah…hehe… :ngacir:
    trimz pak… :)

  4. Masih Mudo, besak tinggi….
    mantab..mantab…

    Tapi ngapo gambar yang keduo mirip GAYUS ya??? :ngakaks

  5. @reza
    ado2 be kak eja nieah
    tpi men diliat sepintas yo nan eh do miripnyo dikit…
    ^_*
    :ngakaks

  6. @reza – Iyo nian …..itu namonyo Benyus adiknyo gayus…jadi wajar agak mirip adik beradik………he..he…..wak ben…peace…just kidding…. :)

  7. upz, tapi foto yang pertama kox kyak bukan jantan ya…wkwkwkwk

  8. Judulnya menyesatkan, judul yang tepat menyimpan informasi nama gambar ke database. kl upload gambar ke database artinya gambar di simpan pake tipe data blob di tabelnya dan ditampilkan dengan header untuk menampilkan datanya pake Content-type.

  9. @alam – hmmm…bener jg ya… :)
    wah trimz bgt pak buat koreksi nya… :wowcantik

  10. wah mau jadi pertamax e.. mala jadi bang akhirudin… :(

  11. gan format buat databasenya apa gan?? varchar ato ada yg laen??

  12. mas tolong script untuk update gambar nya donk ..kirim ke email juga boleh ..maksih buat tutorial nya dan PALCOM TECH makin maju.. :)

  13. thx tutor nya…mantap…
    tapi saya mo nanya utk database nya field nya apa aja yach???
    trus klo mo buat komentar yang disertai foto bagaimana caranya??
    thx….

  14. ga tampil gan gambar nya? gmana ni?

  15. salam kenal mas, artikel yg bagus,, oia sya mau nanya, apakah code yg mas bikin ini dapat meload lebih dari 1 gambar/file sekaligus ke dalam database? yg kedua, apakah tipe data blob dapat menyimpan file selain gambar?
    *tolong bls lewat email saya mas efriey, sekali lagi salam kenal dan terimakasih. :)

  16. kog gambar saya gag bisa tampil brow??

  17. <img src="gambar/” alt=”” width=”200″ height=”150″>

    syntax ini maksud nya apa yah….

  18. gan type pas bikin field fotonya apa?

  19. gan. bagaimana jika tambah lagi 1 form misalkan judul dan no. itu proses updatenya bagaimna ya gan.? mohon bantu dulu.

  20. sankyu tutornya berguna bgt

  21. Mo coba Dulu kodenya, thanks…

  22. Gak jalan nih script. Bingung aku ! :mewek:

  23. terdiri berapa kolom di table database tb_gambarnya??
    trus apa nama2 nya ya??

  24. kok pas udah upload muncul alert belum pilih foto padahal udah milih..

  25. gan ko ane ga eror terus sih kenapa ya…?

  26. gan kalo error nya gini , gmana ?

    Gagal di pindah ke temporari server, silahkan coba beberapa saat lagi..

  27. Mantap gan.. saya punya tutorial serupa silahkan di coba..
    http://www.youtube.com/watch?v=Ky70sr8IBec
    Simpan Gambar ke Dalam Database Mysql (Xampp) Dengan Dreamweaver CS6

  28. Mantap gan.. saya punya tutorial serupa silahkan di coba, semoga bermanfaat..
    http://www.youtube.com/watch?v=Ky70sr8IBec
    Simpan Gambar ke Dalam Database Mysql (Xampp) Dengan Dreamweaver CS6

  29. Cannot find the fileHTTP 404

    Web server cannot find the file or script you requested. Please check the URL to ensure that the path is correct.
    keluar ginian gan.. tulungin lah

Leave a Reply

Your email address will not be published. Required fields are marked *

*

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

[+] kaskus emoticons nartzco