Detect native or third-party PDF plugin in browser - javascript

We're writing a small tool to view generated PDFs from our site and have the browser open them. The twist in our case is that we want the PDF to show in the browser 100% of the time. We do not want the browser to save the PDF to its downloads folder automatically (for HIPAA reasons). (If the users download it themselves, that is fine. The save being initiated by them is a very important distinction.)
I would like to find a solution that compromises between browser and the need for this extra. My plan of attack is:
Detect native browser plugin, e.g. Google Chrome and Firefox.
If no native browser plugin is available, check for third-party plugins, e.g. for Adobe, or FoxIt.
If no third-party plugin is available, render with PDF.js or some other Javascript solution.
I am unsure how to go about step 1. I've found a few hits for step 2, but I want to get step 1 working as that is the primary use case. Any help would be appreciated.
Thanks in advance.

If you want render the pdf file from the server programmatically you need to add mime type to header:
PhP example:
<?php
$file = 'path/to/PDF/file.pdf';
$filename = 'filename.pdf';
header('Content-type: application/pdf');
header('Content-Disposition: inline; filename="' . $filename . '"');
header('Content-Transfer-Encoding: binary');
header('Accept-Ranges: bytes');
#readfile($file);
?>
C# example:
Response.AppendHeader("Content-Disposition", "inline; filename=something.pdf")
Return File(output, "application/pdf", "something.pdf")
Or if you want to detect the pdf viewer using JavaScript this can be help you: Javascript Detect if Adobe Reader is installed

Related

How do i rename a file on download using HTML5?

i have been working on a website which will allow users to upload and download files. The file is renamed on upload and stored on my server. But when it is downloaded, it has to be renamed i.e to its original name. Presently i am using the following to do so :
Download
But the "download" attribute does not work with firefox. Any alternative using javascript or jquery ? I am using php for server side.
Edit:
Thanks for the solution using php. But that is not what i am looking for. I am using a custom file viewer using javascript. On clicking the thumbnail of the file, the viewer is displayed. An AJAX request is sent to get the link to the file. The response (the link) is used to display the file, also is added to the tag for download. A php solution would mean a page reload on every request, which i want to avoid. So any javascript or jquery solutions ?
On the server use header("Content-Disposition: attachment; filename='Original name'")
Try Below Code
header('Content-Disposition: attachment; filename='.basename('newfilename.txt'));
header('Content-Transfer-Encoding: binary');
header('Content-Length: ' . filesize('filename.txt'));
ob_clean();
flush();
readfile('filename.txt');

Download image direct from url

Let's say that I have some URL to an image on the web. Let's say the URL is http://www.gearheadwalls.com/wp-content/uploads/2013/07/Mercedes-Benz-S-Class-4.jpg
Now, when a user press the download button, the image should be downloaded.
I've tried this:
window.location.href = Link;
But sometimes it just opens the image on the browser and sometimes it is downloaded as I wanted.
How can I achieve this?
You can use the HTML5 download attribute on anchors :
<a href="http://www.gearheadwalls.com/wp-content/uploads/2013/07/Mercedes-Benz-S-Class-4.jpg" download="http://www.gearheadwalls.com/wp-content/uploads/2013/07/Mercedes-Benz-S-Class-4.jpg">
<img src="http://www.gearheadwalls.com/wp-content/uploads/2013/07/Mercedes-Benz-S-Class-4.jpg">
</a>
You need to pass appropriate headers in order to allow user to download the file. If you just provide the file link in the url the browsers interpret it differently. They may first try to open the file in the browser, if it fails the file will be prompt as force-download.
If you are using PHP, the headers in download script is something like:
header('Content-Type: ' . $mime_type);
header('Content-Disposition: attachment; file="'.$name.'"');
header("Content-Transfer-Encoding: binary");
header('Accept-Ranges: bytes');
header("Cache-control: private");
header('Pragma: private');
The full tutorial can be found here: www.phptutorialforbeginners.com/2013/04/file-download-script-in-php-php.html
You will have to set Content-Disposition header field, as suggested by http://www.w3.org/Protocols/rfc2616/rfc2616-sec19.html, if you want the image should not be handled natively by browser. If you use PHP, may be this link would help, http://w3schools.invisionzone.com/index.php?showtopic=39943
Only issue with this, you can't directly make apache serve you this file, as a normal static resource, or I don't know the way to do this Apache :)

How to make an mp3 file from another site downloadable

I almost feel ashamed to ask such a basic question, what with how i like to term my self a website genius when with friends this seems quite basic.
I'm trying to get visitors to my site to download an mp3 link=> "http://www.podbean.com/podcast-directory-download-public/4995714/10_Commandments_Of_A_Successful_Home_Pst_Abiodun_Koloewo.mp3". But the problem i'm facing is that it won't download unless one right clicks and selects "save link as" and i can't do anything about it since the file's not on my server. any help here?
You have two methods, one of which only works in Chrome.
Use the download attribute:
Though this is used in Firefox, it states:In Firefox 20 this attribute is only honored for links to resources with the same-origin. so it doesn't work.
Example:
<a href="http://www.podbean.com/podcast-directory-download-public/4995714/10_Commandments_Of_A_Successful_Home_Pst_Abiodun_Koloewo.mp3" download>Download Song</a>
Use your server as a proxy:
Example:
header('Content-Type: application/octet-stream');
header("Content-Transfer-Encoding: Binary");
header("Content-disposition: attachment;filename=\"10_Commandments_Of_A_Successful_Home_Pst_Abiodun_Koloewo.mp3\"");
readfile("http://www.podbean.com/podcast-directory-download-public/4995714/10_Commandments_Of_A_Successful_Home_Pst_Abiodun_Koloewo.mp3");
For this example to work, please enable allow_url_fopen.
In addition to this, I would recommend saving the song file on your server, so that new requests for this song can just be downloaded from your server again.

window.open does not open in IE

I am trying to open a word document using window.open as below
window.open("myworddoc.doc");
It works fine in FF, but IE tries to open a tab, but closes it immediately and jumps back to the current screen (no dialog is displayed to save or open a file).
What could be the issue?
This is surely a security mesure. Opening Word documents using JavaScript could have nasty effects. Imagine if you are browsing the internet, and someone makes an infected Word document open when your page loads.
Personally, I'd create a PHP file, let's say "servedoc.php", and open that file like so:
window.open("servedoc.php");
servedoc.php could contain something like this:
<?php
$file = "myworddoc.doc";
header("Cache-Control: public");
header("Content-Description: File Transfer");
header("Content-Disposition: attachment; filename=$file");
header("Content-Type: application/msword");
header("Content-Transfer-Encoding: binary");
readfile($file);
IE will open the PHP file, as it's a perfectly valid web file. And the PHP script would serve the file to the browser, asking the user to download the file.
Or if you are using .net (vb):
Response.ContentType = "image/jpeg" 'mime type of the file to serve.
Response.AddHeader("content-Disposition", "attachment;filename=YOURFILENAME")
Response.TransmitFile(YourFILEPath)
Like this you can let them download the .doc or the .zip file if you prefer.

save as PDF: recommend a server solution to receive raw data from client and send back PDF to client?

My project requires me to add a "SaveAs PDF" feature. I was looking for a pure JavaScript solution which does this just in client end, however, was told that it's not implementable, at least for now.
jsPDF currently is still a limited version, not support graph and others. So now I am looking for a stable open-srouce free solution to set up a server web service, that receive data from client-end and send back the produced PDF file or a link for user to save to their disk.
The data from client is determined by client user, which means, not the whole page. User can choose to save a map, a table, or all of them into PDF file.
Any recommendations?
PS: in Windows environment
You might check out the ReportLab Toolkit - it includes an Open Source Python library for creating PDFs. (You didn't specify what server-side language you wanted, but Python is pretty widely supported.)
If you need something that can be coded in Javascript, one option might be PhantomJS. This tool allows you to run a headless Webkit browser from the command line, and among other things it can render and save webpages as PDFs. Slippy uses this approach, so you might be able to get example code from that project. Scripting the PDF creation would probably be much faster in PhantomJS than in Python, but it's likely to be much slower (it has to fire up a Webkit instance) and server installation might be complicated.
I've create this function in javascript which send on iframe to the server:
function download(url, datas){
if(url && datas){
var inputs = '', value,
iframe = '<iframe name="iframeDownload" id="iframeDownload" width=0 height=0></iframe>';
$(iframe).appendTo('body');
datas.forEach(function(data){
name = encodeURI(data.get('name'));
value = encodeURI(data.get('value'));
inputs+='<input name="'+name+'" value="'+value+'"/>';
});
$('<form action="'+url+'" method="post" target="iframeDownload">'+inputs+'</form>').appendTo('body').submit().remove(); // .appendTo and remove() are needed for firefox
$(iframe).remove();
};
};
I'm encoding the input name and value to be able to send data.
On my server, I'm using php, so to decode this, you need: rawurldecode. If you define the name of the inputs as "fileName" and "file" you can write this:
$fileName = rawurldecode($_POST['fileName']);
$file = rawurldecode($_POST['file']);
After than, to force the download, you need to send the corrects header. I'm using this function:
function download($filename, $file) {
header('Content-disposition: attachment; filename="'.$filename.'"');
header('Content-Type: application/force-download');
header('Content-Length: '. filesize($file));
readfile($file);
}
If you don't need to send the file from javascript because it's created on the server side, just add the path of your file to the download function.
If you're using PHP, You can use fpdf to generate the pdf.

Categories

Resources