PDF Viewer support in mobile browser (iPhone & Android) - android

Does <object> tag widely supported in mobile browser?! I'm trying to embed a PDF file but it seems that it is not supported.
I'm using the following html for viewing PDF
<object data="pdf/sample.pdf#view=Fit" type="application/pdf" width="100%" height="400px">
<p>It appears you don't have Adobe Reader or PDF support in this web browser. <a rel="external" href="pdf/sample.pdf">Click here to download the PDF</a></p>
</object>
and using the PDFObject but both of them are not working in mobile browsers!

No browsers can support native rendering of PDF files without a plugin (except Google Chrome as claimed here).
But you can use Google Docs Viewer to display PDF files inside a webpage like explained here.

If embedding isn't important to you you could just link to the PDF on a seperate page.
Safari (and UIWebViews) supports the rendering of PDFs, im not a 100% sure about Android but I suspect its a similar story.

Load your url inside iframe using google docs
<iframe id="pdfviewer" src="http://docs.google.com/gview?embedded=true&url=YOUR_URL_HERE&embedded=true" frameborder="0" width="100%" height="100%"></iframe>

Related

how to get a pdf document to automatically open when webpage is accessed?

I'm a bit new to this so bear with me. What I am trying to do is to get a pdf document to open automatically as soon as a webpage is launched. This webpage will be hosted locally and the pdf document(S) will be stored locally as well.
Essentially we are using an external platform that allows buttons to link to exterior webpages, but does not allow for opening documents. What we are trying to do is to bypass this limitation by having a webpage that is locally hosted that will automatically open up a pdf file which will be stored on the device.
If the webpage just contained the code <a href"link-to-pdf-doc"></a> will this suffice?
If you are wanting to embed the pdf in the web page rather than download it, a simple way is to use just a plain html object tag:
<object data="link-to-pdf-doc" type="application/pdf" width="100%" height="100%">
I am not sure how much support there is in browsers all across the board, but it will work for the majority of modern browsers.
There are also many libraries available which use browser detection to normalise the code and maybe have wider browser support:
https://github.com/mozilla/pdf.js
http://pdfobject.com

How to display a PDF via Android web browser without downloading the file

I have to display a pdf from URL.
When i directly open the url in a webview then it asks me to download the pdf and then view based on the app that i want to use to view it.
But I do not want to download the pdf, it must be just displayed directly.
Some answers that I went through on SO recommended to make use of docs.google.com
like here: How to display a PDF via Android web browser without "downloading" first
But this doesnt seem to be working anymore.
Use this one:
https://docs.google.com/viewer?url=[url_pdf]
eg. webview.loadUrl("https://docs.google.com/viewer?url=https://www.unipg.it/files/pagine/410/4-PDF-A.pdf");
use this inside your body tags
<iframe src="http://example.com/yourpdf" width="100%" height="100%" style="border: none;">This browser does not support PDFs. Please download the PDF to view it: Download PDF</iframe>

How to support PDF viewing for all mobile browser?

I am using
<object>
to embed a pdf file on my website. e.g.
<object data="abc.pdf" type="application/pdf">
<embed src="abc.pdf" type="application/pdf" />
</object>
It works on all desktop browser, but on my android device, it does not show anything. Besides using the google pdf viewer (since it down-grade dramatically the pdf quality), are there any way to support all ios / android device browser? Or, what is the best way to handle this situation? Since there are lots of browser , How can I redirect them to the browser's pdf plugin download page , or should I just tell them to get one ? (Less user friendly). Thanks
The best way is just too just add a link to the abc.pdf it will open on a new tab.
This would work best for mobile browser rather than embeding or implementing plugins.
ABC PDF file
One cross-platform solution I've found is ViewerJS.
Android-compatible embedding can be accomplished using an iFrame by providing both the URL to the ViewerJS project folder and the URL to the PDF to be embedded (relative to ViewerJS), separated by a hash:
<iframe src='../ViewerJS/#../../pdfs/pdf.pdf'></iframe>
Better to use Google's Gview. I was having the same problem in my project: PDF was opening separately in mobile browsers, whereas it was opening perfectly in web, so I changed it to use Google Doc Gview. Example is given below:
<iframe src="http://docs.google.com/gview?
url=d11xs62myk100c.cloudfront.net/Conference/262/Misc/marcos-ascensin-spanish-national-research-council-csic-spain.ppt&embedded=true'}"
frameborder="0" width="100%" height="1000">
</iframe>
you can check the compability of your mobile then download and save as .dox

HTML embedded with applets or flash in phonegap

I have successfully converted websites using just plain html, css or js into apk files. But html with embedded applets or flash files are not working! I tried with phonegap on android.
It seems applets are not supported by mobile browsers.
For flash, the following link helped:
https://groups.google.com/forum/?fromgroups#!topic/phonegap/s3xZ8qxTL-M

Issue displaying pdf on android using <object> html tag

I am trying to display a PDF to a web page using the html [object] tag. This works fine on all the web browsers on PC's as well as iPhone/iPad. But when I load the same page on an Android it asks me if I want to download the file which is the backup when the PDF isn't displayed. Does anyone know why this wouldn't work or another html control I could use rather than forcefully calling the local PDF program on the phone.
Below is how my html is rendered.
<object data="../myFile.pdf" type="application/pdf" width="100%" height="100%">
<p>Missing PDF plugin for this browser.Click here to download the PDF file.</p>
</object>
I have also seen examples on stackoverflow suggesting the below code but I am unsure of how to leverage it on my site and was hoping there was a possible html fix.
WebView webview = new WebView(this);
setContentView(webview);
webview.getSettings().setJavaScriptEnabled(true);
webview.loadUrl("URL/Demo_PDF.pdf");
The phone I am using is a Thunderbolt. Thanks for the help.
Does anyone know why this wouldn't work
Because that is not supported on Android.
or another html control I could use rather than forcefully calling the local PDF program on the phone.
There may not even be a "local PDF program on the phone". Many phones ship with one, many users install one, but there is no guarantee.
But, beyond that, there is no way to display PDFs natively inline in the stock Android browser. A third party one might support it (e.g., Firefox). Converting the PDF to a Flash animation might work with the stock Android browser, though that will only work on Android 2.2 and higher.
but I am unsure of how to leverage it on my site
You wouldn't. That is Java code, for an Android application.

Categories

Resources