Quick solution
The script below will use PHP to convert image to base64:
// Get the image content
$image = file_get_contents('image.png');
// Convert it to base64
$base64_image = base64_encode($image);
Optionally, to display the image using converted base64 data:
echo '<img src="data:image/png;base64,' . $base64_image . '">';
Below is more detailed information on the conversion process with notes and alternative methods for converting image to base64 data and display it.
Why convert image to base64?
The main purpose of converting image to base64 data is to be able to transmit and store image data from binary format to ASCII format. This way, we can display, or transfer the image data easier in text format.
Another minor benefit of using base64 image format is to be able to display the image on webpages using its base64 data in text format, without having to load the image file. Therefore, the number of HTTP request is recuded.
Although so, the actual data transmission using the image’s base64 data is actually more than the binary file itself. The converted base64 format’s amount of data will be always bigger than the original binary format by around 33%.
In conclusion, the benefit mostly only applies to small, tiny images (eg. icons) that would save the amount of requests to a webpage.
To convert image to base64 using PHP
The primary steps to convert an image to base64 is:
- Get the image file content
- Convert it to base64 data
There is various ways to get the image file content.
Option 1: Get image content using file_get_contents()
This is the basic method to extract file contents.
// Get image content from image file or URL
$imageData = file_get_contents('image.png');
Please note that, there would be web hosting disabled the file_get_contents()
for security purposes. In that case, we have two more options.
Option 2: Get image content using stream handler
This is another safe method to get image content that won’t be blocked on most web hosting.
// Open image or URL in read more
$file = fopen('image.png', 'r');
// Put image data using stream handler
$imageData = stream_get_contents($file);
// Close the stream to release memory
fclose($file);
Display the image in base64 format
Usually, there are two ways we wanted to display the image in base64 format:
- As
<img>
tag - Using PHP to output as a standalone image
Display image in base64 format as <img> tag
We can display the image in <img>
tag by passing the base64 data as this format:
echo '<img src="data:{$image_mime_type};base64,{$base64_data}">';
Where
{$image_mime_type}
is the mimetype of the image, eg.image/png
for png format,image/jpeg
for jpeg/jpg format.{$base64_data}
is the extracted base64 data from the image.
For example, with png image format:
echo '<img src="data:image/png;base64,iVBORw0KGgo.....">';
Use PHP to output as a standalone image
Using this method will have the php page to display the page as if it’s displaying an image file.
// Set header as the image mimetype we want
header("Content-type: image/png");
// Encode the image data to base64 and display the image
echo base64_encode($imageData);
Final thoughts
The guide on how to convert image to base64 using PHP is now over. We hope you could understand its benefit, drawback of converting and displaying image as base64, and make good use of it in your projects.