背景

我正在开发一个Web应用程序，其中经过身份验证的用户可以创建事件并发送该事件的邀请。如何使用AngularJS或JavaScript，如何通过ajax下载文件？

其中一个要求是我添加一个按钮，事件管理器可以点击该按钮以允许他/她下载发送的所有邀请的Excel/OOXML报告。

架构

的观点和实际按钮单击事件都生活在它运行在ASP.NET MVC 4并使用大多是普通的HTML和AngularJs作为平台的“网络”项目。

我也有一个BLL，DAL支持的API项目等API是.NET MVC的WebAPI，它是通过这个终端电子表格的提供者：

/// <summary>GET api/ExportInvitations/{id}</summary> 
/// <summary>Gets an OOXML invitation report by event id.</summary> 
public HttpResponseMessage Get(int id) 
{ 
    var wb = Invitation.ConstructInvitationSpreadsheet(id); 

    var result = new HttpResponseMessage(HttpStatusCode.OK); 
    var stream = new MemoryStream(); 
    wb.SaveAs(stream); 
    result.Content = new StreamContent(stream); 
    result.Content.Headers.ContentType = 
     new MediaTypeHeaderValue("application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"); 
    result.Content.Headers.ContentDisposition = new ContentDispositionHeaderValue("attachment") { FileName = "HelloWorld.xlsx" }; 
    return result; 

}

在前端，我用这AngularJS脚本来调用构造并返回电子表格中的API端点（我总结为简便起见，此代码）：

$http.get('/api/ExportInvitations/' + id).success(function(data) { 
        //do stuff 
       });

的问题

一切似乎都很好，直到用户应该看到电子表格作为下载出现在浏览器中。对API的ajax调用没有问题，并且API返回一个电子表格，因为它应该 - 我从来没有看到该文件在浏览器底部显示为下载（我正在使用Chrome）。

任何帮助表示赞赏。

来源

2014-03-07 Matt Cashatt

我发现了另一个SO post答案张贴这之后不久：

无法通过AJAX本身下载，你只需要重置窗口位置。所以，与其这样：

$http.get('/api/ExportInvitations/' + id).success(function(data) { 
        //do stuff 
       });

我只是需要这样的：

window.location = '/api/ExportInvitations/' + id;

而这将触发下载，而不在浏览器中实际更改URL。

来源

2014-03-07 14:01:16

如何使用AngularJS或JavaScript，如何通过ajax下载文件？

背景

架构

的问题

回答

相关问题