Im trying to view a pdf file using html. But whenever i try to open it, the browser download the file instead of viewing it.. I dont know whats wrong. I tried embed and iframe and both results the same thing. It downloads the file.
Thing is when i see other websites, it works. so i know for sure its not because extension problems. checked the pdf viewer extension and its on.
Here is my code. how is this happening??
<div class="row">
<div class="col-sm">
<p><span class="fw-bold">DOKUMEN : </span></p>
<iframe src="http://127.0.0.1:8000/docs/testpdf.pdf" width="100%" height="100%" style="border: none;"></iframe>
<embed src="http://127.0.0.1:8000/docs/testpdf.pdf" type="application/pdf" width="100%" height="600px" />
</div>
</div>
Some browsers like IE dosent have the proper plug-in to render embedded PDF. You better work with browsers like firefox or chrome. Here is a page that answered your question before.
downloading PDF embedded file instead of viewing it
Related
i have a php page which shows a list of invoices. clicking on any of those invoices shows its pdf file. When the user clicks on any invoice, the src of the embed tag is changed by jQuery to the appropriate pdf file.
Works very well, but strangely enough it behaves differently in safari then in firefox for instance.
In firefox i can just click on an invoice -> the pdf shows. if i right after that click on another invoice and after that click on the first invoice again -> the pdf shows again.
Safari: If i re-click an invoice, i get a blank pdf (embed tag). And downloading of that pdf results in a 0kb file.
Seems to only happen in safari.
Has anyone encountered this before and maybe know a solution to this issue?
i have googled and tried a lot but it's still not working.
Html:
<div class="card-body">
<embed id="invoice_scan" src="" type="application/pdf" width="100%" height="400px" />
</div>
jQuery:
$('#invoice_scan').attr('src', '/docs/pdf_file1.pdf );
I had this issue showing a pdf in an object tag using angular.
The fix was to remove type="application/pdf" from the object tag.
I have a similar issue with Safari 15.5 with <object> tag. As soon as PDF gets loaded, it was crashing the browser. I removed type="application\pdf" conditionally for safari. That seems to be working.
Alternate option would be use iFrame for PDF's.
Why is this code failing on MacOS Big Sur Safari?
I'm trying to troubleshoot a strange bug on one of our pages (https://www.bbg.org/visit/sakura_matsuri_photos).
The bottom of left of the page has the text 'cp_vimeo_code.js Open' and I can't figure out what is generating this.
here is what it looks like
I've noticed that there are other websites that show this error too, for example: https://www.indicia.nl/project/anderson-macgyver/.
I have the following three embeds inside the body tag of a webpage in Expression Engine. Taking them out eliminates the error.
<div class="videoWrapper">
<iframe src="https://player.vimeo.com/video/210978232?title=0&byline=0&portrait=0" width="540" height="304" frameborder="0"></iframe>
</div>
<div class="videoWrapper">
<iframe src="https://player.vimeo.com/video/210978156?title=0&byline=0&portrait=0" width="540" height="304" frameborder="0"></iframe>
</div>
<div class="videoWrapper">
<iframe src="https://player.vimeo.com/video/160249045?title=0&byline=0&portrait=0" width="540" height="304" frameborder="0"></iframe>
</div>
Has anyone seen something like this before? I can't find it on Vimeo's site anywhere.
Here is a picture of the error on our page
It looks like this is a call from an addon, that's trying to load a .js file for use in the control panel. However, since you're not in the CP it'll show the call as text.
Maybe see if the addon needs updating, or, since there are a lot of video player addons that have been abbandoned, need replacing
More indepth answers can be found on EE's own Stack: https://expressionengine.stackexchange.com/
I finally figured where this was coming from, it was some extra code in a Google Tag Manger custom tag!!
I'm working on a project which needs to open a PDF from a local path in a dialog box. I am able to open the PDF from a normal chrome browser but I am not able to open the same PDF from chrome mobile version view(inspect element-console). I have seen so many links suggested to open from google drive, but it cannot open the PDF if the internet connection is not available. How can I achieve this without google drive process. Please help me out from this problem, thanks in advance. The code which I written so far.
Note: I am restricted from using jQuery in this project, only JavaScript is allowed.
function pdf(objFRM, local_src){
document.getElementById('dialog').style.display = 'block';
document.getElementById(objFRM).style.display = 'block';
document.getElementById(objFRM).src = local_src;
console.log(document.getElementById(objFRM).src);
}
<a onclick="pdf('iFrame', 'assets/pdf/sample.pdf')"><button class="gray-button">Manual</button></a>
<div id="dialog" style="display:none;">
<div class="modals">
<iframe id="iFrame" type="application/pdf"></iframe>
</div>
</div>
I have heard about an issue with Chrome where PDFs won't display/render, but work just fine in other browsers. Try using a different browser to make sure the issue isn't with Chrome itself.
If this is a local website,
assets/pdf/sample.pdf
would only work if your code files are in the folder with assets.
Afaik there is no built in PDF-Viewer in the mobile version of chrome. So you need to install a separate PDF-Viewer App to display PDFs. What you could do is offer the mobile users a link, where they could "download" the file to open it in an external viewer:
<a id='myPDF'>Get Me</a>
document.getElementById(objFRM).href = local_src;
Usage of 'iframe' is discouraged these days for security reasons. Although for resources, in the same origin it won't be a problem. But I would suggest using embed or link tag for it. To open/pop-up a pdf, you can also use target attribute from 'anchor' tag.
<object name="frame_1" data="/assets/template/test_pdf.pdf" type="text/pdf" width="600" height="500">
<embed src="/assets/template/test_pdf.pdf" id="embed_pdf"></embed>
</object>
<link rel="import" name="frame_2" href="/assets/template/test_pdf.pdf">
<a target="frame_1" href="assets/template/test_pdf2.pdf" class="btn btn-raised btn-info">Load PDF</a>
<a target="frame_2" href="assets/template/test_pdf3.pdf" class="btn btn-raised btn-info">Load PDF</a>
I am using this code to display pdf in browser
<embed src="D:\Books\Git\Scott.pdf#toolbar=0&scrollbar=0&statusbar=0&navpanes=0" width="500" height="500">
I want only simple pdf in browser to display without giving any option like download, print to the user. This code is not working for me. Please help
I have a web service which will return pdf stream for a given document id and I will set the content type to application/pdf and write the out put to IFRAME upto this point I am done and OK!
My problem is :
My requirement is to disable the pdf download toolbar button in IFRAME, is there any way using JavaScript or j query to disable the PDF toolbar buttons,
i tried some thing like this:
<iframe src="view/1.pdf?page=hsn#toolbar=0" width="875" height="95%" id="iframe11">
<p>Your browser does not support iframes.</p>
</iframe>
I tried setting toolbar=0 for iframe tag but it dint work.
an anyone please tell me how to achieve this ?
I hope I am not very late to reply. But here's is something you can do to prevent the users. Use iFrame to display your PDF and make sure that you are displaying using Google. I used the following code :
<iframe src="http://docs.google.com/gview?url=http://www.tutorialspoint.com/php/php_tutorial.pdf&embedded=true" style="width:600px; height:500px;" frameborder="0">
</iframe>
Here you can simply change the url=http://www.tutorialspoint.com/php/php_tutorial.pdf and replace it by your own URL where you kept your PDF.
Use embed tag instead iframe tag:
<embed src="http://localhost/yourpdf.pdf#toolbar=0" style="width:600px; height:500px;">