Host static images for your apps or website on Google Drive. (Hotlink to GDrive images)

Pius Aboyi
2 min readOct 21, 2019

--

Google Drive provides Gmail users with a convenient way to store and order files online. Files stored on Google drive can be easily shared, viewed and downloaded by others. In this post, I will be sharing an easy way for developers to use drive for hosting images for small projects.

Update 12/2020:

I made a small tool that does what I described in this article. You can check it out here

For example, building an app that shows images of popular structures from various states in Nigeria. All the images can be uploaded to Google drive and sorted properly in folders like NGStates > Images.

After upload, right-click on the image you wish to display in your app and select “get sharable link”

drive get sharable link.

That should copy a link like this: https://drive.google.com/open?id=1m-uOoFzHn4oUGlEsDSEfPBbJ2QhBJzlM to the clipboard (this link is unique for each file obviously). Notice the part of the link after “.com/” that reads “open”, change “open” to “uc”.

Update 2020

Due to recent changes in Google drive, generating hotlinks doesn’t work as expected. However, I’ve checked my app and images still load fine. That got me thinking about building the URL manually and it worked. Here is an example using the link:

https://drive.google.com/file/d/1Pz_01i2itDW1QZmSMuHen3WZYAJJ3pTV/view?usp=sharing

1Pz_01i2itDW1QZmSMuHen3WZYAJJ3pTV is the id for your file. So, you can build the URL like so:

https://drive.google.com/uc?id=1Pz_01i2itDW1QZmSMuHen3WZYAJJ3pTV

hope that helps.

Now you can use the link in your HTML img tags like this:

<img src=”https://drive.google.com/uc?id=1m-uOoFzHn4oUGlEsDSEfPBbJ2QhBJzlM" />

and you will get the desired output. If you are an Android developer and you are downloading images over the network via third-party libraries like Picasso, you can paste the edited URL where you normally input image URL and it will work like normal. Below is a code example in Java:

String imageUrl = "https://drive.google.com/uc?id=1m-uOoFzHn4oUGlEsDSEfPBbJ2QhBJzlM";
Picasso.get()
.load(imageUrl)
.into(imageView);

The main deal that enables the hotlinking of Google Drive images is changing “open” to “uc” on the sharable file link.

Conclusion

So that is all. Is this even useful? For me, yeah! there are times I build small apps for tutorials and I just want a quick solution for hosting image resources. Bye-bye for now and happy coding.

Useful link: A Google Drive Direct Link Generator tool

📝 Read this story later in Journal.

👩‍💻 Wake up every Sunday morning to the week’s most noteworthy stories in Tech waiting in your inbox. Read the Noteworthy in Tech newsletter.

--

--

Pius Aboyi
Pius Aboyi

Written by Pius Aboyi

Web/Mobile Developer(Android), I know PHP, SEO+Digital marketing. Currently growing the tech Eco-system in Benue, Nigeria, via BenueTechForum and GDG Makurdi.

Responses (8)