Kamis, 24 Maret 2016

cara mengupload gambar dengan PHP

00.47  Unknown  No comments

  1. Buat sebuah database dengan nama latihan
  2. Buat sebuah tabel dengan nama gambar. Struktur tabelnya sebagai berikut :
    Screenshot_1
    1
    2
    3
    4
    5
    6
    7
    CREATE TABLE IF NOT EXISTS `gambar` (
      `id` int(11) NOT NULL AUTO_INCREMENT,
      `nama` int(100) NOT NULL,
      `ukuran` int(11) NOT NULL,
      `tipe` varchar(20) NOT NULL,
      PRIMARY KEY (`id`)
    ) ENGINE=InnoDB DEFAULT CHARSET=latin1 AUTO_INCREMENT=1 ;
STEP 3 – BUAT KONEKSI DATABASE
Pada step ini, kita akan membuat file koneksi.php yang berfungsi untuk menghubungkan dengan database MySQL. Berikut ini kodenya :
1
2
3
4
5
6
7
<?php
$host = "localhost"; // Nama hostnya
$user = "root"; // Username
$pass = ""; // Password (Isi jika menggunakan password)
mysql_connect($host, $user, $pass); // Koneksi ke MySQL
mysql_select_db("latihan"); // Memilih database
?>
STEP 4 – BUAT FORM UPLOAD
Pada step ini, kita akan membuat sebuah file dengan nama fom.php yang berfungsi sebagai tampilan form uploadnya. Berikut ini tampilan dan kodenya :
Screenshot_2
1
2
3
4
5
6
7
8
9
10
11
12
13
<html>
<head>
    <title>Form Upload Gambar</title>
</head>
<body>
<h1>Form Upload Gambar</h1>
<!-- Arahkan actionnya ke file upload.php -->
<form method="post" enctype="multipart/form-data" action="upload.php">
    <input type="file" name="gambar">
    <input type="submit" value="Upload">
</form>
</body>
</html>
STEP 5 – BUAT PROSES UPLOAD
Sekarang, kita akan membuat file upload.php yang berfungsi untuk memproses upload gambarnya. Berikut ini kodenya :
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
<?php
// Load file koneksi.php
include "koneksi.php";
// Ambil Data yang Dikirim dari Form
$nama_file = $_FILES['gambar']['name'];
$ukuran_file = $_FILES['gambar']['size'];
$tipe_file = $_FILES['gambar']['type'];
$tmp_file = $_FILES['gambar']['tmp_name'];
// Set path folder tempat menyimpan gambarnya
$path = "images/".$nama_file;
if($tipe_file == "image/jpeg" || $tipe_file == "image/png"){ // Cek apakah tipe file yang diupload adalah JPG / JPEG / PNG
    // Jika tipe file yang diupload JPG / JPEG / PNG, lakukan :
    if($ukuran_file <= 1000000){ // Cek apakah ukuran file yang diupload kurang dari sama dengan 1MB
        // Jika ukuran file kurang dari sama dengan 1MB, lakukan :
        // Proses upload
        if(move_uploaded_file($tmp_file, $path)){ // Cek apakah gambar berhasil diupload atau tidak
            // Jika gambar berhasil diupload, Lakukan :
            // Proses simpan ke Database
            $query = "INSERT INTO gambar(nama,ukuran,tipe) VALUES('".$nama_file."','".$ukuran_file."','".$tipe_file."')";
            $sql = mysql_query($query); // Eksekusi/ Jalankan query dari variabel $query
             
            if($sql){ // Cek jika proses simpan ke database sukses atau tidak
                // Jika Sukses, Lakukan :
                header("location: index.php"); // Redirectke halaman index.php
            }else{
                // Jika Gagal, Lakukan :
                echo "Maaf, Terjadi kesalahan saat mencoba untuk menyimpan data ke database.";
                echo "<br><a href='form.php'>Kembali Ke Form</a>";
            }
        }else{
            // Jika gambar gagal diupload, Lakukan :
            echo "Maaf, Gambar gagal untuk diupload.";
            echo "<br><a href='form.php'>Kembali Ke Form</a>";
        }
    }else{
        // Jika ukuran file lebih dari 1MB, lakukan :
        echo "Maaf, Ukuran gambar yang diupload tidak boleh lebih dari 1MB";
        echo "<br><a href='form.php'>Kembali Ke Form</a>";
    }
}else{
    // Jika tipe file yang diupload bukan JPG / JPEG / PNG, lakukan :
    echo "Maaf, Tipe gambar yang diupload harus JPG / JPEG / PNG.";
    echo "<br><a href='form.php'>Kembali Ke Form</a>";
}
?>
Berikut penjelasan dari kode diatas :
$_FILES[‘gambar‘][‘name’];
Untuk mengambil nama file yang diupload.
$_FILES[‘gambar‘][‘size’]; 
Untuk mengambil ukuran file yang diupload dalam bytes.
$_FILES[‘gambar’][‘type’]; 
Untuk mengambil tipe file yang diupload.
$_FILES[‘gambar‘][‘tmp_name’];
Untuk mengambil url/path folder tempat penyimpanan sementara file yang diupload, sebelum dipindahkan ke folder images.
NOTE : Pada kode diatas, terdapat tulisan gambar. tulisan tersebut harus sama dengan nama input type=”file” yang ada pada form (form.php).
if($tipe_file == “image/jpeg” || $tipe_file == “image/png”){
Untuk mengecek apakah file/gambar yang diupload tipenya jpg atau png
if($ukuran_file <= 1000000){
Untuk mengecek apakah file/gambar yang diupload ukurannya kurang dari sama dengan 1MB. Pada kode tersebut saya menetapkan <= 100000, 100000 itu sama dengan 100000 bytes = 1MB.
move_uploaded_file($tmp_file, $path)
kode inilah yang berfungsi untuk memindahkan gambar / file yang telah diupload dari folder tmp ke dalam folder di website kita (pada catatan ini kita upload gambarnya ke folder images). Struktur dasar penulisan kodenya adalah :
1
2
3
4
5
6
7
move_uploaded_file($tmp, $path);
/*
Keterangan:
- $tmp : diisi dengan sumber file yang diupload
- $path : diisi dengan url/path folder tempat menyimpan gambar. contoh: images/gambar.jpg
*/
$query = “INSERT INTO gambar(nama,ukuran,tipe) VALUES(‘”.$nama_file.”‘,'”.$ukuran_file.”‘,'”.$tipe_file.”‘)”;
Query SQL untuk menyimpan data gambar(nama, ukuran, dan tipe gambar) ke dalam tabel gambar pada database latihan.
STEP 6 – BUAT VIEW DATA
Terakhir, kita akan membuat file index.php yang berfungsi untuk menampilkan data gambar(nama, ukuran, dan tipe gambar) dari database ke halaman website kita. Berikut ini tampilan dan kodenya :
Screenshot_3
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
<html>
<head>
    <title>Data Gambar</title>
</head>
<body>
<h1>Data Gambar</h1><hr>
<a href="form.php">Tambah Gambar</a><br><br>
<table border="1" cellpadding="8">
<tr>
    <th>Gambar</th>
    <th>Nama File</th>
    <th>Ukuran File</th>
    <th>Tipe File</th>
</tr>
<?php
// Load file koneksi.php
include "koneksi.php";
$query = "SELECT * FROM gambar"; // Tampilkan semua data gambar
$sql = mysql_query($query); // Eksekusi/Jalankan query dari variabel $query
$row = mysql_num_rows($sql); // Ambil jumlah data dari hasil eksekusi $sql
if($row > 0){ // Jika jumlah data lebih dari 0 (Berarti jika data ada)
    while($data = mysql_fetch_array($sql)){ // Ambila semua data dari hasil eksekusi $sql
        echo "<tr>";
        echo "<td><img src='images/".$data['nama']."' width='100' height='100'></td>";
        echo "<td>".$data['nama']."</td>";
        echo "<td>".$data['ukuran']."</td>";
        echo "<td>".$data['tipe']."</td>";
        echo "</tr>";
    }
}else{ // Jika data tidak ada
    echo "<tr><td colspan='4'>Data tidak ada</td></tr>";
}
?>
</table>
</body>
</html>
Berikut penjelasan dari kode diatas :
$sql = mysql_query($query);
Untuk mengeksekusi / menjalankan query sql. struktur dasar penulisannya adalah sebagai berikut :
1
2
3
4
5
6
mysql_query($query);
/*
Keterangan :
- $query : diisi dengan Query SQL yang diinginkan
*/
mysql_num_rows($sql);
Untuk mengambil jumlah data dari hasil eksekusi suatu query sql. Struktur dasar penulisannya adalah sebagai berikut :
1
2
3
4
5
6
mysql_num_rows($sql);
/*
Keterangan :
- $sql : diisi dengan hasil eksekusi query sql(mysql_query())
*/
mysql_fetch_array($sql);
Untuk mengambil data dari hasil eksekusi suatu query sql. Struktur dasar penulisannya adalah sebagai berikut :
1
2
3
4
5
6
mysql_num_rows($sql);
/*
Keterangan :
- $sql : diisi dengan hasil eksekusi query sql(mysql_query())
*/
Kode diatas saya simpan didalam looping while berfungsi untuk melakukan proses perulangan sampai data terkahir dengan tujuan agar kita bisa menampilkan datanya satu per satu.
echo “<td><img src=’images/”.$data[‘nama’].”‘ width=’100′ height=’100’></td>”;
echo “<td>”.$data[‘nama’].”</td>”;
echo “<td>”.$data[‘ukuran’].”</td>”;
echo “<td>”.$data[‘tipe’].”</td>”;
Pada kode diatas terdapat variabel $data digunakan untuk mengambil isi dari field-field yang ada pada tabel gambar di databas latihan. Pada kode diatas juga ada kode yang saya beri warna merah, kode tersebut harus sama dengan nama field yang ada pada tabel gambar.
Akhirnya selesai juga. Sekian untuk catatan kali ini. Semoga catatan ini bisa bermanfaat. Terimakasih.

Posted in:

0 komentar:

Posting Komentar

Twitter Delicious Facebook Digg Stumbleupon Favorites More