I am really having a hard time opening up certain .pdf files within an iframe HTML element. I can open some .pdf files in this iframe, but not all of them. The ones that I cannot open were created by the Crystal Reports engine in Visual Studio 2010.
My source is simple and looks like the following:
<iframe src= "c:\jnk\EULA.pdf">
</iframe>
Is there any characteristic of a .pdf file that could prevent it from being displayed in an iframe? I am using IE8, but get the same results in FF. I also can perfectly display this .pdf file when it is not in an iframe.
IFrame isn't correct solution. You can use other solutions :
1 . <embed src="file:///C:\jnk\EULA.pdf" width="500" height="375">
2 . Download this library and use it.
I hope that I helped.
PS
Remember that when we use local file, we should write in prefix file:///
Sorry for my English
Based on a comment of yours, it sounds like your issue is one of permissions, unrelated to PDFs.
If I were you, I'd make sure that I can access the PDFs in my browser outside of any HTML. If that fails, you know you have a problem.
Related
i started yesterday with html and I have issue. Everytime I try to open it in the website it shows just a black thing. This is the code:
<img src="Users\mkotz\OneDrive\Desktop\Eternity.gif"height="450"width="150"
loop="true"
autoplay="true">
Everything seems to be alright with the code but the path you are referring to might be invalid. You should be considering using a path referring to the website and further its files.
In web development you should folder all your files something like this:
Add your image files always to the resources folder. Then you can refer to it from the index.html by saying src="./resources/<image_name>.gif" and so on.
The link is probably invalid, Check that and try again.
I'm building a very simple component in Vue to preview PDF files and images in a modal.
I'm using Vue Boostrap's modal component. In the body of the modal I have the following line:
<embed :src="fileSrc" type="application/pdf" height="100%" width="100%">
fileSrc is a prop that the component receives.
When the modal is launched, the PDF visualizer doesn't show and Google Chrome emits a warning saying:
Flash is blocked on this page
I have allowed flash to be displayed on the page but still doesn't work.
If I remove the type="application/pdf" attribute and the fileSrc is a JPEG file, it shows up just fine.
I've also tried with the <object> tag with no luck.
What should I check? What am I missing?
Edit: Why is this question not a duplicate?
Because I wan't to be able to use the <embed> tag to support not only PDF but also images for previewing. The examples in this page work without enabling Flash and without warnings, so I should be able to reproduce this behavior.
I found the answer.
The files I was trying to display with the <embed> were being uploaded to a bucket in AWS S3. When uploading the files (with a PHP script), the Content-Type metadata needed to be set accordingly to the file (i.e. application/pdf for PDF files).
The files were being uploaded with a default Content-Type value, thus the browser didn't know what to do with it once placed in a <embed> tag (the Content-type is used to determine which plugin to choose to display).
I found this method to be very easy to implement as a generic file previewer.
I'm having issues with the download attribute and overwriting the filename. Currently when I set a value for the download attribute it is not taking affect. I believe this as something to do with the specific file I am referencing as it works for other files, but I'm not sure exactly what is causing the issue or how to resolve.
In the below code the filename does not get overridden. (I stole the code straight from W3Schools to keep the example very basic and to ensure nothing I am doing is creating the issue.)
Additional, the download only works in Chrome. If you try in Firefox it opens the file to play the video (which is another issue that I need to resolve).
<a href="https://cameratag.com/videos/v-c1e97800-8f2b-0132-12e6-22000a8c0328/qvga/mp4.mp4" download="w3logo22">
<img border="0" src="/images/myw3schoolsimage.jpg" alt="W3Schools" width="104" height="142">
</a>
Resolved, I contacted the content provider and determined the issue is due to the fact the assets URLs are actually redirects to a signed URL on their CDN.
For a CMS-like web app we are writing, we need to show a preview of an Excel file.
We try with the <object> tag, setting the data attribute like this:
data = "myFile.xls"
but we didn't succeed. The page, in IE and Chrome, alert that we don't have the necessary plugin, even if we have Office installed.
Does anyone have any experience in such a task?
IE7 fails to display any contents in dynamically generated url inside the <object> element. Here's an example for loading pdf documents:
<object data="http://localhost:8080/Documents/Query?Id=document123&Session=1510" width="600" height="400"></object>
The above code will fail to load, however, if I copy and paste the url into the browser's navigation bar, the pdf document will load just fine. If I then manually save the pdf file and replace the object tag with the code below, it works just fine.
<object data="document123.pdf" width="600" height="400"></object>
Is there a work around for this?
It's hard to be sure exactly what the problem is without knowing more about your development platform and possibly seeing some of the code for Query. But my guess is that it's down to the mime type that the server is presenting.
You should send the mime type header as application/pdf.
Just came accross this issue myself.
I don't know if yours was the same problem as mine but if you are using the following:
Response.AddHeader("Content-Disposition", "attachment; filename=...
Remove it, keep the content-type as "application/pdf" but don't assign a disposition, that way it will be processed as an outright file and not as an attachment to be downloaded.