Php Code for Image Upload and Display Mysqli Database

Server-side file upload can be easily implemented using PHP. In that location are diverse ways available to upload epitome to server and display images on the webpage. By and large, in a dynamic web application, the uploaded image is stored in a directory of the server and the file name is inserted in the database. Later on, the images are retrieved from the server based on the file proper noun stored in the database and display on the web folio.

The prototype tin be uploaded directly to the database without storing on the server. But it will increment the database size and web folio load time. And then, it's always a proficient thought to upload images to the server and shop file names in the database. In this tutorial, we will testify you the unabridged process to upload and store the image file in MySQL database using PHP.

The example code demonstrates the process to implement the file upload functionality in the web awarding and the following functionality volition be implemented.

• HTML course to upload image.
• Upload paradigm to server using PHP.
• Store file name in the database using PHP and MySQL.
• Call back images from the database and display in the web page.

Create Datbase Table

To shop the image file proper noun a table need to be created in the database. The following SQL creates an images table with some basic fields in the MySQL database.

          CREATE          Tabular array          `images` (          `id`          int(11)          Not Naught          AUTO_INCREMENT,          `file_name`          varchar(255) COLLATE utf8_unicode_ci          NOT NULL,          `uploaded_on`          datetime          Non Goose egg,          `status`          enum('1','0') COLLATE utf8_unicode_ci          Not Goose egg          DEFAULT          'ane',          Main Central          (`id`) ) ENGINE=InnoDB DEFAULT CHARSET=utf8 COLLATE=utf8_unicode_ci;        

Database Configuration (dbConfig.php)

The dbConfig.php file is used to connect and select the MySQL database. Specify the database hostname ($dbHost), username ($dbUsername), password ($dbPassword), and name ($dbName) as per your MySQL credentials.

          <?php
                    // 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(          "Connexion failed: "          .          $db          ->          connect_error          );
}
                    ?>        

Upload Course HTML

Create an HTML form to allow the user to choose a file they want to upload. Brand sure <form> tag contains the following attributes.

• method="post"
• enctype="multipart/form-data"

Also, make sure <input> tag contains type="file" attribute.

<form          action="upload.php"          method="post"          enctype="multipart/form-data">     Select Image File to Upload:     <input          type="file"          name="file">     <input          type="submit"          name="submit"          value="Upload"> </form>        

The file upload form will be submitted to the upload.php file to upload paradigm to the server.

Upload File to Server and Store in Database (upload.php)

The upload.php file handles the image upload functionality and shows the status bulletin to the user.

• Include the database configuration file to connect and select the MySQL database.
• Get the file extension using pathinfo() office in PHP and validate the file format to bank check whether the user selects an image file.
• Upload image to server using move_uploaded_file() function in PHP.
• Insert image file name in the MySQL database using PHP.
• Upload status will exist shown to the user.

          <?php
                    // 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"          ][          "proper name"          ])){
          // Let 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 once more."          ;
            }
        }else{
          $statusMsg          =          "Lamentable, there was an error uploading your file."          ;
        }
    }else{
          $statusMsg          =          'Sorry, simply JPG, JPEG, PNG, GIF, & PDF files are immune to upload.'          ;
    }
}else{
          $statusMsg          =          'Please select a file to upload.'          ;
}          // Brandish condition bulletin
                    repeat          $statusMsg          ;
                    ?>        

Display Images from Database

Now we will remember the uploaded images from the server based on the file names in the database and display images in the web page.

• Include the database configuration file.
• Fetch images from MySQL database using PHP.
• Listing images from the uploads directory of the server.

          <?php
                    // Include the database configuration file
                    include          'dbConfig.php'          ;          // Go 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"          ];
                    ?>          <img          src="<?php            echo            $imageURL            ;            ?>"          alt=""          />          <?php          }
}else{          ?>          <p>No epitome(south) found...</p>          <?php          }          ?>        

Create Dynamic Epitome Gallery with jQuery, PHP & MySQL

Conclusion

Here we have shown the most effective way to implement prototype upload functionality on the website. Y'all can hands extend the file upload functionality as per your requirements. For providing the amend user-interface y'all tin can integrate the Ajax File Upload functionality.

Upload multiple images using jQuery, Ajax and PHP

Are you want to get implementation help, or modify or enhance the functionality of this script? Submit Paid Service Request

If yous have whatever questions virtually this script, submit information technology to our QA community - Enquire Question

mclinthimandind.blogspot.com

Source: https://www.codexworld.com/upload-store-image-file-in-database-using-php-mysql/

Share this post