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

痞子三分冷 提交于 2019-11-26 01:10:56

问题


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


回答1:


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

https://drive.google.com/uc?export=view&id={fileId}

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.




回答2:


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/<folderID>/<filename>



回答3:


Here's the simple view link:

https://docs.google.com/uc?id=FILE-ID

e.g. https://docs.google.com/uc?id=0B9o1MNFt5ld1N3k1cm9tVnZxQjg




回答4:


here is how from @ https://productforums.google.com/forum/#!topic/drive/yU_yF9SI_z0/discussion

1- upload ur image

2- right click and chose "get sharable link"

3- copy the link which should look like

https://drive.google.com/open?id=xxxxxxx

4-change the open? to uc? and use it like

<img src="https://drive.google.com/uc?id=xxxxx">
  • its recommended to remove the http: or https: when referencing anything from the web to avoid any issues with ur server.



回答5:


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:

https://googledrive.com/...

  • Drag and Drop that url into a new tab. Copy and paste the url and share or embed it anywhere you like.

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:

  • right click on the file in question and select "Open with>Manage apps":

  • Untick the file-associated apps here
  • Optional: Reload Google Drive
  • Right click on the file and select "Details"
  • Proceed as in step #4

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




回答6:


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={fileId}



回答7:


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...




回答8:


From google drive help pages:

To host a webpage with Drive:

  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.

Anyone can now view your webpage.




回答9:


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.


So now that you have your "Folder ID", take the above formula "https://googledrive.com/host/(folder id)"
Example 1 https://googledrive.com/host/0B3UALYkiLexYSXZlcldoU2NpYXM
Example 2 https://googledrive.com/host/0B3UALYkiLexYRkNnOVhsUVozRU0


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.


End Edit)

https://www.youtube.com/watch?v=QmN22LMPdDk&feature=youtu.be

Or you can just follow the written ones below.

These pictures go with the ones listed in the steps.

https://googledrive.com/host/0B3UALYkiLexYSXZlcldoU2NpYXM/

  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)




回答10:


Vetea, if you take the link from picture URL, it does not work, but if you take it from the field "Direct Link" it should work. I have used and tested it in multiple occasions.




回答11:


Solution provided by Niutech worked for me i.e.

http://googledrive.com/host/<folderID>/<filename>

But there are 2 outstanding issues

  1. You cannot have 2 files with the same name in the same folder in the drive else this link won't work.

  2. It is not yet clear but Google seems to be planning to deprecate image hosting via drive. please see the link below. https://support.google.com/richmedia/answer/6098968?hl=en




回答12:


There is a filetype option in the Google Drive API. You could, maybe, check if that resolves to a valid image. I'd look at an option where if the filetype gives me an invalid image, then get a new direct URL for the file. I haven't figured out exactly how to do this though, but maybe that's a path to try.




回答13:


You can do it directly from Drive & Gmail. Here's how:

1.Upload an image to Google drive and set permissions for viewing (can be public OR anyone w/ link)

  1. Go to Gmail>Compose. Select the + next to attachment icon.

  2. Select drive icon (triangle shape)

  3. Navigate to your image and right-click copy image url

  4. Paste into web browser or embed on webpages as needed.




回答14:


Con can disable javascript in your browser open the image file and in the view page source or right click on the image, you will see the image link. ( check share preference before )




回答15:


For images, open an image in google viewer. i.e.

Method 1

https://docs.google.com/file/d/0Bz7qe_olclTwWDNJRDRmb1pJamM/edit

then view source> find word "texmex-thumb" and aside it there will be link.




回答16:


However this answer is simple, infact very simple and yea many have mentioned it that simply put the id of image into the following link https://drive.google.com/uc?export=view&id={fileId}

But however easy that is, I made a script to run in the console. Feed in an array of complete sharable links from google drive and get them converted into the above link. Then they can be simply used as static addresses.

array = ['https://drive.google.com/open?id=0B8kNn6zsgGEtUE5FaGNtcEthNWc','https://drive.google.com/open?id=0B8kNn6zsgGEtM2traVppYkhsV2s','https://drive.google.com/open?id=0B8kNn6zsgGEtNHgzT2x0MThJUlE']

function separateDriveImageId(arr) {
for (n=0;n<arr.length;n++){

str = arr[n]

for(i=0;i<str.length;i++){
if( str.charAt(i)== '=' ){
var num = i+1;
var extrctdStrng = str.substr(num)

}
}
console.log('https://drive.google.com/uc?export=view&id='+extrctdStrng)
window.open('https://drive.google.com/uc?export=view&id='+extrctdStrng,'_blank')
}


}
separateDriveImageId(array)


来源:https://stackoverflow.com/questions/10311092/displaying-files-e-g-images-stored-in-google-drive-on-a-website

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!