Displaying files (e.g. images) stored in Google Drive on a website

I was wondering if its possible to access/display files like images which are stored in Google Drive on a public website.

6,998 17 17 gold badges 82 82 silver badges 127 127 bronze badges asked Apr 25, 2012 at 7:20 user1355487 user1355487 3,909 3 3 gold badges 15 15 silver badges 3 3 bronze badges

It seems that the user that created the question never used SO anymore, leaving this question without accepted answer (when there is at least one valid answer). Can the community editors fix that?

Commented Mar 27, 2013 at 14:42 It looks like this is being deprecated: Deprecating web hosting support in Google Drive Commented Feb 17, 2016 at 16:13

Here's the final update from Google in Jul 2016 with alternatives: gsuite-developers.googleblog.com/2016/07/…

Commented Mar 13, 2017 at 23:59 @wescpy, i've found this solution to work for my G-Suite account Commented Mar 5, 2020 at 19:10 No solution mentioned here works for embedding a gdrive image in Github markdown :( Commented Jun 20 at 8:47

26 Answers 26

  1. Go to your Google Drive.
  2. Right-click on the image file.
  3. Select Share.
  4. Open the General access drop-down menu.
  5. Select Anyone with the link to publish your image.
  6. Click Copy link and then Done.
answered Dec 19, 2013 at 7:34 7,983 19 19 gold badges 67 67 silver badges 100 100 bronze badges

It works! (the sharing link https://drive.google.com/file/d/2B8NbrE732XHNLThjZWZzMMVCDeVFpLVVXUkFjT3h2Qloweslz/edit?usp=sharing turned into https://drive.google.com/uc?id=2B8NbrE732XHNLThjZWZzMMVCDeVFpLVVXUkFjT3h2Qloweslz ).

Commented Feb 18, 2014 at 14:55

Drive's API upon finishing a file upload has this link in the response message: data.response.webContentLink . This will have &export=download at the end which just needs to be trimmed off.

Commented Jun 13, 2014 at 15:41

This answer worked for me when attempting to host/use an image for my ESPN Fantasy-Football team logo. so kudos for that.

Commented Sep 2, 2014 at 21:34

I recommend not keeping the 's' in https. It seems to cause embed issues in some scenarios, and it automatically resolves to the ssl version anyway

Commented Mar 1, 2016 at 4:40 @pabloverd: "do I have to do that action one by one" Yes. Commented Feb 27, 2019 at 7:49

A workaround is to get the fileId with Google Drive SDK API and then using this Url :

That will be a permanent link to your file in Google Drive (image or anything else).

Note: this link seems to be subject to quotas. So not ideal for public/massive sharing.

153 9 9 bronze badges answered Aug 7, 2012 at 23:17 5,457 3 3 gold badges 37 37 silver badges 47 47 bronze badges How can I get fieldId of the picture? Commented Oct 10, 2013 at 9:03

This works without using a public folder. The image itself must be shared as 'public'. The fileId is shown - embedded in a URL - when sharing the file.

Commented May 3, 2014 at 22:49

Hi Rufo, can you please share information on the quota, like how much quota is there? Does quota mean viewing bandwidth per month? Is there a link without quota? I'm looking for public/mass sharing.

Commented Feb 28, 2016 at 0:40

Can anyone tell me about the quota limit for a single image id? And what could happen if the limit cross? Thanks!

Commented Sep 15, 2020 at 11:26

this is not working when site is open in incognito mode, any workaround? its asking for login when the url is directly opened

Commented Apr 25, 2022 at 15:11

UPDATE: As was announced, Google deprecated this feature in Aug 2016. Here's the final update from Google with alternatives.

Yes, it's possible. Provided that you put your files in a public folder, you can get any file in a folder by this URL:

https://googledrive.com/host//
user9355604 answered Dec 5, 2012 at 2:43 29.7k 15 15 gold badges 100 100 silver badges 109 109 bronze badges Dead link :( anyone got a new one? Commented Nov 18, 2017 at 14:34

@LeoLuanElezi while your edit was sound, a better edit summary would have been, "removed a dead link".

Commented Nov 6, 2018 at 14:52

1- upload ur image

2- right click and chose "get sharable link"

3- copy the link which should look like

4-change the open? to uc? and use it like
27.6k 24 24 gold badges 85 85 silver badges 127 127 bronze badges answered Jul 4, 2016 at 19:44 7,421 5 5 gold badges 38 38 silver badges 48 48 bronze badges

@ctf0 "its recommended to remove the http: or https: when referencing anything from the web to avoid any issues with ur server", so you advise to simply do drive.google.com ?

Commented Oct 7, 2018 at 20:21 WORKED fine , simple Commented Sep 27, 2019 at 8:59

Working solution for Workspace (G suite) users in July 2024

Some embed codes do not show the img unless the viewer is logged into gmail, the following works like a regular image on your webhost:

Share item publicly (make sure it says ''Anyone on the internet with this link can view): either the image itself (or the folder where the image resides) then copy the link the following way

enter image description here

Take the ID of the file and insert here:
Result (if you see the dog below it means the solution still works):

Localmachine

Won't display on MAMP/WAMP type of localhost environments, but does display on webpages.

answered Nov 28, 2021 at 13:09 Robert Sinclair Robert Sinclair 5,156 2 2 gold badges 48 48 silver badges 51 51 bronze badges This comment saved me a lot, Thank you Commented Mar 3, 2022 at 1:43 does this load image in safari browsers? Commented Apr 20, 2022 at 9:39 @fingers10 yes, i do see the dog in Safari also Commented May 5, 2022 at 11:51 This solution works like a charm. I embed company's logo in email template footer. Thank you. Commented Sep 28, 2022 at 17:43 Currently working solution as of June 2023 Commented Jun 11, 2023 at 19:30

EDIT : As of 2020, THIS is working. Most previous answers are outdated.

Easy Solution

All you have to do is open your file:

Image of mountain on Google Drive

Then, go into your web inspector (for Chrome, Cmd-Shift-I or Ctrl-Shift-I depending on your OS) and get the link. Paste that link into your browser and it will redirect to another link. Copy the new URL. Done!

Image of link for image shown in web inspector

What's the redirect for?

It seems that if you use the first link, it can only be accessed when signed in to your Google account. Not very helpful for other people. The second, redirected link, however, does not need you to be signed in. That's the rationale behind it.

I deleted the original file shown in the images, but I have another working example here.

I've actually checked back on my example link that I posted in my edit about a week ago, but it no longer seems to be working. It looks like these links only work temporarily, so don't use them for any kind of production environment.

community wiki Brilliant - This should be Top Voted as of 2020 Commented Jun 21, 2020 at 10:40 The only solution that actually works. Thank you! Commented Jan 10, 2021 at 5:11 @DinisRodrigues just beware that the links don't last. Super useful for prototyping though Commented Jan 10, 2021 at 18:54 Finally! Thank you 2021! Commented May 21, 2021 at 4:27 Aptly titled and still applicable in March 2022!! Commented Mar 21, 2022 at 5:58

UPDATE: As was announced, Google deprecated this feature in Aug 2016. Here's the final update from Google with alternatives.

As per April 2013 and using Chrome/webkit, the following worked for me:

  1. Make a folder called e.g. "public"
  2. Select that folder, right click and Share > Share. Click. Select "Anyone can access"
  3. Drag and Drop a file into the folder, and let it upload.
  4. Right click on the file and select Details. One of the lines in the Details-Fieldset reads "Hosting". Underneath it is an url:

One limitation is that as far as HTTP goes, only secure HTTP access seems to be possible.

Update:
Another limitation is that files which Google drive can open, won't be accessible that way.
That is, clicking on "Details" won't show an Google-drive url.

To overcome this:

enter image description here

Note: An alternative to the procedure above, is uploading the file with an extension that Google Drive cannot open/is not associated.

746 1 1 gold badge 8 8 silver badges 26 26 bronze badges answered May 1, 2013 at 19:28 Lorenz Lo Sauer Lorenz Lo Sauer 24.5k 16 16 gold badges 87 87 silver badges 87 87 bronze badges Update to the update -- it was deprecated in 2015 and removed in 20166 Commented Mar 2, 2017 at 9:24 And hence this answer should be deleted Commented Mar 2, 2019 at 8:15

If you want to view the file in the browser, it's also possible using a similar method to the one provided by rufo and Torxed:

https://drive.google.com/uc?export=view&id=
answered Jan 14, 2013 at 18:15 Jeff Johnson Jeff Johnson 1,097 10 10 silver badges 15 15 bronze badges I don't understand. If I want to view the gdoc in the browser, I just type in its URL. Commented Feb 13, 2014 at 16:24

Specifically for G-Suite users . As reported in point 3 here, you can use this URL for hosting image

https://drive.google.com/a/domain.com/thumbnail?id=imageID

with following replacements

The prerequisite here is that image should have been shared via drive to target audience (either with each person individually or maybe across the org)

enter image description here

If you face problems with size of rendered image, use following options as mentioned here

https://drive.google.com/a/domain.com/thumbnail?id=imageID&sz=w-h

with following replacements (in addition to domain and imageID replacement)

answered Mar 5, 2020 at 13:16 y2k-shubham y2k-shubham 11.3k 14 14 gold badges 66 66 silver badges 143 143 bronze badges you my friend are a star! <3 Commented Jan 6, 2021 at 23:50 can I add the previous and next link, once I click the image Commented Mar 22, 2021 at 13:05

This doesn't work in 2022.1 once deployed to Tableau Server. Returns 403. Need to use the https://drive.google.com/uc?id= URL. Haven't found a way to resize that one.

Commented Aug 19, 2022 at 14:49

@Cassova https://drive.google.com/thumbnail?id=XXX&sz=w100-h100 works for me, i.e. just replace uc by thumbnail , and add your max width and max height.

Commented Sep 30, 2022 at 20:09

@avernet just gave it a shot. That also returns 403 errors. I'm currently using https://drive.google.com/uc?export=view&id= to get around it.

Commented Oct 3, 2022 at 12:37

Per this blog post, a currently working solution is:

This is verified to work as of 26th of April, 2021. No shared folder or login is required. But a publicly shared file is.

1,116 1 1 gold badge 13 13 silver badges 30 30 bronze badges answered Aug 3, 2020 at 8:36 Let Me Tink About It Let Me Tink About It 15.8k 21 21 gold badges 105 105 silver badges 215 215 bronze badges

I think it is possible but only for a short time

What you have to do is set the Access Control List of the file to Public Read-Only (or Public Read/Write). You can do that programmatically using the Google Document List API, or manually through the "Share" button on the Drive image viewer.

Then you can get the URL to the image programmatically by either using the Google Document List API or using the Google Drive API (i.e. file.getDownloadUrl() in Java). You can also easily get a link to the image manually by right clicking on the image in the Google Drive default image viewer.

The problem is that this link has a limited time to live, so it will work for a little while and then stop working.

Basically the URL of the image file stored in Drive should be accessible without any authentication once it has been set shared publicly but that URL is going to change at some point. We might find a solution to this in the future like providing a permanent URL that will redirect to these changing URL but no promises.

answered Apr 25, 2012 at 10:19 Nicolas Garnier Nicolas Garnier 12.3k 2 2 gold badges 43 43 silver badges 39 39 bronze badges

It would be nice knowing in advance how long a link lives. Is it fix or it depends on other parameters?

Commented Apr 26, 2012 at 9:47

By experience if I ask the engineer what that value is he will reply: "It is currently XXX but don't tell them because we might change it anytime :)" I'm sure you can experiment easily to find this value though ;)

Commented Apr 26, 2012 at 9:50

Currently a public, even if expiring, link to a resource it's what we need, beside application sandboxes, for which data already belongs to a oauth2 app without messing with ACLs.

Commented May 1, 2012 at 1:58

This is the only direct link format without redirection (then a Permalink) and only applies to files directly visible on Google Drive (e.g. images and documents).
It is not affected by the download limit and you can use it to display images on a website.

For example the sharing link:

https://drive.google.com/file/d/FILE_ID/view?usp=sharing 
https://lh3.googleusercontent.com/d/FILE_ID

lh4, lh5 and lh6 also work.

answered Oct 5, 2021 at 13:59 Mario Palumbo Mario Palumbo 875 13 13 silver badges 36 36 bronze badges

Great! this works when other methods fail. This is also suitable for making native apps like in Xamarin Forms using FFImage with url. This answer should get more votes.

Commented Aug 22 at 23:24
  1. Open Drive at drive.google.com and select a file.
  2. Click the Share button at the top of the page.
  3. Click Advanced in the bottom right corner of the sharing box.
  4. Click Change.
  5. Choose On - Public on the web and click Save.
  6. Before closing the sharing box, copy the document ID from the URL in the field below "Link to share". The document ID is a string of uppercase and lowercase letters and numbers between slashes in the URL.
  7. Share the URL that looks like "www.googledrive.com/host/[doc id] where [doc id] is replaced by the document ID you copied in step 6.
answered Jun 20, 2015 at 18:50 Watchmaker Watchmaker 5,258 2 2 gold badges 39 39 silver badges 38 38 bronze badges

Some of the previous users were close, but they were missing a step here or there.

Here is a video that shows all of the steps.

(Edit 2-Dec-14
The Below information is incorrect when it comes to the new Google Drive. For the New Google Drive follow these instructions.
There are two options you can use,
option 1 you can click the cog on the top right and revert to the old google drive, IF you revert, use the instructions after "End Edit)" .
Option 2 or you can follow the work around I found. If I find a better way than this I will update it, but here is what I have found that works.

The full link will look like this "https://googledrive.com/host/(folder id)
Part one of your link that you need is "https://googledrive.com/host/" for the second half you will need to navigate to the file you would like to share.
Once you are in the folder with the file you would like to share, look at the link above
(Example 1 https://drive.google.com/drive/u/0/#folders/0B3UALYkiLexYSXZlcldoU2NpYXM )
(Example 2 https://drive.google.com/drive/u/0/#folders/0B3UALYkiLexYSXZlcldoU2NpYXM/0B3UALYkiLexYRkNnOVhsUVozRU0)
In both of these above examples, the "Folder ID" you need for sharing is the last group of letters and numbers after the "/" so in example one, it is "0B3UALYkiLexYSXZlcldoU2NpYXM" in example two it is "0B3UALYkiLexYRkNnOVhsUVozRU0"

In the examples I used, example 1 was a folder on my drive, and example 2 was a folder inside that first one, that is why it has the entire first link before the second.
We only need the section after the "/" furthest to the right.

Great, now that you have this link, open it in a new page. It will direct you to the shared folder. Once there you can either right click on any file and select "Copy link address" or you can click any file in that folder and it will take you to the hosted image, the URL at the top of the page is the hosting URL.

That is the how you do it. It is quite annoying, and personally it seems a whole lot easier to just revert to the old google drive.

I will try to make a new tutorial video ASAP

Let me know if this does not work for you and what problem you are experiencing.

Or you can just follow the written ones below.

These pictures go with the ones listed in the steps.

  1. Create a Folder on your Google Drive that you would like to use for sharing images.
  2. Select that folder and go to the sharing options. Change the "Who has access" options from "Specific People" to "Public on the web" All images placed in folder will have a hosting link on them shown in Step 4 (Images : Change Folder Option.png, Change folder option 2.png, and Change folder option 3.png)
  3. place an image in that folder.
  4. select the image you would like to share and look at the details section (usually on right hand side) for a section labeled "Hosting" you should find a link that starts with "googledrive.com/host/(random numbers and digits that are the ID for that folder)/(file name)" Use that link to share your images. You can use that link to embed them into other websites. (Images: Change folder option 4.png and Change folder option share.png)