Menampilkan Gambar dari Database di CodeIgniter

Sep 29, 2009 // by anggie // CodeIgniter, PHP, mySQL // 49 Comments

Penyimpanan file berupa gambar umumnya dilakukan dengan dua cara, yaitu disimpan di webserver, atau dimasukkan ke dalam database dengan field type yang digunakan adalah BLOB (binary large object). Keduanya memiliki kelemahan dan keunggulannya masing-masing. Penyimpanan pada webserver membutuhkan coding yang lebih kompleks, karena biasanya disertai penyimpanan informasi file ke dalam tabel juga, sehingga perlu kerja ekstra apabila ingin menampilkan, atau menghapusnya. Namun, (menurut kabar) akses akan lebih cepat daripada menggunakan database sebagai media penyimpanannya. Penyimpanan di database memang lebih berat, akan tetapi pengelolaannya akan jauh lebih mudah. Apapun itu, semuanya kembali kepada sang user, untuk memilih metode penyimpanan yang cocok dengan selera dan kebutuhan.

Proses dalam menampilkan gambar ke browser dari database (mysql) pada dasarnya membutuhkan dua file .php (misal : index.php dan foto.php). Untuk file index.php contohnya adalah sebagai berikut.

<img src="foto.php?id_foto=23" />

File index.php hanya berupa tag img yang mengirim variabel id_foto kepada file kedua, foto.php.

<?php
// koneksi database dan query menghasilkan data field gambar ($data)
// misal nama tabel= tb_foto, memiliki field 'id_foto' dan 'foto' (BLOB)
$query = mysql_query("select foto from tb_foto where id_foto='$_GET[id_foto]'");
$row = mysql_fetch_array($query) or die(mysql_error());
$im = imagecreatefromstring($row['foto']);

if ($im !== false) {
    header('Content-Type: image/jpeg');
    imagejpeg($im);
    imagedestroy($im);
}

else 
{
    echo 'error';
}
?>

Dengan menjalankan index.php, maka gambar akan ditampilkan sesuai dengan id_foto.
Inilah dasar dalam proses menampilkan gambar yang disimpan di dalam database. Nah, sekarang bagaimanakah implementasinya di CodeIgniter, dimana proses sudah menggunakan konsep MVC? Senada dengan konsep dasar, kita membutuhkan satu controller dengan dua function utama, satu function untuk meload view sejenis dengan ‘index.php’ (pada konsep dasar) dan fungsi kedua untuk meload view sejenis dengan ‘foto.php’. Dengan ide yang sama, kita akan menampilkan foto dengan id_foto tertentu.
Lalu, kita buat controller dan model yang dibutuhkan.

// model
<?php
class Model_foto extends Model{
    function get_foto($id)
    {
        $this->db->select('foto');
        $this->db->from('tb_foto');
        $this->db->where('id_foto',$id);
        $result = $this->db->get();
        if($result->num_rows()>0){
             $row = $result->row();
             return $row->foto;
        }else{
             return >false;
        }
    }
}
?>
// controller
<?php
class Welcome extends Controller {
    function Welcome()
    {

        parent::Controller();
        $this->load->model('model_foto');
    }
    function index()
    {
        $id_foto = $this->uri->segment(3);
        $data['id'] = $id_foto;
        $this->load->view('index',$data);
    }
    function tampil_foto()
    {
        $id = $this->uri->segment(3);
        $data['foto'] = $this->model_foto->get_foto($id);
        $this->load->view('foto',$data);
    }
}
?>

Selanjutnya, modifikasi ‘index.php’ seperti berikut.

<img src="<?php echo site_url("controller_foto/tampil_foto/$id")" />

Modifikasi juga ‘foto.php’ seperti berikut.

<?php
$im = imagecreatefromstring($foto);

if ($im !== false) {
    header('Content-Type: image/jpeg');
    imagejpeg($im);
    imagedestroy($im);
}

else 
{
    echo 'error';
}
?>

OK, kita selesai. Dengan menjalankan http://domain.com/index.php/controller_foto/index/23 maka kita akan melihat gambar yang kita buka dari database. Semoga bermanfaat.

Tags: blob, gambar, mySQL, PHP, query mysql, tutorial codeigniter

• Twitter • StumbleUpon • Digg • Delicious • Facebook

49 Comments

triswan 13/10/2009 at 10:06 pm

bermanfaat, thanks
anggie 19/10/2009 at 3:02 pm

sama-sama. Thx dah berkunjung.
ci_aci 05/11/2009 at 7:03 pm

Blog nya bermanfaat , sangat membantu para pencinta CI … Thanks
Chapcay 10/11/2009 at 8:25 pm

Sedot ahh.. boleh yah mas :)
anggie 11/11/2009 at 7:09 pm

Silakan…
reza 23/11/2009 at 4:17 pm

Boleh minta contaoh filenya ga?
ricky 23/11/2009 at 10:33 pm

bro mau nanya nih saya
itu code di atas cara menampilkan gambar dari database
menggunakan temporary file atau tidak?
mohon bantuannya dong cara menampilkan gambar dari database dengan menggunakan temporary file gmn caranya? dan tanpa temporary file juga gmn caranya?
thx
maaf saya newbie :)
anggie 24/11/2009 at 8:12 am

saya belum menangkap pertanyaan Anda, temporary ‘file’?
xfree 25/11/2009 at 5:50 am

kalau menampilkan video gimana ….????
anggie 25/11/2009 at 6:56 am

itu embed flash mas…
ricky 30/11/2009 at 6:45 pm

tanpa temporary file mksdnya gini
dosen gw ksh tugas ada 2 tipe cara untuk masukin data ke database
1 pake temporary, lalu di hapus
ke 2 tidak pake temporary gitu
ada yg bisa bantu?
thx bgt
anggie 30/11/2009 at 7:38 pm
Kalau dalam hal ‘memasukkan’ data ke database dengan menggunakan temporary, sepemahaman saya dengan kondisi Anda, mungkin dengan membuat tabel temporary terlebih dahulu, kemudian pindahkan ke tabel asli. Tetapi hal ini jarang saya lakukan, dan mungkin akan sangat spesifik terhadap kasus yang dialami seorang developer.
Hal yang sering terjadi adalah ‘menampilkan’ data dari database dengan menggunakan temporary. Ini biasa saya lakukan kalau dirasa query terlalu berat dan terlalu banyak join antar tabel. Biasanya saya memecah query tersebut menjadi beberapa query kemudian saya jadikan tabel temporary. Akhirnya, dari penyederhanaan tersebut saya join-kan sehingga hasilnya sama dengan query utama tadi tetapi lebih ringan.
Pada prinsipnya, teknik temporary ini sederhana saja, dasarnya adalah syntax mysql CREATE TEMPORARY TABLE
```
CREATE TEMPORARY TABLE namatabel query
// misal
CREATE TEMPORARY TABLE dosen SELECT * FROM pegawai WHERE status = 'dosen'
```
Ya, kurang lebihnya seperti itu…
ricky 30/11/2009 at 9:50 pm

ohhh
terima kasih banyak anggie
sangat membantu

oh ya saya mau nanya jg jika seperti ini :

apakah sintax di atas tidak menggunakan temporary file?

tapi yang saya binggung kan dengan tidak menggunakan temporary file bagaimna kira2 sintax nya?

terima kasih banyak :)
ricky 30/11/2009 at 9:50 pm
ricky 30/11/2009 at 9:50 pm

$query=mysql_query(“select * from unekunek”);
while($result=mysql_fetch_array($query)){
$gambar=$result['picture'];
header(“Content-type: image/gif”); // or whatever
echo $gambar;
anggie 30/11/2009 at 10:25 pm

Lho? Sebenarnya ‘temporary file’ atau temporary tabel’?
Itu dua hal yang sangat berbeda…
ricky 30/11/2009 at 11:09 pm

temporary file yang saya maksud >o<
yang tanpa temporary file "”;
benar begitu?
nobi 05/01/2010 at 10:38 am

Mo nanya, kan klo mo nampilin gambar pke syntax “header(‘Content-Type: image/jpeg’);”, nah ada cara lain ndak slain pke cara ini? saya blm paham maksudnya syntax “header” ini apa. saya mau menampilkan gambar dari mysql ke tabel, tp kan tipenya BLOB, makanya yg kluar simbol2 aneh gt. Mohon bantuannya.. mAKasih sblmnya…
anggie 07/01/2010 at 2:50 pm

sepertinya hanya itu caranya…di artikel ini pun sama, field typenya BLOB…
tagalu 30/01/2010 at 11:16 am

thx buat info-nya ya..
:D
anggie 01/02/2010 at 4:43 pm

OK…sama-sama…
Nico 05/03/2010 at 8:19 am

Setelah saya coba kok masih
error ya mas.
errornya : syntax error, unexpected ‘<' in ….
mohon bantuannya. Makasih..
anggie 24/03/2010 at 12:25 pm

Dicek dulu kodenya mas…kan ada konfirmasi di line berapa?
hikarianna 27/03/2010 at 2:00 pm

Permisi, aduh saya masih bingung ini, boleh mita file-nya gak?? tak download…. thx
Aiden 26/05/2010 at 9:54 pm

thanks….udh ngsih inspirasi…
selvy 02/06/2010 at 9:42 am

mas,saya mau tanya
apakah script diatas hanya untuk type datanya BLOB ?
kalo varchar bagaimana mas ?
saya sudah mencoba,tapi yang muncul hanya gambar kotak dengan tanda silang ditengahnya yg berarti foto belum terbaca.
itu kenapa yah ?
padahal folder fotonya sudah saya satukan dalam folder view pada CI.
terima kasih sebelumnya
anggie 02/06/2010 at 9:59 am

Sejauh yang saya tahu, untuk objek gambar biasanya disimpan dengan tipe data BLOB…

‘FOLDER FOTO’? Apkh Anda menyimpan foto di folder lalu menyimpan URL/path di tabel? Kalo iya, saya sarankan dipindahkan ke root aplikasi saja…sejajar dengan folder ‘system’
selvy 02/06/2010 at 10:46 am

iya benar mas,saya hanya menyimpan path nya saja di database,fotonya saya simpan di folder.saya sudah mencoba sejajar dengan folder system,tetapi masih tidak bisa.
oya mas, ketika saya menjalankan controller welcom,kenapa view nya tidak terbaca ya ?
error nya seperti ini “The page you requested was not found.
” itu kenapa yah mas ?
terima kasih
anggie 02/06/2010 at 11:12 am

Gunakan URL lengkap…misalkan http://domain.com/folder_foto/foto.jpg

Itu biasanya, krn penulisan URL salah, misal welcome ditulis welcom
selvy 02/06/2010 at 3:51 pm

okee saya sudah berhasil mas..
terima kasih ya mas anggie :D
levi 14/06/2010 at 12:03 pm

Mas anggie, sejauh ini saya sudah dapat menyimpan path file gambar yang diupload di database, kemudian secara bersamaan file gambar yang diupload disimpan di folder “uploads”, yang ingin saya tanyakan adakah cara untuk menampilkan gambar dari path file yang disimpan di database dan folder “uploads” ke dalam view…???
trimakasih….
anggie 15/06/2010 at 8:20 am
@levi : Anda tinggal query tabel itu, tampilkan dengan tag image biasa
```
<img src='<?php echo base_url();?>/PATH' />
```
sesuaikan dengan ‘PATH’ yang Anda simpan di database.
Gungun 21/06/2010 at 6:02 pm

Mas.. gimana caranya menampilkan seluruh data sesuai dengan id yang kita pilih. contohnya kita ingin menmapilkan data dari seluruh table yang id ny sesuai yg kta mau aja??? mohon bantuannya!!
anggie 22/06/2010 at 9:41 am

@gungun:mudah saja, itu terakomodasi dengan SQL Query…
vira 01/07/2010 at 4:05 pm

saya tertarik dgn artikel ini, tpi masih bingung dengan cara upload image ke dalam database dengan type data-nya BLOB dengan menggunakan CodeIgniter, ada contohnya? terima kasih, sebelumnya.
anggie 12/07/2010 at 3:44 pm

@vira : sebenarnya sama saja, biasanya memakai fungsi file_get_contents, untuk lebih jelasnya, cek di http://www.anyexample.com/programming/php/php_mysql_example__image_gallery_%28blob_storage%29.xml
fadil 15/10/2010 at 2:48 pm

mas ,saya menggunakan databasenya oracle, script di modelnya gmina? mohon pencerahanya….
anggie 17/10/2010 at 2:21 am

Waduh mas fadil, saya belum mempelajari Oracle tuh…cari dulu di google ya? Banyak kok artikelnya.
nazfra 25/10/2010 at 6:59 pm

mas bisa ngak file_get_contents, mengambil data dari database sendiri,.,.
nda 29/11/2010 at 9:14 am

kok saya coba nggak keluar y mas?
saya cuma mendapatkan linknya aja waktu saya buka pagenya..
gambarnya ngga muncul.. gimana itu mas?
akur 27/12/2010 at 4:20 pm

sangat membantu
adi 07/04/2011 at 5:46 pm

mas… cara nampilin image per ID gimana ya….

maksudnya gini mas…

aq udah upload image langsung ke dalam database (bukan dalam folder) tros aq mau napilin image di dalam database itu satu/satu..

“field di dalam database”

id (int)
nama (varchar)
type (varchar)
datagambar (mediumblob)

nama sudah bisa saya tampilkan semuanya berbentuk tulisan LINK, jadi ketika kita klik nama gambar, maka gambar di sebelah bisa tampil,… yang jadi masalahnya mas ketiga saya klik nama gambar tersebut di sebelah bukan gambar yang keluar, tapi tulisan yang aneh (sepertinya biner gambar yang tersimpan di dalam database) jadi saya mintak solusinya gimana mas….

oya mas, ini scrib untuk menempilkan gambarnya..

<?php
include ("conn.php");
$data=mysql_query("select * from gambar where id='$_GET[page]'");
if(mysql_num_rows($data)0) {
$isi=mysql_fetch_array(mysql_query(“select * from gambar where id=’$_GET[page]‘”));
echo ”
nama : $isi[nama]
Type Image : $isi[type]
image : $isi[datagambar]===>> disini masalahnya mas..
“;
}
?>
anggie 15/04/2011 at 2:15 pm

Lha itu di artikel saya kan ada caranya? Knp ga ditiru aja?
imam 29/04/2011 at 10:13 am

thks infonya brow..berhasill:-D
anggie 30/04/2011 at 7:56 pm

@imam : sama” bro
himawan 21/05/2011 at 10:11 am

makasih banget codingnya, tapi saya coba masih belum bisa, padahal saya copy paste, cuma id_photo saya ganti user_name…gambarnya lom muncul. apanya yg salah ya? klo pake browser IE cuma gambar silang aja, klo di mozila cuma blank…bisa ditulis lagi source codenya yg lengkap mas, termasuk database,table dan fieldnya? trima kasih
himawan 21/05/2011 at 10:15 am

jadi koding saya begini:
untuk index.php

untuk photo.php
himawan 21/05/2011 at 10:16 am

jadi koding saya begini:
untuk index.php
‘

untuk photo.php
‘
‘
himawan 21/05/2011 at 10:17 am

kog codingnya ga bisa di post ya?

Menampilkan Gambar dari Database di CodeIgniter

Related posts:

49 Comments

Leave a comment

Blog Categories

Recent Posts

Recent Comments

Pages

Blogroll

Archives

Meta