Làm cách nào để tải lên nhiều hình ảnh trong PHP?

Trong phần này, chúng ta sẽ tìm hiểu về tải lên nhiều hình ảnh trong PHP. Chúng tôi sẽ sử dụng Ajax và jQuery để làm điều này. Đôi khi dự án của chúng tôi cần tùy chọn tải lên nhiều hình ảnh. Nếu chúng ta không có kiến ​​thức về PHP, ví dụ này sẽ rất hữu ích cho chúng ta. Ví dụ này sẽ hiển thị các hình ảnh đã chọn. Để tải lên nhiều tệp, chúng tôi sẽ tạo hai tệp, như sau

Tệp chỉ mục sẽ hữu ích để viết mã thiết kế. Trong tệp này, chúng tôi cũng sẽ viết mã của jQuery Ajax. Khi chúng ta chọn ảnh và bấm vào nút gửi, toàn bộ ảnh sẽ được tải lên thư mục có tên là "media". Vì vậy, trước tiên chúng ta phải tạo thư mục phương tiện. Chúng tôi sẽ sử dụng thư mục gốc của chúng tôi để tạo này. Ví dụ sau đây cho thấy cách nhỏ và nhanh nhất để tải lên nhiều hình ảnh

Mã chính để hiển thị hình ảnh đã chọn như sau

Ví dụ đầy đủ để hiển thị tải lên nhiều hình ảnh do người dùng chọn được mô tả như sau. Trong ví dụ dưới đây của chúng tôi, chúng tôi sẽ sử dụng hai tệp có tên là chỉ mục. php và tải lên tệp. php, được hiển thị như sau

Ví dụ

Mục lục. php

cập nhật dử liệu. php

Bây giờ mã trên của chúng tôi đã sẵn sàng và chúng tôi có thể chạy nó. Khi chúng tôi chạy cái này, đầu ra sau sẽ được tạo

Tôi gần 65% có thể làm việc trong phòng trưng bày của mình như tôi muốn. Ai đó có thể vui lòng cho tôi biết làm thế nào tôi có thể tải nhiều hình ảnh lên thư viện của mình không?

Đây là mã

Mã biểu mẫu quản trị đơn giản

    



        Category: 
        treeremoval
        treetrimming
        treebracing
        stumpgrinding
        firewood
        cleanup
        




    Caption: 




Image to upload: 






        Category: 
        treeremoval
        treetrimming
        treebracing
        stumpgrinding
        firewood
        cleanup
        




    Caption: 




Image to upload: 






    

người tải lên. mã php

    
     Add another image
";


}
else
{
 echo "There was an error uploading the file {$_FILES['image']['name'][$i]}, please try again!
";
    }
} // close your foreach
?>

Tôi đã thử sao chép mã biểu mẫu nhưng không được. Ai đó có thể giúp tôi việc này không?

Đây là hướng dẫn tải lên hình ảnh và nhiều tệp PHP 8 toàn diện, tìm hiểu cách lưu trữ tệp hình ảnh trong cơ sở dữ liệu MySQL cùng với một số xác thực tải lên tệp cần thiết

Tải lên tệp trong PHP là tính năng phổ biến nhất mà hầu hết mọi nhà phát triển PHP đều phải xây dựng. Như chúng ta có thể biết, chức năng tải lên tệp được yêu cầu trong hầu hết mọi ứng dụng web. Có thể là Instagram, Twitter, Facebook hoặc Tumblr, ngày nay người dùng không thể sống mà không tải tệp lên

Trong hướng dẫn này, chúng ta sẽ tìm hiểu cách tải lên một hoặc nhiều tệp hoặc hình ảnh trong PHP 8 và cách lưu hình ảnh trong cơ sở dữ liệu MySQL. Chúng tôi cũng sẽ đề cập đến việc xác thực tệp tải lên cần thiết bằng cách sử dụng các phương thức PHP và API

Thông thường, người dùng có xu hướng tải lên một hình ảnh duy nhất và lưu trữ hình ảnh trên cơ sở dữ liệu bằng tên tệp. Bằng cách này, chúng tôi cũng có thể tìm nạp hình ảnh hoặc tệp từ cơ sở dữ liệu bằng tên tệp. Đôi khi, dựa trên một số yêu cầu cụ thể, chúng tôi phải tải lên nhiều hình ảnh hoặc tệp trên máy chủ

Mục lục

1. Mục tiêu hướng dẫn
2. Cấu trúc tệp dự án
3. Cấu hình bảng trong cơ sở dữ liệu
4. Kết nối Dự án PHP với MySQL
5. Tạo biểu mẫu tải tệp lên
6. Hiển thị Xem trước Nhiều Tệp
7. Tải lên nhiều tệp trong PHP có xác thực
8. Phần kết luận

Mục tiêu hướng dẫn

Đến cuối hướng dẫn này, bạn sẽ có thể hiểu các khái niệm sau

• Tạo biểu mẫu HTML để chọn nhiều hình ảnh và tệp
• Hiển thị xem trước nhiều hình ảnh trước khi gửi đến máy chủ
• Thực hiện xác thực cần thiết trước khi tải lên
• Lưu tệp trong thư mục cục bộ và lưu trữ đường dẫn tệp đã tải lên trong cơ sở dữ liệu

Cấu trúc tệp dự án

Chúng tôi đang theo dõi các tệp và cấu trúc thư mục bên dưới để tải lên nhiều tệp trong PHP 8

\-- php-multiple-file-upload
  |-- config
      |--- database.php
  |-- uploads
      |--- image-1
      |--- image-2
      |--- image-3
  |-- file-upload.php
  |-- index.php

Cấu hình bảng trong cơ sở dữ liệu

Bạn có thể sử dụng MAMP hoặc XAMPP để tạo cơ sở dữ liệu và bảng để tải lên nhiều tệp trong PHP

Tạo cơ sở dữ liệu `database_name`

Tạo `table_name` bên trong cơ sở dữ liệu

Chạy tập lệnh SQL sau từ bảng điều khiển PHPMyAdmin để tạo bảng người dùng và tập lệnh này sẽ có giá trị id, hình ảnh và data_time trong cơ sở dữ liệu MySQL

CREATE TABLE `user` (
  `id` int(11) NOT NULL,
  `images` varchar(255) NOT NULL,
  `date_time` datetime NOT NULL
) ENGINE=InnoDB DEFAULT CHARSET=utf8;

Kết nối Dự án PHP với MySQL

Để tạo kết nối giữa cơ sở dữ liệu và dự án PHP, chúng tôi đã xác định kết nối cơ sở dữ liệu bằng phương pháp PDO và giữ cấu hình db trong config/database. tập tin php

    $hostname = "localhost";
    $username = "root";
    $password = "";
    try {
        $conn = new PDO("mysql:host=$hostname;dbname=php_crud", $username, $password);
        // set the PDO error mode to exception
        $conn->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
        //echo "Database connected successfully";
    } catch(PDOException $e) {
        echo "Database connection failed: " . $e->getMessage();
    }
?>

Tạo biểu mẫu tải lên tệp bằng HTML và Bootstrap 4

Để tạo biểu mẫu tải lên tệp, chúng tôi đang sử dụng Bootstrap 4, hãy thêm liên kết Bootstrap CDN vào giữa thẻ đầu

<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css">

Tạo một biểu mẫu tải lên tệp đơn giản bằng cách sử dụng thẻ biểu mẫu HTML, thẻ biểu mẫu phải chứa các thẻ method=”post” và enctype=”multipart/form-data”

Để làm cho nó tương tác với API PHP, hãy xác định thẻ name=”fileUpload[]” với trường biểu mẫu đầu vào. Theo mặc định, trường tệp HTML cho phép một tệp tải lên. Chuyển nhiều thẻ với trường nhập tệp để chọn nhiều tệp cùng một lúc

<form action="" method="post" enctype="multipart/form-data" class="mb-3">
  <div class="custom-file">
    <input type="file" name="fileUpload[]" class="custom-file-input" id="chooseFile" multiple>
    <label class="custom-file-label" for="chooseFile">Select filelabel>
  div>
  <button type="submit" name="submit" class="btn btn-primary btn-block mt-4">
    Upload Files
  button>
form>

Hiển thị Xem trước Nhiều Tệp

Người dùng phải biết mình sẽ đặt tệp nào trên máy chủ, tạo div html bên trong biểu mẫu tải tệp lên

<div class="imgGallery">
  
div>

Chúng ta cần đặt liên kết jQuery ở chân trang và cũng đặt mã JavaScript sau để hiển thị bản xem trước của tất cả các tệp do người dùng chọn

Tải lên nhiều tệp trong PHP 8 có xác thực

Chúng tôi xác định mã tải lên nhiều tệp trong tệp tải lên. php và thông báo cho người dùng về hoạt động tải lên tệp

 
    // Database
    include 'config/database.php'; 
    if(isset($_POST['submit'])){
        
        $uploadsDir = "uploads/";
        $allowedFileType = array('jpg','png','jpeg');
        
        // Velidate if files exist
        if (!empty(array_filter($_FILES['fileUpload']['name']))) {
            
            // Loop through file items
            foreach($_FILES['fileUpload']['name'] as $id=>$val){
                // Get files upload path
                $fileName        = $_FILES['fileUpload']['name'][$id];
                $tempLocation    = $_FILES['fileUpload']['tmp_name'][$id];
                $targetFilePath  = $uploadsDir . $fileName;
                $fileType        = strtolower(pathinfo($targetFilePath, PATHINFO_EXTENSION));
                $uploadDate      = date('Y-m-d H:i:s');
                $uploadOk = 1;
                if(in_array($fileType, $allowedFileType)){
                        if(move_uploaded_file($tempLocation, $targetFilePath)){
                            $sqlVal = "('".$fileName."', '".$uploadDate."')";
                        } else {
                            $response = array(
                                "status" => "alert-danger",
                                "message" => "File coud not be uploaded."
                            );
                        }
                    
                } else {
                    $response = array(
                        "status" => "alert-danger",
                        "message" => "Only .jpg, .jpeg and .png file formats allowed."
                    );
                }
                // Add into MySQL database
                if(!empty($sqlVal)) {
                    $insert = $conn->query("INSERT INTO user (images, date_time) VALUES $sqlVal");
                    if($insert) {
                        $response = array(
                            "status" => "alert-success",
                            "message" => "Files successfully uploaded."
                        );
                    } else {
                        $response = array(
                            "status" => "alert-danger",
                            "message" => "Files coudn't be uploaded due to database error."
                        );
                    }
                }
            }
        } else {
            // Error
            $response = array(
                "status" => "alert-danger",
                "message" => "Please select a file to upload."
            );
        }
    } 
?>

Thêm tệp kết nối cơ sở dữ liệu để chạy truy vấn SQL để thực hiện tương tác với cơ sở dữ liệu

Thêm xác thực để đảm bảo liệu hình ảnh có được chọn hay không và loại tệp chính xác được chọn và sử dụng tập lệnh SQL, chèn tệp vào cơ sở dữ liệu

Nếu các tệp vượt qua xác thực ở trên, thì hãy di chuyển tất cả các tệp trong thư mục tải lên với sự trợ giúp của phương thức move_uploaded_file() và lưu trữ đường dẫn vị trí của hình ảnh trong cơ sở dữ liệu

Tiếp theo, bao gồm tệp tải lên. tệp php trong mẫu biểu mẫu. Nó cho phép người dùng chọn nhiều tệp bằng PHP 8 và MySQL

    
     Add another image
";


}
else
{
 echo "There was an error uploading the file {$_FILES['image']['name'][$i]}, please try again!
";
    }
} // close your foreach
?>

Phần kết luận

Cuối cùng, bài hướng dẫn Upload nhiều ảnh trong PHP với MySQL Database đã kết thúc. Chúng tôi đã học cách triển khai xác thực cho thành phần tải lên nhiều tệp trong PHP

Tôi cho rằng bạn yêu thích hướng dẫn này và bạn cũng có thể tìm thấy mã đầy đủ của hướng dẫn này trên GitHub

máy đào

Tôi là Digamber, một nhà phát triển full-stack và là người đam mê thể dục. Tôi đã tạo trang web này để truyền kinh nghiệm mã hóa của mình cho các lập trình viên mới. Tôi thích viết trên JavaScript, ECMAScript, React, Angular, Vue, Laravel

Bài viết đề xuất

Xây dựng hệ thống xếp hạng 5 sao PHP MySQL bằng jQuery AJAXPHP 8 Tìm kiếm dữ liệu trực tiếp AJAX với MySQL Hướng dẫn PHP 8 Select2 Đa lựa chọn với jQuery AJAX Hướng dẫn PHP 8 Ví dụ về mã hóa và giải mã dữ liệu JSON Ví dụ về PHP 8 Hướng dẫn xác thực biểu mẫu phía máy chủ Tích hợp Google reCAPTCHA trong PHP 8 Biểu mẫu liên hệ Cách tạo Captcha . Lấy giá trị đã chọn và thêm kiểu Cách lấy các giá trị đã chọn từ tùy chọn được chọn trong PHP 8Nhận nhiều giá trị của các hộp kiểm đã chọn trong PHP 8 Tạo phân trang trong PHP 8 với MySQL và Bootstrap

Làm cách nào để tải lên và hiển thị nhiều hình ảnh trong PHP?

Làm cách nào để tải lên nhiều tệp trong PHP?

Làm cách nào để hiển thị nhiều hình ảnh trong PHP?

Làm cách nào để tải lên nhiều hình ảnh bằng Ajax trong PHP?