<body>
<iframe src='howto.pdf' height='800px' width='500px'> </iframe>
</body>
This code works fine(show iframe)when i just simple open howto.php in a browser. But when i open this php file in localhostserver it doesn't show the iframe, idm poup and say us to download the file. (( i save this file as howto.php ))
if your pdf has a public url you can use google pdf viewer in this way
<iframe src="http://docs.google.com/gview?url=yourPdfUrl&embedded=true" style="width:800px; height:500px;" frameborder="0"></iframe>
replace yourPdfUrl with your real pdf url e.g. http://www.example.com/myDoc.pdf
Related
I have a language course consisting of a pdf and an mp3 file.
My goal is to show the pdf file in the browser, with a button that launches the audio file from VLC.
If I try the various parts individually (button or pdf) they work.
The button without pdf works. When I press it, it shows me the VLC mp3 file.
The Pdf file without button is correctly shown.
But when I put them together (button and pdf together), I only see the pdf file and I don't see the button anymore.
I have the impression that the pdf hides the button.
I don't know how to show the button together with the pdf.
Is there anything I can do?
Thank you.
The code I use is this:
<HTML>
<BODY>
<form method="post">
<input type="submit" name="forward" value="forward">
<?php
$name = 'C:\Users\io\Desktop\Vol_1.pdf';
$content = file_get_contents($name);
header('Content-Type: application/pdf');
header('Content-disposition: inline; filename="' . $name . '"');
echo $content;
if ($_POST["forward"]??0) {
system("vlc C:\Users\io\Desktop\a.mp3");
}
?>
</form>
</BODY>
</HTML>
You can try this, Much simpler and without php or vlc:
<audio controls>
<source src="a.mp3" type="audio/mp3">
Your browser does not support the audio element.
</audio>
<!-- <object width="1024" height="900" type="application/pdf" data="Vol_1.pdf?&scrollbar=0&toolbar=0&navpanes=0" >
<p>Insert your error message here, if the PDF cannot be displayed.</p>
</object> -->
<iframe src="Vol_1.pdf" style="width:1500px; height:800px;" frameborder="0" allowfullscreen="true"></iframe>
You can choose between object or iframe as you like.
That way you have both pdf and mp3 on the page, and you don't even have to reload the page when you click the button.
Sorry, I mis-read the question and I thought the file was being used as an upload.
I believe you cannot achieve what you are looking to do. You are telling the browser to display a PDF. It will not render an HTML form at the same time as displaying a PDF.
Instead you could force the PDF to open in a separate tab and display the HTML form in the active tab. The user could then play the media file using the submit button and switch to the tab with the PDF to read the document.
For forms with documents the form enctype needs to be set:
<form method="post" enctype="multipart/form-data">
I want to embed pdf files in my html ( either using the embed tag or the iframe tag ).
I've tried the following two. All work well on firefox but not on chrome, chromium and android browsers.
<embed type="application/pdf" src="myfile.pdf"></embed>
<iframe class="embed-responsive-item" src="myfile.pdf" allowfullscreen></iframe>
I've also tried reading the pdf file with php and then using an iframe to display it like this
header("Content-type: application/pdf");
header("Content-Disposition: inline; filename=".$_GET['pdf']);
#readfile($CONFIG['PDF']."/".$_GET['pdf']);
Again, this doesn't work on chrome / chromium and mobile browsers. It only works on desktop firefox.
I'm not sure if this is important information but I've also Set the X-Frame-Options "ALLOW-FROM mydomain.com"
Here you will find an example of what the issue is.
Is there any other way that I can embed a pdf file on a web page?
The Chrome browser on Android no longer supports PDF embeds. You can get this by using the Google Drive PDF viewer:
<embed src="https://drive.google.com/viewerng/
viewer?embedded=true&url=http://example.com/the.pdf" width="500" height="375">
You can also use Google PDF viewer for this purpose. You need to upload your PDF somewhere before and just use its URL:
<iframe src="http://docs.google.com/gview? url=http://example.com/mypdf.pdf&embedded=true" style="width:718px; height:700px;" frameborder="0"></iframe>
I want to embed pdf file in my website from /var/www/pdf/ directory. I have hosted my webpage at /var/www/html/portal/index.php. I tried following ways
1) using embed
2) using iframe
<iframe src="../../pdf/ebook.pdf" width="900" height="750" frameborder="0" allowfullscreen></iframe>
3) using object
<object data="../../pdf/ebook.pdf#scrollbar=0&toolbar=0&navpanes=0" width="900" height="750" type="application/pdf">
<p>PDF cannot be displayed</p>
</object>
None of them working, but if I place the pdf file /var/www/html/pdf/ folder it is working fine.
For my requirement, I cannot keep the file in the web directory because public can access the PDF file directly using URL without login in to my web portal. And Also google also can index my PDF file from public search
Please help me to embed pdf
Thanks in advance
You can do it by .htaccess
First : prevent direct access to open pdf file
Refer this questions and answers
Second: prevent Search engine indexing
Refere this
Hope it will work. I try to give this information in comment but it is not displaying properly there.
I found solution using php script
header("Content-type: application/pdf");
header("Content-Disposition: inline; filename=filename.pdf");
#readfile('../../pdf/ebook.pdf');
I need to display a PDF on a website and have it embedded inline.
The following code works if the data attribute is local, but not remote. I just get a large grey box in place of the PDF. I'm open to any solution as long as it works in all browsers. We are using Rails 3 and jQuery.
<object data='https://remotesite.com/uploads/pdf/5/mypdf.pdf' type='application/pdf' width='100%' height='100%'>
<p>
It appears your Web browser is not configured to display PDF files.
No worries, just <a href='https://remotesite.com/uploads/pdf/5/mypdf.pdf'>click here to download the PDF file.</a>
</p>
</object>
And i try this code
<iframe src="http://people.seas.harvard.edu/~chong/pubs/oopsla04.pdf" width="100%" height="300">
<p>Your browser does not support iframes.</p>
</iframe>
But not work with Arabic file like " ملف المتسابقين.pdf"
Thanks,
Is there any way i can load PDF file (its contents) in a div or iFrame?
I have a bunch of PDF files on a server and, ideally, i need to have a button 'Show file' on a page, clicking on which will load the contents of selected file in a div(iFrame).
You can also use google pdf view by using iframe on your page :
<iframe src="http://docs.google.com/gview?url=http://infolab.stanford.edu/pub/papers/google.pdf&embedded=true" style="width:600px; height:500px;" frameborder="0"></iframe>
Instead of this in above code :
http://infolab.stanford.edu/pub/papers/google.pdf
Use your own PDF file path.
You can view the demo here.
http://googlesystem.blogspot.in/2009/09/embeddable-google-document-viewer.html
It's just a suggestion. No downvotes please.
Google's gview is sometimes unresponsive and given 204 status. Here is the best free alternative.
https://stackoverflow.com/a/66548544/2078462