3

I have a folder in my Google Drive where I put hundreds of my product images.

I want to know if I can write a script that finds the file and then returns the image URL of that file so that it can be viewed from a Google Web App I created?

Kos
  • 4,890
  • 9
  • 38
  • 42
Bokai
  • 107
  • 3
  • 17
  • Does your web app know image ids? – Kos Jul 20 '17 at 15:19
  • The web app knows the file name. However, I should be able to find the ID with the file name, right? – Bokai Jul 20 '17 at 15:21
  • Collecting the files should be a sheets/drive script. i don't think google allows you to do that anymore - they did but allow hosting from drive by "deprecated it" a while ago. See: https://stackoverflow.com/questions/10311092/displaying-files-e-g-images-stored-in-google-drive-on-a-website. Problem is the google file id as well as the url it gives you [sample publc image](https://drive.google.com/file/d/0ByPNL6sCkWNyWllRVWx2WEFodzA) is not the actual file, but an html lightbox with the image. – Xingzhou Liu Jul 20 '17 at 15:26
  • Can you post sample code, there is plenty of ways your question can be answered for now. – Kos Jul 20 '17 at 15:26
  • @XingzhouLiu it's not true, here is direct link to your image you can embed on webpage: https://drive.google.com/uc?export=view&id=0ByPNL6sCkWNyWllRVWx2WEFodzA – Kos Jul 20 '17 at 15:29
  • @XingzhouLiu thanks for that info! that was exactly what I was looking for. – Bokai Jul 20 '17 at 15:30
  • no, open up your developer tools and inspect that page you sent. its still not the image, but an image enclosed in an HTML DOM. You can download the image, but embed not so much. Even if you copy the src of the image, you still end up at at an HTML page containing the image. Google wants to make that extra money, lol. – Xingzhou Liu Jul 20 '17 at 15:40
  • Sorry, I should have been more clear. I see see what you are saying, it just confirmed that I should look for an alternate solution. – Bokai Jul 20 '17 at 15:42
  • @XingzhouLiu have you looked at link I posted? It has _content-type:image/png_ it's not web page, like you say. – Kos Jul 20 '17 at 15:44

2 Answers2

8

You can embed image from Google Drive on your web page by url in format https://drive.google.com/uc?export=view&id=DRIVE_FILE_ID

Here is live snippet:

<img src="https://drive.google.com/uc?export=view&id=0ByPNL6sCkWNyWllRVWx2WEFodzA" width="100" height="100">
Kos
  • 4,890
  • 9
  • 38
  • 42
2

As noted in the comments to your post, Google has disabled the option of linking directly to a file on Google Drive. However, you can use the Google Drive API to download the file. After which you can encode the image as a base64 encoded string and use it inline by setting the 'src' attribute in an img tag to that encoded string. Granted this is potentially a slow method if your image files are very large, but it should work well for images of moderate size.

TheAddonDepot
  • 8,408
  • 2
  • 20
  • 30