通过ajax打开FileStreamResult(作为下载文件) [英] Open FileStreamResult by ajax (as downloaded file)

问题描述

是否可以使用ajax调用将FileStreamResult作为下载的文件打开?

控制器方法

public FileStreamResult DownloadPDF()
{
        var stream = myHandler.getFileStream("myfile.pdf");
        return File(stream, "application/pdf", "myfile.pdf"));
}

HTML代码

<a href="#" class="mydownload">Click Me</a>
<script type="text/javascript>
    $("a.mydownload").click(function () {
        $.ajax({
            method: 'GET',
            url: 'http://myserver/file/DownloadPDF',
            success: function (data, status, jqXHR) {
                var blob = new Blob([data], { type: "application/pdf" })
                var url = window.URL.createObjectURL(blob);
                var a = document.createElement("a");
                document.body.appendChild(a);
                a.href = url;
                a.click();

            }
        });
    });
</script>

在IE上运行时，访问被拒绝，但在Chrome上运行正常.但是，我确实得到了空白"/无效的pdf.

解决方案

在responseType设置为"blob"的情况下使用XMLHttpRequest()，将download属性添加到<a>元素

$("a.mydownload").click(function () {
    var request = new XMLHttpRequest();
        request.responseType = "blob";
        request.open("GET", "http://myserver/file/DownloadPDF");
        request.onload = function() {
            var url = window.URL.createObjectURL(this.response);
            var a = document.createElement("a");
            document.body.appendChild(a);
            a.href = url;
            a.download = this.response.name || "download-" + $.now()
            a.click();
        }
        request.send();
});

或者，您可以使用 jquery-ajax-blob-arraybuffer.js .另请参见添加对HTML5 XHR v2的支持，并且在$ .ajax上将responseType设置为"arraybuffer"

Is it possible to use an ajax call to open FileStreamResult as a downloaded file?

Controller method

public FileStreamResult DownloadPDF()
{
        var stream = myHandler.getFileStream("myfile.pdf");
        return File(stream, "application/pdf", "myfile.pdf"));
}

Html code

<a href="#" class="mydownload">Click Me</a>
<script type="text/javascript>
    $("a.mydownload").click(function () {
        $.ajax({
            method: 'GET',
            url: 'http://myserver/file/DownloadPDF',
            success: function (data, status, jqXHR) {
                var blob = new Blob([data], { type: "application/pdf" })
                var url = window.URL.createObjectURL(blob);
                var a = document.createElement("a");
                document.body.appendChild(a);
                a.href = url;
                a.click();

            }
        });
    });
</script>

Running on IE I get access denied, but on Chrome it runs fine. I do however get a "blank"/invalid pdf.

解决方案

Use XMLHttpRequest() with responseType set to "blob", add download attribute to <a> element

$("a.mydownload").click(function () {
    var request = new XMLHttpRequest();
        request.responseType = "blob";
        request.open("GET", "http://myserver/file/DownloadPDF");
        request.onload = function() {
            var url = window.URL.createObjectURL(this.response);
            var a = document.createElement("a");
            document.body.appendChild(a);
            a.href = url;
            a.download = this.response.name || "download-" + $.now()
            a.click();
        }
        request.send();
});

alternatively, you can use jquery-ajax-blob-arraybuffer.js. See also Add support for HTML5 XHR v2 with responseType set to 'arraybuffer' on $.ajax

这篇关于通过ajax打开FileStreamResult(作为下载文件)的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！