I am building a web application and there is a shared drive on our server that all the pictures are on. I want to be able to access that drive and its folders so that I can display images inside of them. This is so that we can easily add and remove pictures from the folder outside of the app if need be. However I cant get the file path to link to the folder.
This is what I'm using based on what i have read online
<img src="file:///C:/pictures/deere.jpg">
but this is not doing anything. Any Ideas?
Basically the only way that I was able to get it to work the way I wanted was that I created a symbolic link to my application folder and then I was able to get it to work between drives
Related
I'm storing html files to a OneDrive folder.
The repro is trivial.
In your onedrive, create a folder named repro.
Upload one image, for example image.jpg.
In this folder, create an html page and try to dislay the image.
Link is broken.
My page contains these 2 kind of links.
This link is not clickable (but I right click, open in new tab, it works)
<img width="100%" src="/personal/user_test_domain_com/Documents/repro/image.jpg">
This image gets broken. But if I right click, open image in new tab, it works.
Click link to open the image
It looks like Onedrive has a kind of protection that prevents displaying the images stored in onedrive. I tried to store the image in Style Assets folder as well and it didn't work.
We are developping a product where an archive of a discussion is stored as an html file in the personal onedrive of the user.
It is important that the images be displayed correctly.
What syntax should we use? Is there a way to use and iframe, an embedded component to display the images correctly in the page.
Images and html files are stored in the same location in the onedrive of the user.
I am trying to use Google Drive's api to essentially host and link to images from an external site.
The problem I'm encountering, is when people upload a bunch of photos in the provided folder, I seem to only be able to use the webViewLink to view individual photos. I noticed that in the google drive folder, there is a very convenient photo preview that lets you click left and right to browse photos.
I was wondering if this preview view is possible to be linked to directly. It doesn't seem like the url changes but if this is possible, any help to achieve this would be greatly appreciated.
Thanks!
If your user has permission to view the folder, you can use the embedded folder view to embed a view of the folder, which should show all the images contained within.
The URL pattern looks like https://drive.google.com/embeddedfolderview?id={{folderId}}#grid where {{folderId}} is the ID of the drive folder.
That gives a nice preview, but requires the user has view access on the folder. If they do not, you'll need to auth the request with your own token so that it will render properly for the end user.
Can I use images stored in Google Drive to be used in a website by the html,<img src="<webContentLink>" /> ?
Where <webContentLink> is returned after a file is uploaded and is in the format, 'https://drive.google.com/uc?id=<FILEID>&export=download'
I have a small website created for account users only. They can upload files to their google drive folder and this folder has permissions set to share with the accounts of the other users (specific people only). This is an ASP.NET MVC 5 website using the Google API Client Libraries for .NET.
In Chrome and Firefox the images display fine, in IE and Safari they don't show and return a 302 status code. Sometimes if you view the image directly in a new tab and then refresh the web page it shows. It might also show if the folder permission is set to 'anyone with the link', but this isn't ideal.
The documentation (https://developers.google.com/drive/v3/web/manage-downloads) says, 'If you want to allow a user to view a file directly in a web browser instead of through the API, use the webContentLink.' I understood this to be okay to use img src='' to display an image directly without the API, however it then goes on to say, 'You can either redirect a user to this URL, or offer it as a clickable link'.
So can Google please confirm if 'webContentLink' can be used in img src='', or not and why it works in some browsers and not others? I've read many posts on this, some old, some more recent. If it's not to be used in img src I think it should be made clear in the documentation.
Many thanks
Yes, you can definitely use webContentLink as your img src in your HTML page. I tried and this is what I got on my sample HTML page.
<img src = "https://drive.google.com/uc?id=0Bzgk4zncCwI7aDZCSHY4YU0zNUF&export=download">
webContentLink can be obtained using Files.list and place 'files' in the fields parameter.
Displaying an image from Google Drive can be done in 3 steps:
Retrieving your image ID
Right click on your image and select Share.
You'll see a link that you need to copy. You will extract the image's ID from the URL.
Here is what your sharing link should look like:
https://drive.google.com/open?id=YourFileId
Check your sharing settings
Your images will only be visible to people who have access to those files. To allow anyone access to your images, you need to set the sharing setting as Visible with the link.
Display your image
With your sharing settings properly configured and your image file IDs at hand, you can now specify how your images will be displayed using a prescribed format.
https://drive.google.com/thumbnail?id=YourFileID
More details can be found here
when I do this I just get a sign like an nonexistent image.
Why?
I just copy paste this line:
<img src = "https://drive.google.com/uc?id=0Bzgk4zncCwI7aDZCSHY4YU0zNUF&export=download">
JS Fiddle
does anybody know if it's possible to dynamically show the content of a Drive folder on a website? For example, I have a Drive folder with an pdf and two Google Docs. I want these three items displayed on the site in a list, like:
Document1.pdf
Document2.docx
Document3.docx
Now, If I upload a fourth document into the folder, the site should also display it:
Document1.pdf
Document2.docx
Document3.docx
Document4.docx
Any ideas on that?
I have made a page in html5 with css3. It works fine on local (I dont use any server, just doubleclick in the index to open it).
I want to put it in google drive. I have load all the documents needed, but when I try to open the html, I can only see the text (I mean, it is not being executing, I can see just the source code).
Any suggestion?
Not available any more, https://support.google.com/drive/answer/2881970?hl=en
Host web pages with Google Drive
Note: This feature will not be available after August 31, 2016.
I highly recommend https://www.heroku.com/ and https://www.netlify.com/
EDIT: As of August 2016 Google Drive can no longer be used to host static web pages, so this solution no longer works.
Create a new folder in Drive and share it as "Public on the web."
Upload your content files to this folder.
Right click on your folder and click on Details.
Copy Hosting URL and paste it on your browser.(e.g. https://googledrive.com/host/0B716ywBKT84AcHZfMWgtNk5aeXM)
It will launch index.html if it exist in your folder other wise list all files in your folder.
I don't think it is necessary to "host" the content using the way from the accepted answer. It is too complicated for a normal user with limited developing skills.
Google actually has provided hosting feature without using Drive SDK/API, what you need is just few clicks. Check this out:
http://support.google.com/drive/bin/answer.py?hl=en&answer=2881970
It is the same to the answer of user1557669. However, in step 4, the URL is not correct, it is like:
https://drive.google.com/#folders/...
To get the correct host URL. Right click on the html file (you have to finish 1-3 steps first and put the html in the public shared folder), and select "Details" from the context menu. You will find the hosting URL right close to the bottom of the details panel. It should look like:
https://googledrive.com/host/.../abc.html
Then you can share the link to anyone. Happy sharing.
Now you can use
https://sites.google.com
Build internal project hubs, team sites, public-facing websites, and more—all without designer, programmer, or IT help. With the new Google Sites, building websites is easy. Just drag content where you need it.
While drive allows you to edit plain text and HTML files I don't believe they allow the HTML to actually be displayed. I don't think they want people hosting websites from their drive space.
A lot of the solutions offered here do not seem to work anymore. I'm currently on a chromebook and wanted to view an HTML5 banner. This seems impossible now through Google Drive or other apps (as mentioned in previous comments).
The method I ended up using to view the HTML5 was the following:
Open Google Adwords (create a free account if you dont have one)
Click on Ads in the top panel
Click on "+AD" and choose image ad
Choose "upload an ad"
Drag and drop your zip file into the area
Click on Preview
Voila, you will see your HTML5 banners in their full beauty
There may well an easier way, but this way is pretty good too. Hope it helps and worked well for me.
Create a new folder in Drive and share it as "Public on the web."
Upload your HTML, JS & CSS files to this folder.
Open the HTML file & you will see "Preview" button in the toolbar.
Share the URL that looks like www.googledrive.com/host/... from the preview window and anyone can view your web page.
Found method to see your own html file (from here (scroll down to answer from prac): https://productforums.google.com/forum/#!topic/drive/YY_fou2vo0A)
-- use Get Link to get URL with id=... substring
-- put uc instead of open in URL