Tải lên tệp phía máy chủ có thể dễ dàng thực hiện bằng PHP. Có nhiều cách khác nhau để tải hình ảnh lên máy chủ và hiển thị hình ảnh trên trang web. Nói chung, trong một ứng dụng web động, hình ảnh đã tải lên được lưu trữ trong một thư mục của máy chủ và tên tệp được chèn vào cơ sở dữ liệu. Sau đó, hình ảnh được lấy từ máy chủ dựa trên tên tệp được lưu trữ trong cơ sở dữ liệu và hiển thị trên trang web
Hình ảnh có thể được tải trực tiếp lên cơ sở dữ liệu mà không cần lưu trữ trên máy chủ. Nhưng nó sẽ tăng kích thước cơ sở dữ liệu và thời gian tải trang web. Vì vậy, bạn nên tải hình ảnh lên máy chủ và lưu trữ tên tệp trong cơ sở dữ liệu. Trong hướng dẫn này, chúng tôi sẽ chỉ cho bạn toàn bộ quy trình để tải lên và lưu trữ tệp hình ảnh trong cơ sở dữ liệu MySQL bằng PHP
Mã ví dụ minh họa quy trình triển khai chức năng tải tệp lên trong ứng dụng web và chức năng sau sẽ được triển khai
- Biểu mẫu HTML để tải lên hình ảnh
- Tải hình ảnh lên máy chủ bằng PHP
- Lưu trữ tên tệp trong cơ sở dữ liệu bằng PHP và MySQL
- Lấy hình ảnh từ cơ sở dữ liệu và hiển thị trong trang web
Tạo bảng cơ sở dữ liệu
Để lưu trữ tên tệp hình ảnh, một bảng cần được tạo trong cơ sở dữ liệu. SQL sau đây tạo một bảng images
với một số trường cơ bản trong cơ sở dữ liệu MySQL
CREATE TABLE `images` [ `id` int[11] NOT NULL AUTO_INCREMENT, `file_name` varchar[255] COLLATE utf8_unicode_ci NOT NULL, `uploaded_on` datetime NOT NULL, `status` enum['1','0'] COLLATE utf8_unicode_ci NOT NULL DEFAULT '1', PRIMARY KEY [`id`] ] ENGINE=InnoDB DEFAULT CHARSET=utf8 COLLATE=utf8_unicode_ci;
Cấu hình cơ sở dữ liệu [dbConfig. php]
Tệp
// Database configuration0 được sử dụng để kết nối và chọn cơ sở dữ liệu MySQL. Chỉ định tên máy chủ cơ sở dữ liệu [
$dbHost = "localhost";
$dbUsername = "root";
$dbPassword = "root";
$dbName = "codexworld";// Create database connection
$db = new mysqli[$dbHost, $dbUsername, $dbPassword, $dbName];// Check connection
if [$db->connect_error] {
die["Connection failed: " . $db->connect_error];
}
?>
// Database configuration1], tên người dùng [
$dbHost = "localhost";
$dbUsername = "root";
$dbPassword = "root";
$dbName = "codexworld";// Create database connection
$db = new mysqli[$dbHost, $dbUsername, $dbPassword, $dbName];// Check connection
if [$db->connect_error] {
die["Connection failed: " . $db->connect_error];
}
?>
// Database configuration2], mật khẩu [
$dbHost = "localhost";
$dbUsername = "root";
$dbPassword = "root";
$dbName = "codexworld";// Create database connection
$db = new mysqli[$dbHost, $dbUsername, $dbPassword, $dbName];// Check connection
if [$db->connect_error] {
die["Connection failed: " . $db->connect_error];
}
?>
// Database configuration3] và tên [
$dbHost = "localhost";
$dbUsername = "root";
$dbPassword = "root";
$dbName = "codexworld";// Create database connection
$db = new mysqli[$dbHost, $dbUsername, $dbPassword, $dbName];// Check connection
if [$db->connect_error] {
die["Connection failed: " . $db->connect_error];
}
?>
// Database configuration0] theo thông tin đăng nhập MySQL của bạn
$dbHost = "localhost";
$dbUsername = "root";
$dbPassword = "root";
$dbName = "codexworld";// Create database connection
$db = new mysqli[$dbHost, $dbUsername, $dbPassword, $dbName];// Check connection
if [$db->connect_error] {
die["Connection failed: " . $db->connect_error];
}
?>
// Database configuration
$dbHost = "localhost";
$dbUsername = "root";
$dbPassword = "root";
$dbName = "codexworld";// Create database connection
$db = new mysqli[$dbHost, $dbUsername, $dbPassword, $dbName];// Check connection
if [$db->connect_error] {
die["Connection failed: " . $db->connect_error];
}
?>
Tải lên biểu mẫu HTML
Tạo biểu mẫu HTML để cho phép người dùng chọn tệp họ muốn tải lên. Bảo đảm
- phương pháp = "đăng"
- enctype="multipart/form-data"
Ngoài ra, đảm bảo thẻ chứa thuộc tính
// Database configuration1
$dbHost = "localhost";
$dbUsername = "root";
$dbPassword = "root";
$dbName = "codexworld";// Create database connection
$db = new mysqli[$dbHost, $dbUsername, $dbPassword, $dbName];// Check connection
if [$db->connect_error] {
die["Connection failed: " . $db->connect_error];
}
?>
Select Image File to Upload:
Form upload file sẽ được gửi tới file
// Database configuration2 để upload ảnh lên server
$dbHost = "localhost";
$dbUsername = "root";
$dbPassword = "root";
$dbName = "codexworld";// Create database connection
$db = new mysqli[$dbHost, $dbUsername, $dbPassword, $dbName];// Check connection
if [$db->connect_error] {
die["Connection failed: " . $db->connect_error];
}
?>
Upload File lên Server và lưu trữ trong Database [upload. php]
Tệp
// Database configuration2 xử lý chức năng tải lên hình ảnh và hiển thị thông báo trạng thái cho người dùng
$dbHost = "localhost";
$dbUsername = "root";
$dbPassword = "root";
$dbName = "codexworld";// Create database connection
$db = new mysqli[$dbHost, $dbUsername, $dbPassword, $dbName];// Check connection
if [$db->connect_error] {
die["Connection failed: " . $db->connect_error];
}
?>
- Bao gồm tệp cấu hình cơ sở dữ liệu để kết nối và chọn cơ sở dữ liệu MySQL
- Lấy phần mở rộng tệp bằng hàm pathinfo[] trong PHP và xác thực định dạng tệp để kiểm tra xem người dùng có chọn tệp hình ảnh hay không
- Tải hình ảnh lên máy chủ bằng hàm move_uploaded_file[] trong PHP
- Chèn tên tệp hình ảnh vào cơ sở dữ liệu MySQL bằng PHP
- Trạng thái tải lên sẽ được hiển thị cho người dùng
// Include the database configuration file
include 'dbConfig.php';
$statusMsg = '';// File upload path
$targetDir = "uploads/";
$fileName = basename[$_FILES["file"]["name"]];
$targetFilePath = $targetDir . $fileName;
$fileType = pathinfo[$targetFilePath,PATHINFO_EXTENSION];if[isset[$_POST["submit"]] && !empty[$_FILES["file"]["name"]]]{
// Allow certain file formats
$allowTypes = array['jpg','png','jpeg','gif','pdf'];
if[in_array[$fileType, $allowTypes]]{
// Upload file to server
if[move_uploaded_file[$_FILES["file"]["tmp_name"], $targetFilePath]]{
// Insert image file name into database
$insert = $db->query["INSERT into images [file_name, uploaded_on] VALUES ['".$fileName."', NOW[]]"];
if[$insert]{
$statusMsg = "The file ".$fileName. " has been uploaded successfully.";
}else{
$statusMsg = "File upload failed, please try again.";
}
}else{
$statusMsg = "Sorry, there was an error uploading your file.";
}
}else{
$statusMsg = 'Sorry, only JPG, JPEG, PNG, GIF, & PDF files are allowed to upload.';
}
}else{
$statusMsg = 'Please select a file to upload.';
}// Display status message
echo $statusMsg;
?>
Hiển thị hình ảnh từ cơ sở dữ liệu
Bây giờ chúng ta sẽ lấy hình ảnh đã tải lên từ máy chủ dựa trên tên tệp trong cơ sở dữ liệu và hiển thị hình ảnh trong trang web
- Bao gồm tệp cấu hình cơ sở dữ liệu
- Tìm nạp hình ảnh từ cơ sở dữ liệu MySQL bằng PHP
- Liệt kê hình ảnh từ thư mục tải lên của máy chủ
// Include the database configuration file
include 'dbConfig.php';// Get images from the database
$query = $db->query["SELECT * FROM images ORDER BY uploaded_on DESC"];if[$query->num_rows > 0]{
while[$row = $query->fetch_assoc[]]{
$imageURL = 'uploads/'.$row["file_name"];
?>}else{ ?>No image[s] found...
Tạo Thư viện ảnh động bằng jQuery, PHP & MySQL
Sự kết luận
Trên đây chúng tôi đã chỉ ra cách hiệu quả nhất để triển khai chức năng upload ảnh lên website. Bạn có thể dễ dàng mở rộng chức năng tải tệp lên theo yêu cầu của mình. Để cung cấp giao diện người dùng tốt hơn, bạn có thể tích hợp chức năng Tải lên tệp Ajax
Tải lên nhiều hình ảnh bằng jQuery, Ajax và PHP
Bạn có muốn nhận trợ giúp triển khai hay sửa đổi hoặc nâng cao chức năng của tập lệnh này không?