Force download a pdf link using javascript/ajax/jquery

前端 未结 7 1985
夕颜
夕颜 2020-11-27 04:51

suppose we have a pdf link \"http://manuals.info.apple.com/en/iphone_user_guide.pdf\"(just for example and to let u know that file is not on my server, i only have the link)

相关标签:
7条回答
  • 2020-11-27 05:23

    Use the HTML5 "download" attribute

    <a href="iphone_user_guide.pdf" download="iPhone User's Guide.PDF">click me</a>
    

    Warning: as of this writing, does not work in IE/Safari, see: caniuse.com/#search=download

    Edit: If you're looking for an actual javascript solution please see lajarre's answer

    0 讨论(0)
  • 2020-11-27 05:25

    Using Javascript you can download like this in a simple method

    var oReq = new XMLHttpRequest();
    // The Endpoint of your server 
    var URLToPDF = "https://mozilla.github.io/pdf.js/web/compressed.tracemonkey-pldi-09.pdf";
    // Configure XMLHttpRequest
    oReq.open("GET", URLToPDF, true);
    
    // Important to use the blob response type
    oReq.responseType = "blob";
    
    // When the file request finishes
    // Is up to you, the configuration for error events etc.
    oReq.onload = function() {
    // Once the file is downloaded, open a new window with the PDF
    // Remember to allow the POP-UPS in your browser
    var file = new Blob([oReq.response], { 
        type: 'application/pdf' 
    });
    
    // Generate file download directly in the browser !
    saveAs(file, "mypdffilename.pdf");
    };
    
    oReq.send();
    
    0 讨论(0)
  • 2020-11-27 05:27

    With JavaScript it is very difficult if not impossible(?). I would suggest using some sort of code-behind language such as PHP, C#, or Java. If you were to use PHP, you could, in the page your button posts to, do something like this:

    <?php
    header('Content-type: application/pdf');
    header('Content-disposition: attachment; filename=filename.pdf');
    readfile("http://manuals.info.apple.com/en/iphone_user_guide.pdf");
    ?>
    

    This also seems to work for JS (from http://www.phpbuilder.com/board/showthread.php?t=10149735):

    <body>
    <script>
    function downloadme(x){
    myTempWindow = window.open(x,'','left=10000,screenX=10000');
    myTempWindow.document.execCommand('SaveAs','null','download.pdf');
    myTempWindow.close();
    }
    </script>
    
    <a href=javascript:downloadme('http://manuals.info.apple.com/en/iphone_user_guide.pdf');>Download this pdf</a>
    </body>
    
    0 讨论(0)
  • 2020-11-27 05:30

    If htaccess is an option this will make all PDF links download instead of opening in browser

    <FilesMatch "\.(?i:pdf)$">
      ForceType application/octet-stream
      Header set Content-Disposition attachment
    </FilesMatch>
    
    0 讨论(0)
  • 2020-11-27 05:31

    Here is the perfect example of downloading a file using javaScript.

    Usage: download_file(fileURL, fileName);

    0 讨论(0)
  • 2020-11-27 05:32

    Here is a Javascript solution (for folks like me who were looking for an answer to the title):

    function SaveToDisk(fileURL, fileName) {
        // for non-IE
        if (!window.ActiveXObject) {
            var save = document.createElement('a');
            save.href = fileURL;
            save.target = '_blank';
            save.download = fileName || 'unknown';
    
            var evt = new MouseEvent('click', {
                'view': window,
                'bubbles': true,
                'cancelable': false
            });
            save.dispatchEvent(evt);
    
            (window.URL || window.webkitURL).revokeObjectURL(save.href);
        }
    
        // for IE < 11
        else if ( !! window.ActiveXObject && document.execCommand)     {
            var _window = window.open(fileURL, '_blank');
            _window.document.close();
            _window.document.execCommand('SaveAs', true, fileName || fileURL)
            _window.close();
        }
    }
    

    source: http://muaz-khan.blogspot.fr/2012/10/save-files-on-disk-using-javascript-or.html

    Unfortunately the working for me with IE11, which is not accepting new MouseEvent. I use the following in that case:

    //...
    try {
        var evt = new MouseEvent(...);
    } catch (e) {
        window.open(fileURL, fileName);
    }
    //...
    
    0 讨论(0)
提交回复
热议问题