如何从ASP.NET Core正确将文件下载到Angular? [英] How to correctly download files to Angular from ASP.NET Core?

查看:170
本文介绍了如何从ASP.NET Core正确将文件下载到Angular?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我在服务器上有一个文件要发送给客户端:

I have a file on the server that I want to send to the client:

[HttpPost]
public IActionResult Test()
{
    byte[] bytes = System.IO.File.ReadAllBytes(Path.Combine(FilesFolder, "test.docx"));
    return File(bytes, _contentTypeWord);
}

我也尝试过

return PhysicalFile(pathUploadFile, "application/vnd.openxmlformats-officedocument.wordprocessingml.document");

在客户端,我接受使用:

At the client I accept using:

private _downloadFile(data: ArrayBuffer, fileName: string, contentType: string) {
    var blob = new Blob([data], { type: contentType });
    var url = window.URL.createObjectURL(blob);

    var link = document.createElement("a");
    link.setAttribute("href", url);
    link.setAttribute("download", fileName);
    link.style.display = "none";
    document.body.appendChild(link);
    link.click();
    document.body.removeChild(link);
}

public test() {
    this.http.post("Diplom/Test", { }, {
        headers: this.headers(),
    }).subscribe(
        result => {
            this._downloadFile(result.arrayBuffer(), "test.docx", "application/vnd.openxmlformats-officedocument.wordprocessingml.document")
        },
        error => {
            alert("Не удалось отредактировать файл");
            console.error(JSON.stringify(error));
        })
}

客户端收到的文件已损坏,无法打开.服务器上的文件很好,可以完美打开.生成的文件仍然无法打开,甚至重2倍(在服务器上为487 KB,而客户端为925 KB).

The file that the client receives is corrupt and does not open. The file that is on the server is fine and opens perfectly. The resulting file still does not open, and even weighs 2 times more (on the server 487 KB, and the client has 925 KB).

推荐答案

我不知道为什么问题中指定的选项不起作用.但是我找到了一个解决方案,可以说是在另一个森林里".我不是很精通,所以我只描述解决问题的过程.首先,我会立即说问题出在客户方面.服务器上的方法从一开始就可以正常工作. 我决定使用另一种方法来下载文件提取".并在论坛中看到了下一篇文章.从那里我得到了以下答案

I do not know why the option specified in the question does not work. But I found a solution, so to say "in another forest". I'm not very versed, so I'll just describe the process of solving the problem. For the beginning I will immediately say that the problem was on the client's side. The method on the server worked correctly from the start. I decided to use another method to download the files "fetch". And came across the next post in the forum. From there I took the following answer

this.httpClient
    .fetch(url, {method, body, headers})
    .then(response => response.blob())
    .then(blob => URL.createObjectURL(blob))
    .then(url => {
        window.open(url, '_blank');
        URL.revokeObjectURL(url);
    });

他也没有为我工作.我改变了

He did not work for me either. I changed it so

    fetch(url, {
            method: 'POST',
            headers: this.headers()
        })
        .then(response => response.blob())
        .then(blob => URL.createObjectURL(blob))
        .then(url => {
            window.open(url, '_blank');
        });

因为这一行什么也没发生

Because of this line nothing happened

URL.revokeObjectURL(url);

该选项有效,但带有螺钉.他用一个奇怪的名字保存了文件,没有扩展名.然后我将其更改为这样.

This option worked, but with screwed. He saved the file with a strange name and no extension. Then I changed it so.

    fetch(url, {
            method: 'POST',
            headers: this.headers()
        })
            .then(response => response.blob())
            .then(blob => URL.createObjectURL(blob))
            .then(url => {
                var link = document.createElement("a");
                link.setAttribute("href", url);
                link.setAttribute("download", "test.docx");
                link.style.display = "none";
                document.body.appendChild(link);
                link.click();
                document.body.removeChild(link);
            });

它有效! 我为英语表示歉意.我正在使用Google翻译器

And it works! I apologize for the English. I'm using Google translator

这篇关于如何从ASP.NET Core正确将文件下载到Angular?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆