GD/PHP: Image Resize Based on Width

There are two versions of an application I made to resize images with a fixed width (can also be edited for fixed height) by using php and the image library gd. The first version uses content-type to change the header to display the image on the page. The second version encodes the image data into base64 and puts into json format, which would be better in some cases for api calls. Both use ‘get’ variables to access the url of the image and the width. This can also be edited to deal with your particular needs. More information about different functions that gd has can be found on the php website.

GD Functions used for this application:

• imagecreatefromjpeg() - creates a new image from a url or a file
• imagesx() - returns the width of an image
• imagesy() - returns the height of an image
• imagecreatetruecolor() - create an empty image container for the resized image, therefore, the dimensions should be for the resized image
• imagecopyresized() - copies the original image and places into into a new destination image resized to the specified size
• imagejpeg() - displays image

Version 1: Content-Type: image/jpeg

1. First setup the content-type (this should be the first line in the file, after php)

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

2. Get variables from url

$url = $_GET['url'];
$width = $_GET['width'];

3. Create image data from the url, and generate the dimensions of the original image

$image = imagecreatefromjpeg($url);
$orig_width = imagesx($image);
$orig_height = imagesy($image);

4. Calculate the new height of the image

$height = (($orig_height * $width) / $orig_width);

5. Generate the new image container with the new dimensions, and create the new image

$new_image = imagecreatetruecolor($width, $height);
imagecopyresized($new_image, $image,
	0, 0, 0, 0,
	$width, $height,
	$orig_width, $orig_height);

6. Finally print the image to the screen

imagejpeg($new_image);

7. Here is the complete code for version 1

<?php
header('Content-Type: image/jpeg');

$url = $_GET['url'];
$width = $_GET['width'];

// Loading the image and getting the original dimensions
$image = imagecreatefromjpeg($url);
$orig_width = imagesx($image);
$orig_height = imagesy($image);

// Calc the new height
$height = (($orig_height * $width) / $orig_width);

// Create new image to display
$new_image = imagecreatetruecolor($width, $height);

// Create new image with changed dimensions
imagecopyresized($new_image, $image,
   0, 0, 0, 0,
   $width, $height,
   $orig_width, $orig_height);

// Print image
imagejpeg($new_image);
?>

Version 2: JSON Base64 Encode

The only difference with this one is that the header() line needs to be removed and the display image part is a bit different.

The idea of this one is that you want to store in data of the image into a buffer and save it into a variable. Then encode that data into base64 and wrap it in json.

ob_start();
imagejpeg($new_image);
$data = ob_get_contents();
ob_end_clean();
echo json_encode(array('image' => base64_encode($data)));

Complete code for version 2

<?php
$url = $_GET['url'];
$width = $_GET['width'];

// Loading the image and getting the original dimensions
$image = imagecreatefromjpeg($url);
$orig_width = imagesx($image);
$orig_height = imagesy($image);

// Calc the new height
$height = (($orig_height * $width) / $orig_width);

// Create new image to display
$new_image = imagecreatetruecolor($width, $height);

// Create new image with change dimensions
imagecopyresized($new_image, $image,
	0, 0, 0, 0,
	$width, $height,
	$orig_width, $orig_height);

// Print image
ob_start();
imagejpeg($new_image);
$data = ob_get_contents();
ob_end_clean();
echo json_encode(array('image' => base64_encode($data)));
?>