Membuat Web Simple Upload dan Download File dengan PHP MySQL

Membuat Web Simple Upload dan Download File dengan PHP MySQL. Oke, pada kesempatan kali ini saya akan membuat sebuah website untuk Upload dan Download File dengan PHP dan MySQL. Dimana nantinya User bisa melakukan Upload file di menu Upload, dan kemudian file yang di Upload bisa di Download pada menu Download.

Beberapa fitur yang akan dibuat adalah:

User bisa Upload
User bisa Download
Pembatasan pada ektensi file yang bisa di Upload, hanya bisa Upload file dengan ekstensi doc, docx, xls, xlsx, ppt, pptx, pdf, rar, zip (bisa dirubah)
Pembatasan file size 1 MB (bisa dirubah)

Dan berikut ini adalah screenshot dari file-file yang akan dibuat

Membuat Web Simple Upload dan Download File dengan PHP MySQL

Oke, langsung saja mulai ke tutorialnya.

Pertama seperti biasanya buat dahulu sebuah database di phpMyAdmin. Disini saya membuat database dengan nama tutorial, kemudian Dumping kode SQL di bawah ini

Kode SQL

MySQL

1

2

3

4

5

6

7

8

9

10

DROP TABLE IF EXISTS `download`;

CREATE TABLE `download` (

  `id` int(11) NOT NULL auto_increment,

  `tanggal_upload` date NOT NULL,

  `nama_file` varchar(100) NOT NULL,

  `tipe_file` varchar(10) NOT NULL,

  `ukuran_file` varchar(20) NOT NULL,

  `file` varchar(255) NOT NULL,

  PRIMARY KEY  (`id`)

);

Atau bisa juga dengan meng-Import file database.sql yang sudah disertakan pada file download di bawah halaman ini.

Database dan Table sudah dibuat, sekarang kita buat dahulu script untuk melakukan koneksi ke database.

Buat file baru dan beri nama config.php, dan kodenya seperti di bawah ini:

config.php

PHP

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

<?php

//koneksi ke database

mysql_connect("localhost", "root", "root");

mysql_select_db("tutorial");

//fungsi untuk mengkonversi size file

function formatBytes($bytes, $precision = 2) { 

    $units = array('B', 'KB', 'MB', 'GB', 'TB'); 

    $bytes = max($bytes, 0); 

    $pow = floor(($bytes ? log($bytes) : 0) / log(1024)); 

    $pow = min($pow, count($units) - 1); 

    $bytes /= pow(1024, $pow); 

    return round($bytes, $precision) . ' ' . $units[$pow]; 

} 

?>

Nah, dari kode di atas kita sudah bisa melakukan koneksi ke database, jangan lupa mengedit detail koneksi ke database milik anda sendiri.

Dan juga dari kode di atas, dibuat sebuah fungsi untuk mengkonversi file size dari file yang di upload nantinya.

Sekarang saatnya buat file yang pertama yaitu index.php. dan berikut ini isi kodenya:

index.php

PHP

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

<!DOCTYPE html>

<html>

<head>

 <title>Simple Upload dan Download File</title>

    <link rel="stylesheet" type="text/css" href="style.css">

</head>

<body>

 <div id="container">

     <div id="header">

      <h1>Simple Upload dan Download File</h1>

         <span>Dibuat oleh Pino @tutorialweb.net</span>

        </div>

        <div id="menu">

         <a href="index.php" class="active">Home</a>

            <a href="upload.php">Upload</a>

            <a href="download.php">Download</a>

        </div>

        <div id="content">

         <h2>Home</h2>

            <p>Selamat Datang!</p>

            <p>Web Simple Download dan Upload File ini dibuat oleh <strong>TUTORIALWEB.NET</strong>. Anda bisa mempublikasikan ulang, atau merubah Source Code web ini. Jangan lupa untuk mengunjungi <a href="http://www.tutorialweb.net/" target="_blank">TUTORIALWEB.NET</a> untuk tutorial-tutorial pemrograman lainnya.</p>

        </div>

    </div>

</body>

</html>

Dalam file index.php ini tidak ada yang spesial, hanya salam perkenalan saja

Selanjutnya buat file baru dengan nama upload.php, dan isi kodenya seperti di bawah ini

upload.php

PHP

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

66

67

68

69

70

71

72

73

74

75

<!DOCTYPE html>

<html>

<head>

 <title>Simple Upload dan Download File</title>

    <link rel="stylesheet" type="text/css" href="style.css">

</head>

<body>

 <div id="container">

     <div id="header">

      <h1>Simple Upload dan Download File</h1>

         <span>Dibuat oleh Pino @tutorialweb.net</span>

        </div>

        <div id="menu">

         <a href="index.php">Home</a>

            <a href="upload.php" class="active">Upload</a>

            <a href="download.php">Download</a>

        </div>

        <div id="content">

         <h2>Upload</h2>

            <p>Upload file Anda dengan melengkapi form di bawah ini. File yang bisa di Upload hanya file dengan ekstensi <b>.doc, .docx, .xls, .xlsx, .ppt, .pptx, .pdf, .rar, .zip</b> dan besar file (file size) maksimal hanya 1 MB.</p>

            <?php

   include('config.php');

   if($_POST['upload']){

    $allowed_ext = array('doc', 'docx', 'xls', 'xlsx', 'ppt', 'pptx', 'pdf', 'rar', 'zip');

    $file_name  = $_FILES['file']['name'];

    $file_ext  = strtolower(end(explode('.', $file_name)));

    $file_size  = $_FILES['file']['size'];

    $file_tmp  = $_FILES['file']['tmp_name'];

    $nama   = $_POST['nama'];

    $tgl   = date("Y-m-d");

    if(in_array($file_ext, $allowed_ext) === true){

     if($file_size < 1044070){

      $lokasi = 'files/'.$nama.'.'.$file_ext;

      move_uploaded_file($file_tmp, $lokasi);

      $in = mysql_query("INSERT INTO download VALUES(NULL, '$tgl', '$nama', '$file_ext', '$file_size', '$lokasi')");

      if($in){

       echo '<div class="ok">SUCCESS: File berhasil di Upload!</div>';

      }else{

       echo '<div class="error">ERROR: Gagal upload file!</div>';

      }

     }else{

      echo '<div class="error">ERROR: Besar ukuran file (file size) maksimal 1 Mb!</div>';

     }

    }else{

     echo '<div class="error">ERROR: Ekstensi file tidak di izinkan!</div>';

    }

   }

   ?>

            <p>

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

            <table width="100%" align="center" border="0" bgcolor="#eee" cellpadding="2" cellspacing="0">

             <tr>

                 <td width="40%" align="right"><b>Nama File</b></td><td><b>:</b></td><td><input type="text" name="nama" size="40" required /></td>

                </tr>

                <tr>

                 <td width="40%" align="right"><b>Pilih File</b></td><td><b>:</b></td><td><input type="file" name="file" required /></td>

                </tr>

                <tr>

                 <td>&nbsp;</td><td>&nbsp;</td><td><input type="submit" name="upload" value="Upload" /></td>

                </tr>

            </table>

            </form>

            </p>

        </div>

    </div>

</body>

</html>

File ini akan membuat Form untuk Upload File dan juga Proses untuk Upload File.

Berikut ini sedikit penjelasan Kode dari file upload.php

Line	Penjelasan Kode
57-69	Membuat form yang berisi inputan judul, inputan pemilihan file, dan tombol untuk upload
26	meng-include-kan file config.php yang berisikan koneksi ke database
28	membuat array yang berisikan file ber-ekstensi apa saja yang bisa di upload
29-32	mendeklarasikan beberapa properti dari inputan file, seperti nama file, file ekstensi, file size, dan file tmp
34-35	mendeklarasikan judul dan tanggal sekarang
37	pengecekan apakah file ekstensi ada dalam array ekstensi yang di izinkan, jika ada (true) maka berhasil
38	pengecekan apakah file size tidak lebih besar dari 1044070 (1Mb), jika lebih kecil, maka berhasil
39	menentukan lokasi menyimpanan/upload file, yaitu file akan di upload didalam folder files, dan merubah nama file yang diupload menjadi judul yang di inputkan tadi.
40	melakukan proses upload dengan fungsi move_uploaded_file()
41	melakukan query ke database untuk melakukan perintah INSERT data
43	pesan jika file berhasil di upload dan data tersimpan ke database

Dan sekarang buat file lagi dan beri nama download.php, dan isi kodenya seperti di bawah ini

download.php

PHP

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

<!DOCTYPE html>

<html>

<head>

 <title>Simple Upload dan Download File</title>

    <link rel="stylesheet" type="text/css" href="style.css">

</head>

<body>

 <div id="container">

     <div id="header">

      <h1>Simple Upload dan Download File</h1>

         <span>Dibuat oleh Pino @tutorialweb.net</span>

        </div>

        <div id="menu">

         <a href="index.php">Home</a>

            <a href="upload.php">Upload</a>

            <a href="download.php" class="active">Download</a>

        </div>

        <div id="content">

         <h2>Download</h2>

            <p>Silahkan download file yang sudah di Upload di website ini. Untuk men-Download Anda bisa mengklik Judul file yang di inginkan.</p>

            <p>

            <table class="table" width="100%" cellpadding="3" cellspacing="0">

             <tr>

                 <th width="30">No.</th>

                    <th width="80">Tgl. Upload</th>

                    <th>Nama File</th>

                    <th width="70">Tipe</th>

                    <th width="70">Ukuran</th>

                </tr>

                <?php

    include('config.php');

    $sql = mysql_query("SELECT * FROM download ORDER BY id DESC");

    if(mysql_num_rows($sql) > 0){

     $no = 1;

     while($data = mysql_fetch_assoc($sql)){

      echo '

      <tr bgcolor="#fff">

       <td align="center">'.$no.'</td>

       <td align="center">'.$data['tanggal_upload'].'</td>

       <td><a href="'.$data['file'].'">'.$data['nama_file'].'</a></td>

       <td align="center">'.$data['tipe_file'].'</td>

       <td align="center">'.formatBytes($data['ukuran_file']).'</td>

      </tr>

      ';

      $no++;

     }

    }else{

     echo '

     <tr bgcolor="#fff">

      <td align="center" colspan="4" align="center">Tidak ada data!</td>

     </tr>

     ';

    }

    ?>

            </table>

            </p>

        </div>

    </div>

</body>

</html>

Dalam file download ini akan menampilkan sebuah Table yang berisi file-file yang telah di upload, dan akan ada link untuk men-Download file tersebut.

Berikut ini sedikit penjelasan dari file download.php

Line	Penjelasan Kode
26-59	membuat table seperti biasa
35	meng-include-kan file config.php yang berisi kode untuk melakukan koneksi ke database
36	melakukan query ke database dengan perintah SELECT dari table download dan di urutkan berdasarkan id yang paling besar
37	jika query diatas menghasilkan nilai > 0 (terdapat data di dalam tabel) maka akan melakukan perintah dibawahnya
38	membuat variabel untuk nomor urut
39	melakukan perulangan while dari query SELECT pada line 37
40-49	menampilkan data dari perulangan yang mengambil dari table download
51-57	jika query pada line 37 menghasilkan nilai 0 (tidak ada data di database) maka akan menuliskan “pesan tidak ada data”

Untuk mempercantik tampilannya, di bawah ini adalah kode CSS-nya, dan simpan dengan nama style.css.

style.css

CSS

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

66

67

68

69

70

71

72

73

74

75

@charset "utf-8";

/* CSS Document */

body {

 font-family:Tahoma, Geneva, sans-serif;

 font-size:12px;

 background-color:#eee;

 margin:0;

 padding:0;

}

h1, h2, h3 {

 margin:0;

 padding:0;

}

#container {

 width:500px;

 margin:20px auto;

 padding:10px;

 background-color:#fff;

 box-shadow:0px 0px 3px #000;

}

#header {

 text-align:center;

}

#menu {

 text-align:center;

 margin:15px 0px;

 border-top:1px solid #CCC;

 border-bottom:1px solid #CCC;

}

 #menu a {

  display:inline-block;

  padding:5px 10px;

  text-decoration:none;

  color:#000;

  font-weight:bold;

 }

  #menu a:hover {

   background-color:#CCC;

  }

  #menu a.active {

   background-color:#CCC;

  }

.table, th, td {

 border-collapse:collapse;

 border:1px solid #ccc;

}

 .table th {

  background-color:#CCC;

 }

.error {

 border:1px solid #FF8080;

 background-color:#FFCECE;

 padding:3px;

 margin:5px 0px;

 text-align:center;

}

.ok {

 border:1px solid #80FF80;

 background-color:#CFC;

 padding:3px;

 margin:5px 0px;

 text-align:center;

}

Nah, sudah selesai. Jangan lupa za untuk Rate, Like dan Share artikel ini. Kalau mau download file yang sudah jadi bisa di bawah ini.

Download & Demo:
• •

Password:

Cari Blog Ini

Sofyan Yusuf © 2019

Membuat Web Simple Upload dan Download File dengan PHP MySQL

Update tutorial terbaru

Komentar

Posting Komentar

Postingan populer dari blog ini

Login, Session, dan Logout

Cara Membuat File Setup / Installer Aplikasi Sendiri dengan Inno Setup Compiler