使用 FileContentResult 下载文件并使用 javascript 将其存储在客户端

Posted 2023-02-22

【中文标题】使用 FileContentResult 下载文件并使用 javascript 将其存储在客户端

【英文标题】：Download file with FileContentResult and store it client side using javascript

【发布时间】：2017-04-14 13:48:03

【问题描述】：

我有这样一条 MVC 路由：

public FileContentResult GetMedia(string media_md5)

    // get media from DB here 
    processed_file_doc file_doc = getMediaFromDb(media_md5);

    string filename = file_doc.Filename;
    string filepath = file_doc.File_path;

    byte[] fileBytes = System.IO.File.ReadAllBytes(filepath);
    string fileName = filename;

    FileContentResult file_result = File(fileBytes, System.Net.Mime.MediaTypeNames.Application.Octet, fileName);

    return file_result;

这个方法被javascript调用是这样的：

function DownloadMedia(row_id) 

    filetable = $('#mytable').DataTable();
    var data = filetable.row('#' + row_id).data();
    filename = data['Filename'];

    var handleSuccess = function (file) 
        var a = document.createElement("a"),
            file = new Blob([file],  type: "application/octect-stream" );

            var url = URL.createObjectURL(file);
            a.href = url;
            a.download = filename;
            document.body.appendChild(a); 
            a.click();
            setTimeout(function () 
                document.body.removeChild(a);
                window.URL.revokeObjectURL(url);
            , 0);     
    

    $.post("/MyController/GetMedia",  media_md5: row_id , handleSuccess);

问题是使用此代码我只能正确下载 .txt 文件，例如，如果我尝试下载 .jpg，则无法打开图像。我检查了下载的两个文件，它们确实不同：

file differences

我已验证文件已打开并正确读取，但我不明白为什么一旦从客户端收到它就全乱了。

【参考方案1】：

System.Net.Mime.MediaTypeNames.Application.Octet

为每个文件选择正确的 MimeType

【参考方案2】：

试试看

文件的网址正确，扩展名正确

浏览器控制台中记录的错误。 （F12 打开开发者工具 > 控制台）