Load GDrive gdocs in an iframe - google-drive-api

How do I load a gdocs/etc file in an iframe within my web app?
Similar to how Dropbox loads in a gdoc file within their web app.
https://developers.google.com/drive/api/v3/reference/files.
Currently I am wiring the webViewLink into an iframe, the file loads,
but if you click on the gdocs header logo icon, the iframe will then crash.
Thoughts?
Thanks
<iframe src="https://docs.google.com/document/d/1lnFHup_-1XA0ollcwkjg6Y_NejiCxOmvuVlOvYk1yUo/edit?usp=drivesdk" width="100%" height="100%"></iframe>

Related

Open iFrame doc hyperlinks in new window instead of within iFrame window

This is a size chart document embedded using iFrame. The document was created with Google Sheets. Each size has a hyperlink. Clicking on the links opens the specific URL for each size. However, the URLs only open within the iFrame window and I would like them to open on the full page.
https://www.wildeones.com/ring-size-chart/
This is the code I used:
<iframe src="https://www.wildeones.com/wp-content/uploads/2022/06/Ring-Size-Chart.pdf" width="100%" height="550px"></iframe>
Thanks,
Jerome

Embedded .htm iframe downloading instead of displaying

I'm using an iFrame to host an HTM form on a Wordpress page. The iframe displays the form on our site so that users can interact with it on the webpage. The .htm file is hosted on dropbox and the iframe code looks something like this:
<iframe src="https://dl.dropboxusercontent.com/spa/numbers/file/file.htm" width="1000" height="4100" frameborder="0"></iframe>
In the past, this has worked fine. The form has displayed perfectly on our site. Recently however, for some users the .htm file automatically downloads when the page is loaded, for others it displays correctly.
When viewing other stackoverflow posts, I've seen users say that the Content-Type of the .htm file needs to be 'text/html;charset=UTF-8' and after checking, that is what our files are set to.
I am completely lost. We haven't changed anything in months, so this is not the result of user error. It randomly started happening this week.

How do I embed a Google Drive document into my Weebly site?

I'm trying to embed my resume into a page on my weebly website. I've saved the file as a pdf, allowed link sharing, and followed the steps for embedding documents from Google docs. I've gotten as far as getting the file to display within the weebly app, but it doesn't appear live on the site once I publish it. The page just appears blank, though additional space appears to be taken up. Perhaps an important note is that I'm using my ipad to do this.
Here is the custom HTML code I'm using within iframe generated from the above mentioned website:
<iframe style="width: 900px; height: 900px;" src="http://docs.google.com/gview?url=https://ivanglinski.weebly.com/uploads/5/7/9/5/57950797/ivan_glinski_resume_3_24.pdf&embedded=true" height="240" width="320" frameborder="0">
Every Weebly site comes with an "Embed Code" element which is available in the Weebly Editor (while building/editing/updating your site and its pages).
Get the "embed code" from Google for the GDrive doc you want to embed.
Drag an instance of the "Embed Code" element onto the page of your Weebly site where you want the GDrive doc to be displayed.
Click on the element you just instantiated, and paste the "embed code" from Google for the GDrive doc (from step 1) into the appropriate configuration field of the Embed Code element.
Publish your site
Test things are working, and if not, you may need to adjust permissions on the GDrive doc.

HTML - embed pdf file from the dropbox with pdf viewer (online)

I have a link to pdf file that located in the my Dropbox folder.
For example: https://dl.dropboxusercontent.com/1/view/gqo4etwy7nudtu2/JasperReports-Server-Visualize.js-Guide.pdf
By clicking on the link, I may download the file.
I want to embed the file on my site. I use the following code:
<iframe src="https://dl.dropboxusercontent.com/1/view/gqo4etwy7nudtu2/JasperReports-Server-Visualize.js-Guide.pdf?preview" height="100%" width="100%">
This browser does not support PDFs. Please download the PDF to view it: Download PDF
</iframe>
I tried to set two files, the link above and another one that I found on Google.
The link above unable to embed, and it's opened for download, all the other files embedded successfully.
How can I embed pdf file from Dropbox?
Found the Dropbox Embedder but not yet tested:
You need to create an account in the App Console and create an app to get the app key:
<script type="text/javascript" src="https://www.dropbox.com/static/api/2/dropins.js" id="dropboxjs" data-app-key="YOUR_APP_KEY"></script>
Then you embed a Dropbox PDF file with the anchor tag:
<a
href="https://www.dropbox.com/s/u0bdwmkjmqld9l2/dbx-supporting-distributed-work.pdf?dl=0"
class="dropbox-embed"
data-height="300px"
data-width="600px"
></a>
More info here.

How to read PDF file from remote server and display with Iframe

iframe src="https://127.0.0.1/test/helloworld.pdf" height="100%" width="100%"></iframe>
I'm working on a Web Application (jsp) project where it will display the pdf content using Iframe on the web page. However, the file is situated on other remote server/file server. Is there a way for me to retrieve a file from other server and display on my Web Application via iframe?
Doubt it. Opening PDF in your browser - is your browser settings. If my browser can't open PDF in browser - i can't see it.
Look this question on StackOverflow
I just found the solution on this, we can write a java to read the PDF file from remote server and encode it to base64 string. Then, display it on the iframe src.
<iframe src="data:application/pdf;charset=utf-8;base64,-basepdfstringOutput-></iframe>