Melanjutkan pembahasan dari rangkaian tutorial PHP, pada bagian ke-50 kita akan belajar cara membuat fitur upload dan menampilkan blob image menggunakan PHP dan MySQL Show
Pembahasan ini masih berkaitan dengan tutorial kita sebelumnya Membuat Fitur Upload File dengan PHP dan MySQL Jika pada bagian tutorial anda belajar cara membuat fitur upload file dengan PHP dan MySQL tapi yang tersimpan di database hanya nama file saja, jadi sebenarnya file tersebut tidak benar-benar terupload di database, file tersebut hanya ditransfer ke webserver sedangkan yang tersimpan di database hanya nama file saja, karena kolom file hanya menggunakan tipe data varchar, karena hanya nama file saja yang disimpan Nah pada tutorial kali ini kita akan belajar bagaimana cara mengupload file ke dalam database, bukan hanya nama file saja, tetapi file tersebut akan benar-benar tersimpan di tabel database. Nah sebelum kita memulai pembahasan, ada baiknya kita membahas tentang istilah BLOB, BLOB adalah kependekan dari binary large object, jadi BLOB adalah kumpulan data biner yang disimpan dalam sebuah entitas pada database management system (DBMS). Sederhananya, BLOB adalah metode yang digunakan untuk menyimpan file - file media seperti jpg, mp3, flv, mp4, dll, ke dalam database Nah setelah mengetahui istilah BLOB, selanjutnya kita akan langsung memulai pembahasannya
Buat basis dataPada tutorial kali ini kita menggunakan xampp sebagai contoh, jadi untuk membuat database kita akan menggunakan phpmyadmin sebagai toolnya, nah langkah-langkah membuat databasenya adalah sebagai berikut 1. Pastikan layanan MySQL berjalan di panel kontrol xampp 2. Kemudian silahkan akses phpmyadmin melalui alamat http. //localhost/phpmyadmin, selanjutnya buat databasenya, pada contoh ini nama databasenya adalah db_upload_blob , lalu klik tombol Create 3. Selanjutnya silahkan buat tabel yang digunakan untuk menyimpan data, pada contoh ini kita beri nama tabel tb_image , untuk jumlah kolom isikan 6, lalu klik tombol kirim Selanjutnya silahkan buat kolom pada tabel tb_image Keterangan
setelah membuat kolom, silahkan klik tombol Simpan maka tabel tb_image akan dibuat, jika anda tidak keberatan dengan kerumitan membuat database dan tabel, anda dapat menggunakan perintah sql di bawah ini 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 -- phpMyAdmin SQL Buang -- versi 4. 8. 4 -- https. //www. phpmyadmin. bersih/ -- -- Host. 127. 0. 0. 1 -- Waktu membuat. 17 Juni 2019 pada 18. 16 -- Versi server. 10. 1. 37-MariaDB -- Versi PHP. 7. 3. 0
SET SQL_MODE = "NO_AUTO_VALUE_ON_ZERO"; SET AUTOCOMMIT = 0; MULAI TRANSAKSI; ATUR zona_waktu = "+00. 00";
/*. 40101 SET @OLD_CHARACTER_SET_CLIENT=@@CHARACTER_SET_CLIENT */; /*. 40101 SET @OLD_CHARACTER_SET_RESULTS=@@CHARACTER_SET_RESULTS */; /*. 40101 SET @OLD_COLLATION_CONNECTION=@@COLLATION_CONNECTION */; /*. 40101 SET NAMA utf8mb4 */;
-- -- Database. `db_upload_blob` -- BUAT DATABASE JIKA TIDAK ADA `db_upload_blob` DEFAULT KARAKTER ATUR latin1 KUMPULKAN latin1_swedish_ci; GUNAKAN `db_upload_blob`;
-- ------- ------------------- ------------------< /a>------------
-- -- Struktur dari tabel `tb_image` --
BUAT TABEL `tb_image` ( `image_id` int(11) TIDAK NULL, `gambar` gumpalan NOT NULL, `nama_gambar` varchar(255) TIDAK NULL, `image_type` varchar(255) TIDAK NULL, `ukuran_gambar` int(11) TIDAK NULL, `deskripsi` varchar(255) TIDAK NULL ) ENGINE=InnoDB DEFAULT CHARSET=latin1;
-- -- Indeks untuk dibuang tabel --
-- -- Indeks untuk tabel `tb_image` -- UBAH TABEL `tb_image` TAMBAHKAN UTAMA KUNCI (`image_id`);
-- -- AUTO_INCREMENT untuk tabel yang dibuang --
-- -- AUTO_INCREMENT untuk tabel `tb_image` -- UBAH TABEL `tb_image` MODIFY `image_id` int(11) TIDAK NULL AUTO_INCREMENT; KOMIT;
/*. 40101 SET CHARACTER_SET_CLIENT=@OLD_CHARACTER_SET_CLIENT */; /*. 40101 SET CHARACTER_SET_RESULTS=@OLD_CHARACTER_SET_RESULTS */; /*. 40101 ATUR COLLATION_CONNECTION=@OLD_COLLATION_CONNECTION */; Nah, dengan anggapan Anda sudah membuat databasenya, mari kita lanjutkan ke langkah selanjutnya...
Buat proyekSelanjutnya kita akan membuat file pada project ini, langkah-langkahnya adalah sebagai berikut 1. Karena pada contoh ini kita menggunakan xampp, maka kita harus membuat folder project di direktori c. /xampp/htdocs, pada contoh ini nama foldernya adalah app_upload_blob , jadi kira-kira posisi foldernya seperti ini. Selanjutnya buat beberapa file php antara lain
Ini terlihat kurang lebih seperti ini nah anggap saja teman-teman sudah membuat beberapa file php, kita akan mengisi script masing-masing file php pada pembahasan selanjutnya
Buat koneksi ke database - koneksi. phpLangkah pertama membuat koneksi ke database, silahkan buka file koneksi. php dan isikan script berikut. 1 2 3 4 5 6 7 $host = "localhost"; $user = "root"; $password = ""; $database = "db_upload_blob"; $connection = mysqli_connect($host, $pengguna, $sandi< /a>, $database); ?> Keterangan
Membuat Halaman Pengunggahan Formulir – form_upload. phpSelanjutnya silahkan buka file form_upload. php, dan isikan kodenya seperti berikut 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 sertakan('koneksi. php'); jika(disetel($_POST['tombol']))< /a> { jika(. isset($_FILES[ 'gambar']['tmp_name'])){ gema '''''''''''''''''''''''''''''''''''''''''''''''; } selain itu { $file_name = $_FILES['gambar']['nama' ]; $file_size = $_FILES['gambar']['ukuran' ]; $file_type = $_FILES['gambar']['ketik' ]; jika ($file_size < 2048000 dan ($file_type =='image/jpeg' atau $file_type == 'gambar/png')) { $image = addslashes(file_get_contents($_FILES['gambar']['tmp_name'] )); $description = $_POST['deskripsi']; mysqli_query($connection,"masukkan ke tb_image (gambar,nama_gambar,tipe_gambar,ukuran_gambar,deskripsi) nilai ('$gambar','$nama_file','$tipe_file','$ukuran_file','$deskripsi')" ); tajuk("lokasi. indeks. php"); } lain { gema '''''''''''''''''''''''''''''''''''''''''''''''; } } } ?> <html> <kepala> <judul></judul> </kepala> <tubuh> <bentuk metode="post" tindakan="" enctype="multipart/form-data"> <tabel> <tr> <td>Gambar</td> <td><input ketik="file" nama="gambar"/><< /a>/td> </tr> <tr> <td>Deskripsi</td> <td><textarea nama="deskripsi"></textarea></td> </tr> <tr> <td></td> <td><input ketik="kirim" nama="tombol"/><< /a>/td> </tr> </tabel> </bentuk> </tubuh> </html> Untuk mengakses halaman formulir unggah, Anda dapat mengakses di alamat. http. //localhost/app_upload_blob/form_upload. php Tampilannya kurang lebih sebagai berikut Keterangan
Mencoba mengunggah file gambarSelanjutnya kita akan mencoba mengupload gambar dengan menggunakan form yang telah kita buat, tampilannya kurang lebih seperti ini Gambar dan keterangan bisa disesuaikan dengan gambar yang dimiliki teman-teman, selanjutnya silahkan klik tombol Submit Setelah berhasil upload, langkah selanjutnya adalah cek database, gunakan phpmyadmin Silakan masuk ke phpmyadmin menggunakan alamat localhost/phpmyadmin dan pilih database dalam hal ini db_upload_blob , kemudian silahkan klik tabel tb_image , tampilannya kurang lebih seperti berikut. Sepertinya ada 1 record yang berisi data gambar yang berhasil kita upload
Pemrosesan pengunggahan formulirSelanjutnya akan kita bahas script untuk proses upload form, penjelasannya sebagai berikut 1 sertakan('koneksi. php'); Baris 2 (form_upload. php) kami menyertakan file koneksi. php yang telah kita buat sebelumnya, yang berisi koneksi ke database 1 jika(disetel($_POST['tombol'])) Baris 3 (form_upload. php) digunakan untuk memeriksa apakah tombol kirim dengan nama "tombol" diklik (baris 44 - form_upload. php), jika baris 3 benar maka skrip akan dijalankan pada baris 5 – 24 1 jika(. isset($_FILES[ 'gambar']['tmp_name'])){ Baris 5 (form_upload. php) digunakan untuk mengecek apakah file pada form upload sudah dipilih atau belum, jika belum dipilih maka akan menjalankan script pada baris 6 untuk menampilkan teks Select image file , jika file sudah dipilih maka akan menjalankan script pada baris 10 - 23 1 $nama_berkas = $_FILES['gambar']['nama' ]; Baris 10 (form_upload. php) digunakan untuk menangkap nama file yang diunggah dan disimpan dalam variabel $file_name 1 $ukuran_file = $_FILES['gambar']['ukuran' ]; Baris 11 (form_upload. php) digunakan untuk menangkap ukuran file yang diunggah dan disimpan dalam variabel $file_size 1 $tipe_file = $_FILES['gambar']['ketik' ]; Baris 12 (form_upload. php) digunakan untuk menangkap jenis file yang diunggah dan disimpan dalam variabel $file_type 1 jika ($ukuran_file < 2048000 dan ($file_type =='image/jpeg' atau $ file_type == 'gambar/png')) Baris 13 (form_upload. php) digunakan untuk memeriksa, apakah ukuran file (variabel $file_size) kurang dari 2 MB, dan apakah jenis filenya jpeg atau png? Jika nilainya true maka akan menjalankan baris 15 - 18, jika salah maka akan menjalankan baris 22 yang akan menampilkan teks File Size / File Type Incompatible< /a> 1 $gambar = addslash(file_get_contents($_FILES['gambar']['tmp_name'< /a>])); Baris 15 digunakan untuk mengubah file yang kita unggah menjadi data biner dan disimpan dalam variabel $image, dan nantinya data ini akan dimasukkan ke dalam kolom image pada tabel tb_image dimana tipe blob digunakan pada kolom ini 1 $deskripsi = $_POST['deskripsi']; Baris 16 digunakan untuk menangkap input form dengan nama "description" dan disimpan dalam variabel $description 1 mysqli_query($koneksi,"masukkan ke tb_image (gambar,nama_gambar,tipe_gambar,ukuran_gambar,deskripsi) nilai ('$gambar','$nama_file','$tipe_file','$ukuran_file','$deskripsi')" ); Baris 17 (upload_image. php) kita menulis perintah untuk memasukkan data ke tabel tb_image, kita menggunakan variabel yang telah menyimpan data input di bagian formulir, untuk bagian kolom blob-type image, kita menggunakan nilai variabel $image yang berisi file biner yang diunggah (baris 15 - form_upload. ) Baris 18 (upload_image. php) ketika data sudah berhasil dimasukkan ke dalam tb_image, selanjutnya akan dilakukan redirect ke halaman index. php Nah itulah fungsi dari perintah-perintah tersebut pada saat melakukan proses upload file ke database, selanjutnya kita akan belajar membuat fitur untuk menampilkan data gambar yang telah kita upload ke database
Buat file image_view. php untuk menampilkan gambar dari databaseSebelum kita menampilkan data gambar dari database, terlebih dahulu kita akan membuat file image_view. php dimana nantinya akan berisi fungsi untuk mengubah nilai pada kolom gambar dengan tipe blob, menjadi gambar yang dapat ditampilkan di browser, silahkan buka file image_view. php dan isikan script di bawah ini 1 2 3 4 5 6 7 8 9 10 11 12 13 14 sertakan('koneksi. php'); jika(disetel($_GET['image_id']))< /a> { $query = mysqli_query($koneksi,"pilih * dari tb_image di mana id_image='". $_GET['image_id']. "'"); $baris = mysqli_fetch_array($query); tajuk("Jenis konten. " . $baris["image_type"]); gema $baris["gambar"]; } sebaliknya { tajuk('lokasi. indeks. php'); } ?> Keterangan Baris 2 (image_view. php) digunakan untuk menyertakan file koneksi. php yang berisi file koneksi ke database 1 jika(disetel($_GET['image_id'])) Baris 3 (image_view. php) digunakan untuk mengecek, apakah ketika mengakses file image_view. php juga menyertakan variabel id_image dengan metode get? Jika variabel id_image ditemukan dengan metode get maka akan menjalankan script pada baris 5 - 8, namun jika tidak maka akan menjalankan baris 12 yang akan me-redirect ke halaman index. php 1 $kueri = mysqli_query($koneksi,"pilih * dari tb_image di mana id_image='".$_GET['image_id']. "'"); Baris 5 (image_view. php) kita ambil data di tabel tb_image yang image_id nya sesuai dengan variabel $id_image, hasil record datanya akan disimpan di variabel $query 1 $baris = mysqli_fetch_array($kueri); Baris 6 (image_view. php) kita akan mengubah data menjadi array menggunakan perintah mysqli_fetch_array, hasil konversi akan disimpan di variabel $row 1 tajuk("Jenis konten. " . $baris["image_type"]); Baris 7 (image_view. php) kita buat file header dengan tipe sesuai dengan tipe file yang tersimpan di database, tipe file ini diambil di kolom image_type pada table tb_imager, jadi misalkan anda mengupload file jpeg, maka file image_view akan menghasilkan mengajukan. jpg serta format file lainnya 1 gema $baris["gambar"]; Baris 8(image_view. php) kami menampilkan data biner yang disimpan di kolom gambar di tabel tb_image Jadi kurang lebih perintah ini digunakan untuk membuat file yang sudah diupload sebelumnya, dengan hasil export sesuai dengan jenis file yang diupload, jika kita mengupload file gambar dengan tipe. jpeg, ya lalu file image_view. php juga akan mengekspor file jpeg, serta file lainnya Nah, kita telah membuat file image_view. php yang digunakan untuk konversi data biner pada kolom gambar, menjadi file sesuai dengan jenis file yang kita upload, selanjutnya kita akan membuat file index. php yang digunakan untuk menampilkan data file yang telah diupload ke dalam daftar tabular
Menampilkan data yang diunggah - index. phpUntuk menampilkan daftar file berupa daftar tabel, silahkan buka file index. php dan isikan scriptnya sebagai berikut 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 sertakan('koneksi. php'); $query = mysqli_query($connection,"PILIH * DARI tb_image"); ?> <html> <kepala> <judul></judul> </kepala> <tubuh> <a href="form_upload.php">Unggah Foto</a> <tabel batas="1"> <tr> <th>Tidak</th> <th>Gambar</th> <th>Deskripsi</th> <th>Jenis</th> <th>Ukuran</th> <th>Tindakan</th> </tr> ?php $no = 1; sementara($baris = mysqli_fetch_array($query)) { ?> <tr> <td>?php echo $no++; ?> </td> <td><img src="image_view. php?id_image= ?php gema $baris['image_id']; ?> " lebar="100"/></td> <td>?php echo $baris['description'] ; ?></ td> <td>?php echo $baris['image_type'] ; ?></ td> <td>?php gema $baris['ukuran_gambar'] ; ?></ td> <td><a href="delete_image. php?id_image= ?php gema $baris['image_id']; ?> " >Hapus</a ></td> </tr> ?php } ?> </tabel> </tubuh> </html>
Untuk menjalankan silahkan akses menggunakan alamat. http. //localhost/app_upload_blob/index. php Keterangan 1 sertakan('koneksi. php'); Baris 2 (indeks. php) kami menyertakan file koneksi. php yang berisi koneksi ke database db_upload_blob 1 $kueri = mysqli_query($koneksi,"SELECT * FROM tb_image" ); Baris 3 (indeks. php) kita menulis query untuk mengambil data di tabel tb_image, dan hasil data disimpan di variabel $query 1 <a href="form_upload. php">Unggah Gambar</a> Baris 10 (indeks. php) kita buat tombol untuk mengakses form upload yaitu file form_upload. php 1 2 3 4 5 6 7 8 9 <tabel batas="1"> <tr> <th>Tidak</th> <th>Gambar</th> <th>Deskripsi</th> <th>Jenis</th> <th>Ukuran</th> <th>Tindakan</th> </tr> Baris 11 – 19 (indeks. php) kami membuat tabel dan header di atas meja 1 sementara($baris = mysqli_fetch_array($kueri)) Baris 22 (indeks. php) kita mengekstrak data pada variabel $query dengan menggunakan perintah while, sehingga kita akan mengulang beberapa data hasil query, data tersebut juga akan diubah menjadi array dengan menggunakan perintah mysqli_fetch_array, dan di setiap record kita simpan dalam variabel $baris 1 <td>?php gema $tidak++; ?> /td> Baris 26 (indeks. php) digunakan untuk menampilkan nomor dari setiap record data 1 <td><img src="image_view. php?id_image= ?php gema $baris['image_id']; ?> " lebar="100"/></td> Baris 27 (indeks. php) digunakan untuk menampilkan setiap file gambar - setiap record data, dilihat pada value atribut src kita mengakses file tersebut image_view. php dan juga mengirimkan variabel image_id dengan metode get, variabel image_id berisi image_id yang ada di setiap record data, sehingga perintah ini akan menampilkan image sesuai yang telah diupload di setiap record data. 1 <td>?php gema $baris['deskripsi'] ; ?></td>> Baris 28 (indeks. php) digunakan untuk menampilkan informasi pada setiap record data 1 <td>?php gema $baris['image_type'] ; ?></td>> Baris 29 (indeks. php) digunakan untuk menampilkan tipe image pada setiap record data 1 <td>?php gema $baris['ukuran_gambar'] ; ?></td>> Baris 30 (indeks. php) digunakan untuk menampilkan ukuran gambar pada setiap record data 1 <td><a href="delete_image. php?id_image= ?php gema $baris['image_id']; ?> " >Hapus</a ></td> Baris 31 digunakan untuk menampilkan tombol hapus yang akan mengakses file delete_image. php dan kirim variabel $id_image dengan metode get, dimana variabel image_id akan berisi image_id di setiap record data
Buat fitur hapus data - hapus_gambar. phpSelanjutnya untuk fitur menghapus data pada tabel tb_image kita akan menggunakan file delete_image. php untuk memproses data hapus, silahkan buka file delete_image. php, lalu isi scriptnya seperti berikut 1 2 3 4 5 6 7 8 9 jika(disetel($_GET['image_id']))< /a> { sertakan('koneksi. php'); $image_id = $_GET['image_id']; $query = mysqli_query($koneksi,"hapus dari tb_image di mana id_image='$id_image'"); } header('location. indeks. php'); ?> Keterangan 1 jika(disetel($_GET['image_id'])) Baris 2 (delete_image. php) digunakan untuk memeriksa apakah saat mengakses file delete_image. php dan sertakan variabel id_image dengan metode get, jika ya maka akan menjalankan perintah pada baris 4 - 6 1 sertakan('koneksi. php'); Baris 4 (delete_image. php) kami menyertakan file koneksi. php yang berisi koneksi ke database 1 $image_id = $_GET['image_id']; Baris 5 (delete_image. php) digunakan untuk menangkap nilai dari variabel image_id dengan metode get, kemudian disimpan di variabel $id_image 1 $kueri = mysqli_query($koneksi,"hapus dari tb_image di mana id_image='$id_image'"); Baris 6 (delete_image. php) kami menulis kueri untuk menghapus data di tabel tb_image dengan image_id yang sesuai dengan variabel $id_image 1 header('location. indeks. php'); Baris 8 akan dialihkan ke file index. php saat menjalankan perintah di file delete_image. php
Nah kurang lebih seperti itu sob - pembahasan tentang cara membuat fitur Upload dan Menampilkan Blob Image dengan PHP dan MySQL cukup panjang penjelasannya, silahkan ikuti penjelasan step by step script nya, jika ada apa-apa yang perlu didiskusikan, silahkan tinggalkan di kolom komentar Untuk mengunduh kode sumber, harap klik di sini Nah itu saja untuk saat ini, sampai jumpa di seri tutorial berikutnya
ANDA INGIN SERIUS BELAJAR PEMROGRAMAN PHP?Seperti yang anda ketahui bahwa saat ini skill dalam bidang pemrograman sangat dibutuhkan, salah satunya adalah pemrograman PHP Paket tutorial ini berisi video tutorial belajar pemrograman dalam bahasa indonesia, cocok sekali untuk anda yang sedang belajar pemrograman php, bahkan untuk umum sekalipun Paket Tutorial ini juga dilengkapi dengan studi kasus yang akan mempermudah pemahaman Anda dalam mempelajari pemrograman, Ayo berinvestasi untuk meningkatkan kemampuan Anda dalam menguasai Pemrograman PHP Bisakah MySQL menyimpan gambar?MySQL memiliki tipe data BLOB (binary greater object) yang dapat menampung data biner dalam jumlah besar. Tipe data BLOB sangat cocok untuk menyimpan data gambar .
Langkah demi Langkah phpMyAdmin?Langkah Pertama – proses instalasi phpMyAdmin . Silahkan download phpMyAdmin versi terbaru melalui link download phpMyAdmin Setelah itu login ke cPanel dan pilih menu “File Manager”. Buka direktori public_html lalu klik menu "Upload". Klik tombol Pilih File dan pilih file phpMyAdmin yang diunduh Langkah demi langkah mengunggah database melalui phpMyAdmin?Cara Mengimpor Database Mysql ke PhpMyAdmin . Temukan menu Database di cPanel dan pilih phpmyadmin Klik tautan Impor Kemudian akan muncul halaman untuk mengupload file. Klik Telusuri Temukan dan pilih ekstensi file. sql lalu klik buka Jika berhasil, database yang baru saja Anda impor akan muncul di daftar database Anda Langkah pertama untuk membuka phpMyAdmin di browser adalah mengetik?Cara Mengakses Localhost PHPMyAdmin
. Anda tinggal phpMyAdmin sangat mudah dilakukan. Anda cukup ketik localhost/ phpmyadmin di address bar browser . Namun, pastikan Anda sudah menginstall aplikasi XAMPP di komputer yang digunakan. |