Cannot embed Google Drive Files in an iframe

13
votes

I recently had a problem with the Google Drive API displaying my documents. We have developed a web application that is connecting to Google Drive accounts to retrieve a user's drive files, then display in an iframe the file using its embedUrl/alternateUrl.

This has worked fine for us in the past, but suddenly files other than Google Documents stopped displaying: html files, text files, doc files... even images!

The error I get is Refused to display 'https://docs.google.com/file/d/0B_JkNS6Wu4b5R2c0YlJSN0oyQUE/edit?usp=drivesdk' in a frame because it set 'X-Frame-Options' to 'SAMEORIGIN'.

I understand the error, it means that Google is preventing the display of documents outside of the Google domain, but the question is "why suddenly now", and how to circumvent it.

If someone stumbled upon the same issue and have found a solution, I'd be glad to hear.

Thank you kindly.

2
iframegoogle-drive-apigoogle-docs-api
I've found the following questions on the topic, but no descriptions as to why it is no longer working: stackoverflow.com/questions/21367610/… - Rivero
stackoverflow.com/questions/9103154/… - Rivero
Same problem too. I'm trying to embed a PDF on my CMS, but no chances. I've tried to generate a public link to allow embeding, but the problem persists. - jeferod83
@jeferod83 did u find any solution for it. I need o use view link because i need download and print tools in the view - sowmya

2 Answers

25
votes
https://docs.google.com/file/d/0B_JkNS6Wu4b5R2c0YlJSN0oyQUE/preview?usp=drivesdk

Use preview instead of edit in the URL. It will work.

0
votes

I had the same issue and found the following workaround showing the google drive files as webpage ressources https://support.google.com/drive/answer/2881970?hl=en

This means you have to extract the [doc id] from your url and change your link to: http://www.googledrive.com/host/[doc id]

Please note: in this case the google drive controls are not shown.