Upload dan Download File Menggunakan PHP MySQL

//lh4.googleusercontent.com/-eAXyxy2JJKA/AAAAAAAAAAI/AAAAAAAAGS4/OHgzqHzCvtQ/s512-c/photo.jpg
September 29, 2018




Kali ini kami akan share bagaimana membuat aplikasi yang sangat sederhana yaitu membuat aplikasi upload dan download file menggunakan PHP MySQL. Aplikasi ini sangat cocok bagi kalian yang suka mengupload dan mendownload file yang ada di database kalian.

Aplikasi di atas dibuat dengan ajax bootsrap dan data tabel yang membuat tampilan lebih bagus dan elegan. Ada beberapa hal yang mesti kalian perssiapkan dalam membuat aplikasi di atas.

Berikut beberapa nama file yang mesti kalian persiapkan, Pada setiap file mempunyai fungsi yang berbeda dan akan kami jelaskan pada setiap filenya.

index.php
config.php
upload.php
download.php

Buat folder dengan nama files, folder ini berfungsi sebagai penyimpanan file yang di upload.

Tetapi sebelum itu buat database dengan nama system kemudian masukkan struktur database dibawah ini.

 SET SQL_MODE = "NO_AUTO_VALUE_ON_ZERO";
SET AUTOCOMMIT = 0;
START TRANSACTION;
SET time_zone = "+00:00";

CREATE TABLE `file` (
  `file_id` int(11) NOT NULL,
  `name` varchar(200) NOT NULL,
  `file` varchar(500) NOT NULL
) ENGINE=InnoDB DEFAULT CHARSET=latin1;
--
-- Indexes for table `file`
--
ALTER TABLE `file`
  ADD PRIMARY KEY (`file_id`);
--
-- AUTO_INCREMENT for table `file`
--
ALTER TABLE `file`
  MODIFY `file_id` int(11) NOT NULL AUTO_INCREMENT, AUTO_INCREMENT=7;
COMMIT;
 

index.php
File ini berfungsi sebagai form untuk mengupload dan menampilkan file database.

 <!DOCTYPE html>
<html>
<head>
  <title>Upload dan Download File</title>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" />
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
  
  <!--Script CSS-->
  <link type="text/css" href='https://cdn.datatables.net/1.10.16/css/jquery.dataTables.min.css' rel='stylesheet'>
  <link type="text/css" href='https://cdn.datatables.net/responsive/2.2.1/css/responsive.dataTables.min.css' rel='stylesheet'>
  <link type="text/css" href='https://cdn.datatables.net/buttons/1.5.1/css/buttons.dataTables.min.css' rel='stylesheet'>
  
</head>
<body>
  <br /><br />
  <div class="container">
   <nav class="navbar navbar-inverse">
    <div class="container-fluid">
     <div class="navbar-header">
      <a class="navbar-brand" href="https://www.tutorialswb.com">TutorialsWB</a>
    </div>
  </div>
</nav>
<br />
<br />
<form class="form-inline" method="POST" action="upload.php" enctype="multipart/form-data">
 <input class="form-control" type="file" name="upload"/>
 <button type="submit" class="btn btn-success form-control" name="submit"><span class="glyphicon glyphicon-upload"></span> Upload</button>
</form>
<br /><br />
<div class="form-group">

  <table id="example" class="display responsive nowrap" style="width:100%">
    <thead>
      <tr>  
        <th>No</th>
        <th>File Name</th>
        <th>Action</th>
      </tr>
    </thead>
    <tbody class="alert-success">
      <?php
      require 'config.php';
      $row = $conn->query("SELECT * FROM `file`") or die(mysqli_error());
      while($fetch = $row->fetch_array()){
       ?>
       <tr>
        <?php 
        $name = explode('/', $fetch['file']);
        ?>
        <td><?php echo $fetch['file_id']?></td>
        <td><?php echo $fetch['name']?></td>
        <td><a href="download.php?file=<?php echo $name[1]?>" class="btn btn-primary"><span class="glyphicon glyphicon-download"></span> Download</a></td>

      </tr>
      <?php
    }
    ?>
  </tbody>
</table>

</div>


<!--Script Javascript-->
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://cdn.datatables.net/1.10.16/js/jquery.dataTables.min.js"></script>
<script src="https://cdn.datatables.net/responsive/2.2.1/js/dataTables.responsive.min.js"></script>
<script src="https://cdn.datatables.net/buttons/1.5.1/js/dataTables.buttons.min.js"></script>
<script src="https://cdn.datatables.net/buttons/1.5.1/js/buttons.colVis.min.js"></script>
<script>
 $(document).ready(function() {
  $('#example').DataTable( {
    dom: 'Bfrtip',
    buttons: [
    'colvis'
    ]
  } );
} );
</script>
</body>
</html> 

config.php
File ini berisi script untuk koneksi kedatabase.

 <?php
$conn = new mysqli('localhost', 'root', '', 'system');
if($conn->connect_error){
 die("Fatal Error: Can't connect to database: ". $conn->connect_error);
}
?> 

upload.php
File ini berisi script untuk mengupload file kedalam database.

 <?php
require_once 'config.php';

if(ISSET($_POST['submit'])){
 if($_FILES['upload']['name'] != "") {
  $file = $_FILES['upload'];
  
  $file_name = $file['name'];
  $file_temp = $file['tmp_name'];
  $name = explode('.', $file_name);
  $path = "files/".$file_name;
  
  $conn->query("INSERT INTO `file` VALUES('', '$name[0]', '$path')") or die(mysqli_error());
  
  move_uploaded_file($file_temp, $path);
  header("location:index.php");
  
 }else{
  echo "<script>alert('Required Field!')</script>";
  echo "<script>window.location='index.php'</script>";
 }
}
?> 

download.php
File ini berisi script untuk mengunduh file.

 <?php
if(ISSET($_REQUEST['file'])){
 $file = $_REQUEST['file'];
 
  //header("Cache-Control: public");
  //header("Content-Description: File Transfer");
 header("Content-Disposition: attachment; filename=".basename($file));
 header("Content-Type: application/octet-stream;");
  //header("Content-Transfer-Encoding: binary");
 readfile("files/".$file);
}
?> 

Silahkan kalian cek demonya langsung pada button demo dibawah ini, kalian juga bisa mendownload file di atas.

DEMO           DOWNLOAD

Sekian share kali ini semoga apa yang kalian share bermanfaat bagi anda, jika kalian belum paham silahkan tinggalkan komentar dan mulai berdiskusi dengan kami.


Related Post

SUBSCRIBE TO OUR NEWSLETTER

closed