How to Upload & Resize a PHP MySQL Image

When dealing with a large amount of images, it is often useful to store them in a database. This makes accessing and changing the pictures easy and streamlined, even when you need to change more than one at once. One common task performed on stored images is to resize the image. Uploading and resizing an image using PHP and MySQL can be very simple, and it allows you to do many things, like create a batch of thumbnails for your image gallery, or just display a given image in a size other than the original.

Things You'll Need

  • Web hosting with PHP and MySQL installed

Instructions

    • 1

      Create your database and table in MySQL. Using your MySQL interface, run the following commands:

      CREATE DATABASE test;

      USE test;

      CREATE TABLE images (

          image_id serial,

      filename varchar(255) not null,

      mime_type varchar(255) not null,

      file_size int not null,

      file_data longblob not null,

      primary key (image_id),

      index (filename)

      );

    • 2

      Use a text editor to create a file named "image_upload.html" and fill it with the code below. This will be the form to select your image with.

      <html>

      &lt;head>

      &lt;title>Upload an Image&lt;/title>

      &lt;/head>

      &lt;body>

      &lt;div>

      &lt;h1>Upload an Image&lt;/h1>

      &lt;form method="post" action="image_insert.php" enctype="multipart/form-data">

      &lt;div>

      &lt;input type="file" name="image" />

      &lt;input type="submit" value="Upload Image" />

      &lt;/div>

      &lt;/form>

      &lt;/div>

      &lt;/body>

      </html>

    • 3

      Create a file named "connect.php" and fill it with the code below. This will be the script that allows your other files to use the database. Use your own username and password in place of the "$un" and "$pw" values included.

      <?php

      $host="localhost"; $un="root"; $pw="password"; $db = "test";

      $link = mysqli_connect($host, $un, $pw, $db);

      if(!$link){die('Damnit, link not established.'); exit;}

      $db = "test";

      $db = mysqli_select_db($link, $db);

      if (!$link) {

      die('Connect Error (' . mysqli_connect_errno() . ') '

      . mysqli_connect_error());

      if (!$link) {

      echo "Unable to establish connection to database server";

      exit;

      }

      if (!mysqli_select_db($link, 'test')) {

      echo "Unable to connect to database";

      exit;

      }

      ?>

    • 4

      Create a file named "image_insert.php" and fill it with the code below. This file will take the picture data we send from the form, and place it in your images table. If there is no image passed to this file, it will return an error for you.

      <?php

      require_once('connect.php');

      if (!$_FILES['image']){die('No Image!');}

      $image = $_FILES['image'];

      print_r ($image);

      $query = sprintf(

      "INSERT INTO images (filename, mime_type, file_size, file_data)

      VALUES ('%s', '%s', %d, '%s')",

      mysql_real_escape_string($image['name']),

      mysql_real_escape_string($image['type']),

      $image['size'],

      mysql_real_escape_string(

      file_get_contents($image['tmp_name'])

      )

      );

      if (!$result = mysqli_query($link, $query)){die('Shit happened when trying to insert into the table' .mysqli_error($link));}

      $id = (int) mysqli_insert_id($link);

      header('Location: image_view.php?id=' . $id);

      exit;

      ?>

      <html>

      &lt;head>

      &lt;title>Error&lt;/title>

      &lt;/head>

      &lt;body>

      &lt;div>

      &lt;p>There was an error in your code, or the file could not be uploaded for another reason. &lt;/p>

      &lt;p>

      &lt;a href="image_upload.php">Go Back&lt;/a>

      &lt;/p>

      &lt;/div>

      &lt;/body>

      </html>

    • 5

      Create a file named "image_view.php" and save the code below into it. This file will pull the image from the database, and show it to you in whatever size you wish. The code below has the image displayed at 500 pixels by 500 pixels.

      <?php

      require_once('connect.php');

      $desired_width = 500;

      $desired_height = 500;

      $id = (int) $_GET['id'];

      $query = "SELECT * FROM images WHERE image_id = $id";

      $result = mysqli_query($link, $query);

      $image = mysqli_fetch_array($result);

      mysqli_close($link);

      $blobcontents = $image['file_data'];

      $im = imagecreatefromstring($blobcontents);

      $new = imagecreatetruecolor($desired_width, $desired_height);

      $x = imagesx($im);

      $y = imagesy($im);

      imagecopyresampled($new, $im, 0, 0, 0, 0, $desired_width, $desired_height, $x, $y);

      imagedestroy($im);

      header('Content-type: image/jpeg');

      imagejpeg($new, null, 85);

      ?>

    • 6

      Browse to the image_upload.html file and click "Choose File." Select the file from your computer that you want to upload. Click "Upload File." The software saves it to the database, and then displays the image to you in the size you have requested.

Tips & Warnings

  • Changing the values of $desired_height and $desired_width in the image_view.php file will change the size of the image when it's displayed.
  • Alternatively, you could create fields for these values in the upload form, and pass them to the final page to make the script more dynamic.
Related Searches

References

Resources

  • Photo Credit Thinkstock/Comstock/Getty Images

Related Ads

View Blog Post

Enter the Geek Vs Geek Giveaway and Win a Roku!