从API下载AngularJS CSV文件

时间:2013-11-28 07:05:05

标签: angularjs download angular-ui-router angular-resource ngresource

我有一个管理控制面板,管理员用户可以在其中设置几个选项,然后单击按钮来运行报告。该报告应向用户返回CSV文件下载提示。

我正在使用ui-router$resource服务。响应头/ mime类型设置正确,但CSV文件由$resource处理程序以文本形式返回(未启动文件下载)。

我尝试通过$scope形成查询字符串来直接创建下载链接,但遗憾的是我的API身份验证方案使用自定义HTTP标头令牌,并且无法将其发送到API(也是另一个子域名)通过锚标记,例如这个:

<a href="http://example.com/admin/report/csv?usertype=1&days=5">Run</a>

有没有办法使用XHR请求(使用自定义标头)启动文件下载提示?

1 个答案:

答案 0 :(得分:4)

我正在使用自定义标头令牌,因此无法通过简单链接下载报告;请求必须通过XHR进行。我的两部分解决方案:

  1. 直接从API返回CSV数据作为文本,删除文件attachment标头。无论如何,这是正确的解决方案,因为它使REST JSON API不受文件下载的影响,这是一个浏览器概念。

  2. 将API响应数据包含在Blob中,然后使用https://github.com/eligrey/FileSaver.js启动文件下载。

  3. 缺点是这需要IE10 +,但在我的情况下这没关系。