top of page
Search
SaaS-Dev

How To Upload Images To Mysql With PHP

Updated: Oct 13, 2020



Hello everyone, see me again on this blog. And thanks to those of you who have visited my blog and if this is your first visit to my blog, this is blog that discusses programming, tips and tricks on blogs, android and others related to technology.

In this article I will give you a tutorial on How To Upload Images To Mysql With PHP. Where there are 3 steps we will do, namely:

  1. Creating a Database on MySQL

  2. Make HTML

  3. Creating a PHP Code

How? are you interested? I will go straight to the point of discussion.



Creating a Database on MySQL

To save images we need to create a database to store the images you upload. In this article I created a simple database. Create a database like below:

CREATE TABLE `tutorial_upload_picture`.`tbpic` ( `number` INT NOT NULL AUTO_INCREMENT , `filename` VARCHAR(100) NOT NULL , `imagetype` VARCHAR(20) NOT NULL , `image` MEDIUMBLOB NOT NULL , PRIMARY KEY (`number`)) ENGINE = InnoDB;


Make HTML


Now we will make the HTML, I will not design HTML with lots of CSS code, because in this tutorial, I will explain the basics. Please add CSS as you wish. Please, type the code below:


<!DOCTYPE html> <html> <head> <title></title> </head> <body> <h2>Upload Image</h2> <span>Please select your image by click button bellow:</span> <br><br> <form name="forminput" method="POST" enctype="multipart/form-data" action="saveimg.php"> <input type="file" name="upimg" id="upimg" accept=".jpg,.jpeg,.png" onchange="loadFile(event)"> <br><br> <img id="show" name="show" width="200" height="200" > <br><br> <input type="submit" name="saveImg" id="saveImg" value="Upload Image"> </form> <script> var loadFile = function(event) { var image = document.getElementById('show'); image.src = URL.createObjectURL(event.target.files[0]); }; </script> </body> </html> and save the code above with the name index.html



Creating a PHP Code

Create Connection Code

before we make the code to upload the image, we will make the connection code first so that the php that we created can connect to mysql.

<?php
   $hostname  = "localhost";
   $username  = "root";
   $password  = "";
   $dbname  = "tutorial_upload_picture";
   $db = new mysqli($hostname, $username, $password, $dbname);
?>

and save the code above with the name db.php


Creating a Code for Saving Images


After you create the database and HTML, now we will create the main code so that you can upload images to the database. Please, type the code below:

<?php include "db.php"; if(isset($_POST['saveImg'])) { if($_FILES['upimg']['error'] == 0) { $filename = $_FILES['upimg']['name']; $imgtype = $_FILES['upimg']['type']; $tmpFile = fopen($_FILES['upimg']['tmp_name'], 'rb'); $fileData = fread($tmpFile,filesize($_FILES['upimg']['tmp_name'])); $fileData = addslashes($fileData); $query = "INSERT INTO tbpic (id,filename,imagetype,image) VALUES ('','$filename','$imgtype','$fileData')"; $process = mysqli_query($db,$query); if($process) { //header('location:index.html'); echo " <script type='text/javascript'> alert('Your image has been uploaded successfully'); window.location.href = 'index.html' </script>"; }else { echo " <script type='text/javascript'> alert('Your image failed to upload'); window.location.href = 'index.html' </script>"; } } } ?> and save the code above with the name saveimg.php

Conclusion

How? Isn't it easy to make it? Hopefully the article How To Upload Images To Mysql With PHP that I made can give you benefits. And if my article is useful, you can share my article to social media that you have.  We meet again at other times and with other interesting articles.



19 views0 comments

Comments


bottom of page