How To Upload And Insert Image Into Mysql Database Using Php And Html

Với mọi trang web đều phải có chức năng upload image lên đưa Database với mục đích lưu trữ hình ảnh. Bài viết này sẽ hướng dẫn bạn cách upload ảnh bằng PHP và MySQL với những đoạn code dễ hiểu đọc xong bạn hoàn toàn có thể làm được.

Readmore : Code hiển thị nội dung bài viết trong PHP

How To Upload And Insert Image Into Mysql Database Using Php And Html

Hướng dẫn tạo upload file image PHP và MySQL

Bước 1: Bạn sẽ khởi tạo 4 file như trong hình

Upload file trong PHP

Trong đó:

photo: dùng để lưu hình ảnh

connect.php; kết nối tới Database

style; thêm CSS để trang trí form

upload.php; file upload ảnh

xuly.php; xử lý ảnh sau khi upload

Tạo 1 cơ sở dữ liệu Database tên là ‘upload_image‘ => sau đó tạo bảng Table tên là images bằng paste đoạn MySQL vào Database

CREATE TABLE IF NOT EXISTS `images` (
`id` int(11) NOT NULL AUTO_INCREMENT,
`image` varchar(100) NOT NULL,
PRIMARY KEY (`id`)
) ENGINE=MyISAM DEFAULT CHARSET=utf8 AUTO_INCREMENT=1 ;
tao-file-upload-anh-bang-php-mysql-1
upload-file-trong-php-2

Bước 2: Tiếp theo bạn sẽ tạo một file upload.php

<!DOCTYPE html> 
<html> 
<head> 
<title>Image Upload</title> 
<link rel="stylesheet" href="style.css"> 
</head> 
<body> 
<div id="content"> 
<form method="POST" action="upload.php" enctype="multipart/form-data"> 
<input type="hidden" name="size" value="1000000"> 
<input type="file" name="image"> 
<button type="submit" name="upload">POST</button>
<?php require "xuly.php"?>
</form> 
</div> 
</body> 
</html>

Bước 3: Tiếp theo sẽ tạo một file là xuly.php

<?php
include 'connect.php';
if (isset($_POST['upload'])) {
$errors= array();
$file_name = $_FILES['image']['name'];
$file_size = $_FILES['image']['size'];
$file_tmp = $_FILES['image']['tmp_name'];
$file_type = $_FILES['image']['type'];
$file_ext=strtolower(end(explode('.',$_FILES['image']['name'])));
   
$expensions= array("jpeg","jpg","png");
   
if(in_array($file_ext,$expensions)=== false){
$errors[]="Chỉ hỗ trợ upload file JPEG hoặc PNG.";
}
   
if($file_size > 2097152) {
$errors[]='Kích thước file không được lớn hơn 2MB';
}
$image = $_FILES['image']['name'];
$target = "photo/".basename($image);
$sql = "INSERT INTO images (image) VALUES ('$image')";
mysqli_query($conn, $sql);
if (move_uploaded_file($_FILES['image']['tmp_name'], $target)) {
echo '<script language="javascript">alert("Đã upload thành công!");</script>';
}else{
echo '<script language="javascript">alert("Đã upload thất bại!");</script>';
}
}
$result = mysqli_query($conn, "SELECT * FROM images");
?>
<!DOCTYPE html>
<html>
<head>
<title>Image Upload</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<div id="content">
   
<?php
while ($row = mysqli_fetch_array($result)) {
echo "<div id='img_div'>";
echo "<img src='photo/".$row['image']."' >";
echo "</div>";
}
?>
</div>
</body>
</html>

Bước 4: Tạo file connect.php để kết nối database

<?php
$host ="localhost";
$uname = "root";
$pwd = '';
$db_name = "upload_image";
$conn = mysqli_connect($host, $uname, $pwd, $db_name);
mysqli_set_charset($conn, 'UTF8');
?>

Bước 5: Thêm file style.css

#content{
margin: 20px auto;
border: 1px solid #cbcbcb;
overflow: auto;
padding: 20px;
}
form{
margin: 20px auto;
}
form div{
margin-top: 5px;
}
#img_div{
padding: 5px;
border: 1px solid #cbcbcb;
float: left
}
#img_div:after{
content: "";
display: block;
clear: both;
}
#img_div img{
float: left;
margin: 5px;
width: 400px;
height: auto;
}


Sau khi tạo xong 4 file: thư mục photo trong máy tính, upload.php, xuly.phpconnect.php, style.css bạn thử chạy vào xem kết quả như thế nào.

Kết luận: Để upload hình ảnh lên Database bằng PHP và MySQL không khó phải không nào, với bài hướng dẫn với các bước đơn giản trên hi vọng sẽ giúp bạn học thêm một chút kiến thức về lập trình PHP.

Quách Quỳnh

Xin chào bạn mình là Quách Quỳnh! Chủ nhân của blog Quachquynh.com. Tại đây bạn sẽ tìm thấy những kiến thức về Wordpress, Seo và lập trình.

2 thoughts on “How To Upload And Insert Image Into Mysql Database Using Php And Html”

  1. Tuy thông báo lỗi nhưng nó vẫn cho upload file rar hay zip lên ad ơi!
    Có phải do if kiểm tra riêng lẻ không ad?

Leave a Reply

Your email address will not be published. Required fields are marked *