Pics Or It Didn't Happen
A Ruby gem that lets you include images in HTML using data URLs (and avoid serving the image file separatly).
This gem is a fork of Megan Ruggiero's DataURL gem.
Sometimes, you might want your HTML to include a one-off image file that is just for one person. Making this file public may be undesireable for security reasons, or perhaps simply because it is not worth the overhead of multiple HTTP requests.
This gem provides a utility method that takes a locally-saved image file (or an in-memory binary string representation of an image), encodes it as Base64, and returns an HTML <img>
element with the correct data URL attributes.
It is made possible by the RFC 2397 scheme, which is now fairly well supported in modern browsers.
Here is an example (from this fiddle) of an <img>
tag with the image data saved within the HTML itself:
<img
src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/w38GIAXDIBKE0DHxgljNBAAO9TXL0Y4OHwAAAABJRU5ErkJggg=="
alt="Red dot"
/>
This example HTML page will show you how this renders in a browser. You should see a small red dot in the top left corner.
Getting Started
Run
gem install pics_or_it_didnt_happen
or add
gem 'pics_or_it_didnt_happen'
to your Gemfile
.
The image_to_data_url_image_tag
Method
This method takes a file path to an image file (GIF, PNG or JPG) as an argument, and returns an img
tag with the image encoded as a data URL:
PicsOrItDidntHappen.image_to_data_url_image_tag('path/to/your/image.png')
=> "<img src="data:image/png;base64,ALOTOFBASE64ENCODEDDATAHERE"/>"
You can also pass alt text like this:
PicsOrItDidntHappen.image_to_data_url_image_tag('path/to/your/image.png', alt_text: 'a great image')
=> "<img src="data:image/png;base64,ALOTOFBASE64ENCODEDDATAHERE" alt="a great image"/>"
If you're working with a file that is already in memory, you can pass the file data directly:
binary_image_data = IO.binread('path/to/your/image.png')
PicsOrItDidntHappen.image_to_data_url_image_tag(binary_image_data)
=> "<img src="data:image/png;base64,ALOTOFBASE64ENCODEDDATAHERE"/>"
Contributions
Run rspec
to run the tests that verify that image_to_data_url_image_tag
works as expected.
Pull requests welcome!
Licence
This gem uses the MIT licence. See licence.txt
for details.