The gatekeeper of reality is quantified imagination.
Project "Image to mySQL"
Purpose
The purpose of this tutorial is to show how to accept an image upload with PHP, resize that image into a series of images, store those resized images in a mySQL database table as well as displaying images stored in a mySQL database table.
Introduction
In the PHP code you'll notice a series of calls to functions like "imagecreatetruecolor()", "imagejpeg()", "imagepng()" and "imagedestroy()" which rely on the GD library. If your particular instance of PHP does not recognize those functions, you may need to get the GD library installed as documented here.
The actual image upload and display process involves three webpages / PHP scripts:
A simple form that allows a user to select an image on their device to upload
A webpage to process the uploaded image by resizing it into a series of images and saving those to a mySQL database table
A webpage to retrieve an image from a mySQL database table
In this particular tutorial, as mentioned, an uploaded image is resized into a series of separate images and stored in a database. The reason for resizing the original image into a series of images one time is to reduce processing overhead of the image each time it is requested in the future. That is, instead of getting an image from the database and resizing it each time it is requested, we can just return the needed image from the database (which is already the size needed).
The last thing to mention is, because resized images are being stored in the database, "ob_get_contents()" is being used. This function captures the output of "imagejpeg()" and "imagepng()" so we can easily import that stream (normally intended to either go to a web browser or a file on the filesystem) into the database.
Let's get started!
Accept Image Upload From Form
You can add your own picture (JPG, PNG) by selecting the image below.<br /><br />
<form method="post" action="imgUploadHandle.php" enctype="multipart/form-data">
<input type="file" name="image" />
<input type="submit" name="userSbtBtn" value="Upload Image" />
</form>
Resize / Save Image to mySQL Database Table
$imgStoreLocation = "/home/yoursite/public_html/tmp/"; /* Location on your website where re-sized images are temporarily stored so that their file sizes can be determined */
$imgMaxFileSize = 9765; /* Maximum filesize to accept (10MB): 10,000,000 / 1024 = 9765 */
/*
FUNCTION TO STORE RESIZED IMAGES INTO MYSQL DATABASE TABLE
NOTE: The example database table could be represented as --
CREATE TABLE imgUploadTbl (
imgID INT NOT NULL AUTO_INCREMENT
, imgCreatedOn DATETIME NOT NULL
, imgUpdatedOn TIMESTAMP ON UPDATE CURRENT_TIMESTAMP
, imgDimension VARCHAR(100) NOT NULL
, imgMime VARCHAR(255) NOT NULL
, imgSize INT NOT NULL
, imgData LONGBLOB NOT NULL
, PRIMARY KEY(imgID))
*/
function userImgUploadAccept($imgDimension, $imgMime, $imgSize, $imgData) {
$status = "success";
$mySQLLogin = "mySQL user name with permissions to select and insert data";
$mySQLPassword = "mySQL user password with permissions to select and insert data";
$mySQLDatabaseName = "testingDB";
$mySQLDatabaseTableName = "imgUploadTbl";
/* Resize 3 */
/* Note: Resizing does not work if on a byte-boundary such as 1024; so use a somewhat smaller number that is not on a byte-boundary */
$img_1024_height = ($height / $width) * 1020;
$img_1024_tmp = imagecreatetruecolor(1020, $img_1024_height);
imagecopyresampled($img_1024_tmp, $src, 0, 0, 0, 0, 1020, $img_1024_height, $width, $height);
ob_start(); if ($extension == "jpg") { imagejpeg($img_1024_tmp); } else { imagepng($img_1024_tmp); } $img_1024_tmpStream = ob_get_contents(); ob_end_clean();
/* Get file sizes of the resized images by temporarily dumping them to the filesystem */
$today = date("YmdHis"); $physicalPath = $imgStoreLocation . $today;
Display Image from mySQL Database Table
global $imgMime;
global $imgSize;
global $imgData;
$error_status = 0;
$requestedID = 0;
/*
DATABASE TABLE STRUCTURE (for this example):
CREATE TABLE imgUploadTbl (
imgID INT NOT NULL AUTO_INCREMENT
, imgCreatedOn DATETIME NOT NULL
, imgUpdatedOn TIMESTAMP ON UPDATE CURRENT_TIMESTAMP
, imgDimension VARCHAR(100) NOT NULL
, imgMime VARCHAR(255) NOT NULL
, imgSize INT NOT NULL
, imgData LONGBLOB NOT NULL
, PRIMARY KEY(imgID))
*/
function imgRetrieve($id) {
global $imgMime;
global $imgSize;
global $imgData;
$status = "success";
$mySQLLogin = "mySQL user name with permissions to select and insert data";
$mySQLPassword = "mySQL user password with permissions to select and insert data";
$mySQLDatabaseName = "testingDB";
$mySQLDatabaseTableName = "imgUploadTbl";