使用 AngularJS 从 Asp.net Web API 2 下载 Excel

Question

我环顾四周，似乎很多人都有同样的问题，正在下载的文件已损坏。我在前端使用 web api 2 和 angular。

服务器端

[Route("api/export/{id}")]
    public async Task<IHttpActionResult> GetFileAsync(Guid id)
    {         
        var originalFile = System.Web.Hosting.HostingEnvironment.MapPath("~/App_Data/template.xls");

        var stream = _exportService.Export(id, originalFile);

        return new FileActionResult(stream);
    }


public class FileActionResult : IHttpActionResult
{
    private Stream Data { get; }

    public FileActionResult(Stream data)
    {
        Data = data;
    }

    public Task<HttpResponseMessage> ExecuteAsync(CancellationToken cancellationToken)
    {
        HttpResponseMessage response = new HttpResponseMessage
        {
            Content = new StreamContent(Data)
        };
        //response.Content.Headers.ContentDisposition = new ContentDispositionHeaderValue("attachment");
        //response.Content.Headers.ContentType = new MediaTypeHeaderValue("application/vnd.ms-excel");
        //response.Content.Headers.ContentDisposition.FileName = "ExportedCOBie.xls";
        response.Content.Headers.ContentLength = Data.Length;

        return Task.FromResult(response);
    }
}

角度客户端

             function(Restangular, FileSaver, Blob) {

            this.exportToCobie = function(projectId) {
                toastr.info('Exporting data', 'Info');
                Restangular.one("export/" + projectId)
                    .get({ responseType: "arraybuffer" })
                    .then(function (data) {                        
                        var file = new Blob([data], { type: 'application/vnd.ms-excel' });
                        FileSaver.saveAs(file, 'export.xls');                
                 })
            }                
        }

任何帮助将不胜感激，谢谢。

---

public MemoryStream Export(Guid projectId, string file)
    {
        try
        {
            var fileStream = new FileStream(file, FileMode.Open);
            _workbook = new HSSFWorkbook(fileStream);
            fileStream.Close();

            var contacts = _uow.ContactRepository.FindAllBy(c => c.ProjectId == projectId);
            //var fileOutputStream = new FileStream(file, FileMode.Create);
            var memoryStream = new MemoryStream();
            _workbook.Write(memoryStream);
            memoryStream.Position = 0;
            return memoryStream;
        }
        catch (Exception exception)
        {
            _logger.Error(exception.Message);
        }
        return null;
    }

Answer 1

如果其他人对 Restangular 做同样的事情，下面的代码就发挥了作用，希望对您有所帮助！

(function () {
    'use strict';
    angular
        .module('app.cobie.export')
        .service('CobieExportDataService', ['Restangular', 'FileSaver', 'Blob',
            function (Restangular, FileSaver, Blob) {

                this.exportToCobie = function (projectId) {
                    toastr.info('Exporting COBie data', 'Info');
                    return Restangular.withConfig(function(RestangularConfigurer) {
                        RestangularConfigurer.setDefaultHttpFields({
                            cache : false ,
                            responseType: "arraybuffer",    
                        });
                    }).one("export/" + projectId).get().then(function (res) {                        
                        var data = new Blob([res], { type: 'application/vnd.ms-excel' });
                        FileSaver.saveAs(data, 'export.xls');
                    })
                }

            }]);
})();

Answer 2

我在尝试下载 pdf 时遇到了同样的问题。我不记得到底是什么问题，但这是我的工作成功回调：

function success(res) {

    var file = new Blob([res.data], { type: 'application/pdf' });
    var fileName = 'somefilename' + moment().format('YYYYMMDDTHHmm') + '.pdf';

    if ($window.navigator && $window.navigator.msSaveOrOpenBlob) {
        $window.navigator.msSaveOrOpenBlob(file, fileName);
    } else {
        var a = document.createElement('a');
        a.href = URL.createObjectURL(file);
        a.target = '_blank';
        a.download = fileName;
        document.body.appendChild(a);
        a.click();
    }
}

希望对你有帮助。