oleh Vincy. Terakhir diubah pada 1 Februari 2022.
Upload file merupakan komponen penting dalam membangun website. Artikel ini akan membantu Anda untuk mengimplementasikan fitur upload file ke server dengan PHP dan database MySQL.
Contoh kasus penggunaan di mana unggahan file mungkin diperlukan di situs web,
Mari kita lihat cara mengkodekan unggahan file PHP untuk sebuah situs web. Anda dapat membagi artikel ini menjadi beberapa bagian berikut.
- Unggah file PHP – Contoh cepat.
- Unggah file – validasi sisi server.
- Unggah file ke server dengan database.
- Unggah file sebagai gumpalan ke database.
Unggah file PHP – Contoh cepat
<?php
if (isset($_FILES['upload_file'])) {
move_uploaded_file($_FILES["upload_file"]["tmp_name"], $_FILES["upload_file"]["name"]);
}
?>
<form name="from_file_upload" action="" method="post"
enctype="multipart/form-data">
<div class="input-row">
<input type="file" name="upload_file" accept=".jpg,.jpeg,.png">
</div>
<input type="submit" name="upload" value="Upload File">
</form>
Contoh cepat ini menunjukkan kode sederhana untuk mencapai unggahan file PHP. Ini memiliki formulir HTML untuk memilih file yang akan diunggah. Biarkan form dengan atribut berikut untuk mendukung upload file.
- metode=posting
- enctype=multipart/form-data
Dengan memilih file, itu akan berada di direktori sementara. $_FILES[“upload_file”][“tmp_name”] memiliki jalan itu. PHP move_uploaded_file() mengunggah file dari jalur ini ke target yang ditentukan.
$_FILES[‘<file-input-name>’][‘tmp_name’] | Jalur sementara unggah file PHP |
$_FILES[‘<file-input-name>’][‘name’] | Nama file dengan ekstensi |
$_FILES[‘<file-input-name>’][‘type’] | Jenis file MIME. Misal: gambar/jpeg |
$_FILES[‘<file-input-name>’][‘size’] | Ukuran file (dalam byte) |
$_FILES[‘<file-input-name>’][‘error’] | Kode kesalahan unggah file jika ada |
$_FILES[‘<file-input-name>’][‘full_path’] | Jalur lengkap seperti yang dikirim oleh browser |
Formulir memungkinkan unggahan multi-file dengan memiliki array input file.
Konfigurasi unggah file PHP
Pastikan lingkungan server memiliki pengaturan yang cukup untuk mengunggah file.
- Periksa dengan file php.ini jika file_uploads = aktif. Sebagian besar, itu akan aktif secara default.
Arahan opsional lainnya untuk mengubah pengaturan default
- upload_tmp_dir – untuk mengubah default sistem.
- upload_max_filesize – melebihi batas default.
- max_file_uploads – untuk melanggar batas unggah file per-permintaan.
- post_max_size – untuk memecah ukuran data POST.
- max_input_time – untuk mengatur batas dalam hitungan detik untuk mengurai data permintaan.
- max_execution_time – waktu dalam detik untuk menjalankan skrip unggah file.
- memory_limit – untuk mengatur batas memori dalam byte yang akan dialokasikan.
Unggah file – validasi sisi server
Ketika pengunggahan file masuk ke dalam gambar, maka harus ada validasi yang tepat. Ini akan mencegah respons tak terduga dari server selama unggahan file PHP.
Kode ini memeriksa 4 kondisi berikut sebelum memindahkan file ke jalur target. Ini memvalidasi,
- Jika file tidak kosong.
- Jika file tersebut belum ada di target.
- Jika jenis file adalah salah satu ekstensi yang diizinkan.
- Jika file tersebut dalam batas.
Ini hanya menampilkan skrip PHP untuk memvalidasi file yang diunggah. Bentuk HTML akan sama dengan contoh cepat.
file-upload-validasi.php
<?php if (isset($_POST["upload"])) { // Validate if not empty if (!empty($_FILES['upload_file']["name"])) { $fileName = $_FILES["upload_file"]["name"]; $isValidFile = true; // Validate if file already exists if (file_exists($fileName)) { echo "<span>File already exists.</span>"; $isValidFile = false; } // Validate file extension $allowedFileType = array( 'jpg', 'jpeg', 'png' ); $fileExtension = strtolower(pathinfo($fileName, PATHINFO_EXTENSION)); if (! in_array($fileExtension, $allowedFileType)) { echo "<span>File is not supported. Upload only <b>" . implode(", ", $allowedFileType) . "</b> files.</span>"; $isValidFile = false; } // Validate file size if ($_FILES["upload_file"]["size"] > 200000) { echo "<span>File is too large to upload.</span>"; $isValidFile = 0; } if ($isValidFile) { move_uploaded_file($_FILES["upload_file"]["tmp_name"], $fileName); } } else { echo "No files have been chosen."; } } ?>
Unggah file ke server dengan database
Bagian ini memberikan contoh unggahan file PHP lengkap. Itu dengan fitur tambah, edit, pratinjau, daftar gambar. Add/edit memungkinkan pengguna untuk memilih file gambar untuk diunggah ke server.
Halaman beranda menampilkan daftar gambar yang diunggah dengan kontrol tindakan edit, hapus. Layar edit akan menampilkan pratinjau file yang ada.
Unggah file PHP dan tambahkan baris baru ke database
Kode ini untuk menampilkan formulir HTML dengan opsi unggah file. Ini memungkinkan pengguna untuk memilih file yang akan diunggah ke server.
Kode PHP menerima data file yang diunggah dalam $_FILES. Dalam kode ini, ia memeriksa validasi file dasar untuk memastikan keunikannya.
Kemudian, ia memanggil fungsi untuk mengunggah dan menyisipkan jalur file ke database.
Itu uploadImage
menjalankan PHP move_upload_files() untuk meletakkan file yang diunggah ke dalam direktori.
Itu insertImage
memanggil penangan basis data untuk menyisipkan jalur yang diunggah ke basis data.
image-upload-list-preview-edit/insert.php
<?php
namespace Phppot;
use PhppotDataSource;
require_once __DIR__ . '/lib/ImageModel.php';
$imageModel = new ImageModel();
if (isset($_POST['send'])) {
if (file_exists('../uploads/' . $_FILES['image']['name'])) {
$fileName = $_FILES['image']['name'];
$_SESSION['message'] = $fileName . " file already exists.";
} else {
$result = $imageModel->uploadImage();
$id = $imageModel->insertImage($result);
if (! empty($id)) {
$_SESSION['message'] = "Image added to the server and database.";
} else {
$_SESSION['message'] = "Image upload incomplete.";
}
}
header('Location: index.php');
}
?>
<html>
<head>
<link href="https://phppot.com/php/php-file-upload/assets/style.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div class="form-container">
<h1>Add new image</h1>
<form action="" method="post" name="frm-add"
enctype="multipart/form-data" onsubmit="return imageValidation()">
<div Class="input-row">
<input type="file" name="image" id="input-file" class="input-file"
accept=".jpg,.jpeg,.png">
</div>
<input type="submit" name="send" value="Submit" class="btn-link"> <span
id="message"></span>
</div>
</form>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"
integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4="
crossorigin="anonymous"></script>
<script src="assets/validate.js"></script>
</body>
</html>
Daftar gambar yang diunggah dengan tindakan edit, hapus
Ini adalah ekstensi dari contoh unggahan file PHP biasa. Ini membantu untuk membangun antarmuka pustaka file dalam suatu aplikasi.
Halaman ini membaca gambar yang diunggah dari database menggunakan PHP. Itu getAllImages
fungsi mengembalikan data jalur gambar dalam format array.
Halaman daftar mengulangi larik ini dan mencantumkan hasilnya. Dan itu menautkan catatan dengan kontrol edit, hapus yang sesuai.
image-upload-list-preview-edit/index.php
<?php
namespace Phppot;
use PhppotDataSource;
require_once __DIR__ . '/lib/ImageModel.php';
$imageModel = new ImageModel();
?>
<html>
<head>
<title>Display all records from Database</title>
<link href="https://phppot.com/php/php-file-upload/assets/style.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div class="image-datatable-container">
<a href="insert.php" class="btn-link">Add Image</a>
<table class="image-datatable" width="100%">
<tr>
<th width="80%">Image</th>
<th>Action</th>
</tr>
<?php
$result = $imageModel->getAllImages();
?>
<tr>
<?php
if (! empty($result)) {
foreach ($result as $row) {
?>
<td><img src="<?php echo $row["image"]?>"
class="profile-photo" alt="photo"><?php echo $row["name"]?>
</td>
<td><a href="update.php?id=<?php echo $row['id']; ?>"
class="btn-action">Edit</a> <a
onclick="confirmDelete(<?php echo $row['id']; ?>)"
class="btn-action">Delete</a></td>
</tr>
<?php
}
}
?>
</table>
</div>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"
integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4="
crossorigin="anonymous"></script>
<script type="text/javascript" src="assets/validate.js"></script>
</body>
</html>
Edit formulir dengan pratinjau file
Ini menunjukkan formulir edit dengan pratinjau file yang diunggah. Ini memungkinkan penggantian file dengan mengunggah yang baru.
Tindakan formulir melewati id catatan untuk memperbarui jalur file dalam database.
Kode PHP memanggil updateImage
dengan hasil unggahan dan id rekaman.
image-upload-list-preview-edit/update.php
<?php
namespace Phppot;
use PhppotDataSource;
require_once __DIR__ . '/lib/ImageModel.php';
$imageModel = new ImageModel();
if (isset($_POST["submit"])) {
$result = $imageModel->uploadImage();
$id = $imageModel->updateImage($result, $_GET["id"]);
}
$result = $imageModel->selectImageById($_GET["id"]);
?>
<html>
<head>
<link href="https://phppot.com/php/php-file-upload/assets/style.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div class="form-container">
<h1>View/Edit image</h1>
<form action="?id=<?php echo $result[0]['id']; ?>" method="post"
name="frm-edit" enctype="multipart/form-data"
onsubmit="return imageValidation()">
<div class="preview-container">
<img src="<?php echo $result[0]["image"]?>" class="img-preview"
alt="photo">
<div>Name: <?php echo $result[0]["name"]?></div>
</div>
<div Class="input-row">
<input type="file" name="image" id="input-file" class="input-file"
accept=".jpg,.jpeg,.png" value="">
</div>
<button type="submit" name="submit" class="btn-link">Save</button>
<span id="message"></span>
</div>
</form>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"
integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4="
crossorigin="anonymous"></script>
<script src="assets/validate.js"></script>
</body>
</html>
Tindakan hapus dipicu setelah konfirmasi pengguna. Ini menghapus jalur file dari database.
hapus.php
<?php
namespace Phppot;
use PhppotDataSource;
require_once __DIR__ . '/lib/ImageModel.php';
$imageModel = new ImageModel();
$id=$_REQUEST['id'];
$result = $imageModel->deleteImageById($id);
header("Location: index.php");
?>
Kelas model PHP untuk mengunggah file
Ini berisi fungsi untuk mengunggah file ke direktori dan ke database. Fungsi unggah file PHP menetapkan target untuk meletakkan file yang diunggah.
Ini memproses array PHP $_FILES untuk mendapatkan data file. Ini mempersiapkan kueri database dengan menggunakan parameter file untuk melakukan baca, tulis.
imageModel.php
<?php
namespace Phppot;
use PhppotDataSource;
class ImageModel
{
private $conn;
function __construct()
{
require_once 'DataSource.php';
$this->conn = new DataSource();
}
function getAllImages()
{
$sqlSelect = "SELECT * FROM tbl_image";
$result = $this->conn->select($sqlSelect);
return $result;
}
function uploadImage()
{
$imagePath = "uploads/" . $_FILES["image"]["name"];
$name = $_FILES["image"]["name"];
$result = move_uploaded_file($_FILES["image"]["tmp_name"], $imagePath);
$output = array(
$name,
$imagePath
);
return $output;
}
public function insertImage($imageData)
{
print_r($imageData);
$query = "INSERT INTO tbl_image(name,image) VALUES(?,?)";
$paramType="ss";
$paramValue = array(
$imageData[0],
$imageData[1]
);
$id = $this->conn->insert($query, $paramType, $paramValue);
return $id;
}
public function selectImageById($id)
{
$sql = "select * from tbl_image where id=? ";
$paramType="i";
$paramValue = array(
$id
);
$result = $this->conn->select($sql, $paramType, $paramValue);
return $result;
}
public function updateImage($imageData, $id)
{
$query = "UPDATE tbl_image SET name=?, image=? WHERE id=?";
$paramType="ssi";
$paramValue = array(
$imageData[0],
$imageData[1],
$_GET["id"]
);
$id = $this->conn->execute($query, $paramType, $paramValue);
return $id;
}
/*
* public function execute($query, $paramType = "", $paramArray = array())
* {
* $id = $this->conn->prepare($query);
*
* if (! empty($paramType) && ! empty($paramArray)) {
* $this->bindQueryParams($id, $paramType, $paramArray);
* }
* $id->execute();
* }
*/
function deleteImageById($id)
{
$query = "DELETE FROM tbl_image WHERE id=$id";
$result = $this->conn->select($query);
return $result;
}
}
?>
Unggah gambar sebagai gumpalan ke database
Meskipun contoh ini datang sebagai yang terakhir, saya kira itu akan sangat berguna bagi sebagian besar dari Anda pembaca.
Mengunggah file sebagai gumpalan ke database membantu memindahkan data biner file ke database target. Contoh ini mencapai ini dengan sangat sedikit baris kode.
Mengunggah gumpalan file gambar menggunakan sisipan basis data
File ini menerima file yang diunggah dari PHP $_FILES. Ini mengekstrak data biner file dengan menggunakan fungsi PHP file_get_contents().
Kemudian, itu mengikat tipe file MIME dan gumpalan ke pernyataan kueri yang disiapkan.
Kode menentukan tipe parameter sebagai ‘b’ untuk data gumpalan file. Pertama, itu mengikat nilai NULL untuk bidang gumpalan.
Kemudian, ia mengirimkan konten file menggunakan fungsi send_long_data(). Fungsi ini menentukan indeks parameter kueri dan gumpalan file untuk mengikatnya ke pernyataan.
file-blob-upload/index.php
<?php if (!empty($_POST["submit"])) { if (is_uploaded_file($_FILES['userImage']['tmp_name'])) { $conn = mysqli_connect('localhost', 'root', '', 'blog_eg'); $imgData = file_get_contents($_FILES['userImage']['tmp_name']); $imageProperties = getimageSize($_FILES['userImage']['tmp_name']); $null = NULL; $sql = "INSERT INTO tbl_image_data(image_type ,image_data) VALUES(?, ?)"; $stmt = $conn->prepare($sql); $stmt->bind_param("sb", $imageProperties['mime'], $null); $stmt->send_long_data(1, $imgData); $stmt->execute(); $currentId = $stmt->insert_id; } } ?> <html> <head> <link href="https://phppot.com/php/php-file-upload/assets/style.css" rel="stylesheet" type="text/css" /> </head> <body> <div class="form-container"> <h1>Upload Image Blob</h1> <form action="" method="post" name="frm-edit" enctype="multipart/form-data" > <?php if(!empty($currentId)) { ?> <div class="preview-container"> <img src="image-view.php?image_id=<?php echo $currentId; ?>" class="img-preview" alt="photo"> </div> <?php } ?> <div Class="input-row"> <input type="file" name="userImage" id="input-file" class="input-file" accept=".jpg,.jpeg,.png" value="" required> </div> <input type="submit" name="submit" class="btn-link" value="Save"> <span id="message"></span> </div> </form> </body> </html>
File ini untuk membaca gumpalan dari database dan menampilkan pratinjau. Ini akan ditentukan dalam atribut ‘src’ tag dengan id gambar yang sesuai.
file-blob-upload/image-view.php
<?php $conn = mysqli_connect('localhost', 'root', '', 'blog_eg'); if(isset($_GET['image_id'])) { $sql = "SELECT image_type,image_data FROM tbl_image_data WHERE id = ?"; $stmt = $conn->prepare($sql); $stmt->bind_param("i", $_GET['image_id']); $stmt->execute(); $result = $stmt->get_result(); $row = $result->fetch_array(); header("Content-type: " . $row["image_type"]); echo $row["image_data"]; } mysqli_close($conn); ?>
Kesimpulan
Jadi, kami telah melihat artikel terperinci untuk mempelajari pengunggahan file. Saya bersumpah kami telah membahas sebagian besar contoh pada unggahan file PHP.
Kami melihat kode di semua tingkatan dari yang sederhana hingga komponen pengunggahan file yang rumit. Saya harap, ini akan membantu untuk mengetahui bagaimana membangun ini sendiri.
Unduh
Kembali ke Atas
Source link