When the API returns an image
15 Jan 2020I see more and more Image-Response GET APIs. With this term I mean: the API is called with a GET URL, and the response is a (JPG/PNG/GIF/WEBP/SVG) image, either directly or after a redirect. So the API can be used through a simple <img src="[IMAGE GENERATING URL">
HTML tag. Let’s call these IMGSRCAPI‘s.
One of the oldest examples is Gravatar, used by WordPress to show an icon/avatar for each person that writes/comments on blogs. Every imaginable email address automatically has a Gravatar profile pic, but by default it is . Only when you can log in and verify your email, you can change your profile pic to whatever you want.
But, as I said, I see more and more of them, and I wanted to catalog them. I see 2 big categories: static vs dynamic IMGSRCAPIs.
1. Static (deterministic) IMG SRC API
This means: a certain URL (with specific query parameters) will ALWAYS give back the same image. Let me give some examples:
1.a. Static placeholder pictures
These services are used to quickly generate random images of specific sizes to use in web design.
DUMMYIMAGE: https://dummyimage.com/500×200/00066f/FFF.png&text=dummyimage.com
FAKEIMAGE.PL: https://fakeimg.pl/500×200/?text=fakeimg.pl&font=lobster
SATYR.IO: https://satyr.io/500×200/orange?delay=3g – simulates 3G network delay
PLACEKITTEN: https://placekitten.com/500/200, and similarly: placebear.com, fillmurray.com
1.b. Image (scannable) representation of data
TEC-IT.COM: static linear barcode (Code128)
() TEC-IT.COM: Static vCard (address book) QR Code
A handy service like qrcode-monkey.com does not qualify as an IMGSRCAPI because it rather works like a regular API: with a JSON request body and a JSON response. You can’t just use it in a <img>
tag.
Facebook also has scannable Messenger codes, but again, these cannot be created with a simple URL, so no IMGSRCAPI
1.c. Static avatars
These are service to turn a string into an image, in such a way that it’s easier to recognize them. This can be used for people, or for projects.
ROBOHASH: https://robohash.org/pforret
DICEBEAR AVATARS: https://avatars.dicebear.com/v2/male/pforret.svg
1.d. Image modification API
There are actually a lot of these image-modification (mostly paid) SaaS services. The request URL includes the URL of an input image, and the response is, since it is a IMGSRCAPI, also an image. The service can compress, resize, crop intelligently, change colours, …
https://imageoptim.com/ (paid service)
Some examples of these services are:
2. Dynamic IMG SRC API
This means that 2 calls with the exact same URL might give back a different image. This could be because it’s random, or because of external data that has changed.
2.a. Dynamic placeholder pictures
Like their cousins in 1.a., these services give back an image of a certain size, but it’s a random image, changes upon each call.
LOREM PICSUM: https://picsum.photos/500/200
PLACEBEARD: https://placebeard.it/g/500/200
PLACEIMG: https://placeimg.com/500/200/arch
UNSPLASH: https://source.unsplash.com/500×200/?sunset
2.b. Profile image API
The best example is obviously Gravatar.
Gravatar: [https://www.gravatar.com/avatar/
Image a IMGAPI service
- _
/facebook/ _ => the FB profile pic of that user (if they exist and the profile pic was public) - _
/instagram/ _ => the IG profile pic of that user - _
/twitter/ _ => the Twitter profile pic - _
/google/ _ => the Google profile pic - _
/linkedin/ _ => the Linkedin profile pic - _
/favicon/ _ => the favicon of that website.
This would be rather easy to create and super handy to use. I don’t know why I haven’t found any service like this.
I know that Google used to have a IMGSRCAPI service for profile pics (_https://profiles.google.com/…/profile/
2.c. Screenshot and preview IMG SRC API
Here the service will take a text or a URL and convert this into an image.
Social Preview images via placid.app
screenshot via screengrab.io
2.d. External status IMG SRC API
So this is an image whose content can change based on external information. For instance, in the developer’s world most badges and shields, often shown on Github README pages, fall under this group.
Auto-updated shields via https://shields.io/
Repository status via https://www.repostatus.org/
Also website monitoring services can provide an image API:
also via https://shields.io/category/monitoring
And how about weather services?
via https://www.theweather.com/widget/
tomorrow’s weather in Belgium via https://www.meteo.be
Latest weather via wunderground.com
I probably forgot some types of IMGSRCAPI services, feel free to let me know in the comments, and I will add them!
Hat tips to johanbostrom.se * sharptools.io