The code on the html page is:
View report in a new window
Once any user clicks on it, it becomes downloaded (it is a .png file) by his browser and he is able to view it.
How can we make it opened in a new window instead?
In anchor tag give the URL of the PDF embedded page and In the PDF Embedded page, try iFrame to display the PDF, It will work
PDF IFrame :
<iframe src="http://docs.google.com/gview?url=http://ocw.mit.edu/courses/mechanical-engineering/2-000-how-and-why-machines-work-spring-2002/tools/html.pdf&embedded=true" style="width:600px; height:500px;" frameborder="0"></iframe>
Fiddle : http://jsfiddle.net/RYh7U/69/
IMAGE IFrame :
<iframe src="http://upload.wikimedia.org/wikipedia/commons/e/eb/Ash_Tree_-_geograph.org.uk_-_590710.jpg">
</iframe>
Fiddle : http://jsfiddle.net/RYh7U/70/
Q: Do you mean "getReport.php?id=123" isn't rendering as a .png image (it's asking the user to download)? Or is it displaying as an image, but you want it to display in a new, separate window?
If the former, you need to make sure the server sends the correct Content-type (e.g. "image/png").
If the latter, just do a Javascript "window.open()" (or equivalent)
======== UPDATE =======
My 1990's heritage with Javascript 1.2 is catching up with me :) Don't use "window.open()" - do as Pandian says and use if you want to implement a pop-up window. Here are more details:
http://javascript.info/tutorial/popup-windows
By the same token, your question is vague. If the problem is that the file is asking you to "download" (if the image isn't appearing anywhere), then your PHP program isn't sending the file correctly. At a minimum, it must set "Content-type" before it sends the binary .png data.
'Hope that helps...
View report in a new window
Related
Is there a way to have an iFrame with full toolbar except for the download button.
On the web I found this solution
<iframe src="URL#toolbar=0" width="100%" height="100%"></iframe>
But as u know it removes completely the toolbar and I would love to actually keep it.
Basically:
this is how is normally and this is I would love to have it (or something similar).
I already know i cannot prevent ppl to download it in other way, but I'm only interest in this graphic difference
Thanks to anyone who could help me
Also I noticed that mozilla doesnt view iFrame, is there a way to allowed it or something similar?
I need something that ppl can use without changing configuration on their personal mozilla
The look that I'm looking for (asked by my boss) ->
Mozilla browsers have no problem with Iframe, but browsers are configured by users to their security preferences.
<iframe id="page2" height="50%" width="100%"src="http://africau.edu/images/default/sample.pdf#page=2"></iframe>
<iframe id="page1" height="50%" width="100%"src="http://africau.edu/images/default/sample.pdf#page=1"></iframe>
Same as the web page text and images, Audio or Video content, all pdfs are "Download first to view" does not matter if
A=Href
Embed
Iframe
Object (avoid as depreciated)
cUrl (Users direct get)
So why remove the button if its not showing in the frame due to any ad blocker or other user setting such as send downloads into external secured PDF viewer
Mozilla browser with pdf plugin or add-in or PDF extender same as Chrome/Edge
FireFox with a frame blocker active for the same page 3 blocked items.
If you wish to change the Iframe view you need to be the PDF viewer application, but there is no guarantee it is the one the user is viewing within.
Here is a demo of a browser viewer where the download and print buttons are removed. However Browsers need to allow the user to control their own view so I have also opened the download on the right in a companion viewer.
A PDF client cannot view a PDF unless it is Decrypted after a download thus their copy is available for view and edit.
We have a internal website where we have some links to pdf documents hosted on the webserver. If i open Chrome Dev-Tools(F12), and inspect the link and add an embed with the same pdf document, it will rather download the file instead of showing it. I have tried with embed and iframe, but i still get the same problem.
Original code:
<a id="id2239" href="http://example.com:8080/client/attachment/filename.pdf" class="act01">filename.pdf</a>
Screenshot:
Code that we would like to work:
<a id="id2239" href="http://example.com:8080/client/attachment/filename.pdf" class="act01">filename.pdf</a>
<div class="fgh"><embed id="fgh" src="http://example.com:8080/client/attachment/filename.pdf" type="application/pdf" width="400" height="400"></div>
Screenshot:
As you can see, it actually downloads the document instead of showing it in the screenshot above. Just shows a white space.
Code that works with another document:
I just found a pdf document on google, and put it into the tag, and it works. It shows the document in the embed, and doesn't download the document instead.
<a id="id2239" href="http://example.com:8080/client/attachment/filename.pdf" class="act01">filename.pdf</a>
<div class="fgh"><embed id="fgh" src="http://infolab.stanford.edu/pub/papers/google.pdf" type="application/pdf" width="400" height="400"></div>
Screenshot:
Question:
Why is the two examples different? Why does the internal document download, but the external document show embedded in the page?
How do i make it work with the file on our webservers as well?
Edit:
Screenshot of the pdf documents headings.
It depends on the content type in the response header. You may check if your web server sets proper header information, e.g. Content-Type: application/pdf.
"Chrome Dev-Tools(F12)" -> Network Tab, check the response headers.
I was facing the same issue. In my case the Content-Type of my files was "binary/octet-stream". I had to manually change it to "application/pdf" to resolve it
Use the <object> tag to embed PDF files in html:
<object id="fgh" data="http://example.com:8080/client/attachment/filename.pdf" width="400" height="400"></object>
I am using HTML with JSF application in my project and also used ClickJack filter option. First I try iFrame, Object, embed for view pdf portion. I refer path in tomcat folder
<iframe src="/path/file.pdf"/>
at the time browser to show error message is To help protect the security of information you enter into this website,
the publisher of this content does not allow it to be displayed in a frame..
So I need any other way to display pdf or doc file in browser is possible?
Chrome, Edge, and other modern browsers can read PDF files within the browser natively. If you use a link like so:
My PDF
It should open a window like this:
Is it possible to load an image in HTML and load it like an actual image (Like if it was an image/png mimetype etcetera).
Example:
This is me loading an HTML document that contains <img src="RL_Dark.png">:
Loading the image through an HTML document
But here's me loading it directly from the file:
Loading the image through file
Is it even possible to let the browser handle the image loading as I am not planning on doing anything via the HTML document that would be shown to the user (Statistic collection such as Google Analytics and Alexa Analytics), if it is, would anyone be able to show me an example?
Your browser (presumably chrome) when given the direct image url, loads the image in a gallery style view (where it applies centering and shows checkerboarding) whereas when given an HTML page, chrome shows a rendered HTML page. Chrome (and other browsers) often have built in UIs for handling different types of files (another instance would be music files)
I got some encrypted url strings as the src attribute of <img> tags in my html page. For example:
<img src="http://192.168.1.111/business_id/ia8u7Eg8tTVungbUGxVGfh4GYf1tbnh3EyBBmsc1TapqV8/0" />
The link itself can be opened directly by the browser and can be displayed correctly. But this <img> tag in a html page is not displayed correctly with a bad image in the screen. And when I opened this link correctly in the browser, the image will be displayed in the page, apparently this is fetched from the cache.
I have been doing some research, with the developer tools, I track the request of the browser while opening this page. And here is the result:
Just find out may be it is the wrong format that cause this problem. When I opened in the browser, it is parsed correctly to jpeg:
Question is why is this happening? What can I do to fix this? I don't know the format, the server does. Suppose I want to specify the encoding of the src in <img> as jpeg programmatically , is this possible?