从 API 下载 AngularJS CSV 文件

2024-04-01

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

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

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

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

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


我使用的是自定义标头令牌,因此不可能通过简单的链接下载报告;该请求必须通过XHR。我的解决方案分为两部分:

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

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

缺点是这需要 IE10+,但对我来说没问题。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

从 API 下载 AngularJS CSV 文件 的相关文章

  • 角度模态弹出窗口中的范围问题

    我的页面上有一个模式弹出窗口 模式弹出窗口使用引导角度库 在模式的主体内部 我有一个带有 ng model 属性的文本框 按下 确定 按钮后 我想使用该文本框值
  • 如何在 angularFire 0.5.0 和最新的 ng-grid 之间创建 3 路数据绑定?

    angularFire bind 方法可以在这里找到 http angularfire com flatdoc html http angularfire com flatdoc html最新的 ng grid 可以在这里找到 http a
  • 如何通知 AngularJS 表单已由 jQuery 外部填写?

    我在 AngularJS 中有一个页面 其中有一个包含一些字段的表单 加载该页面后 我想要一个书签 单击该书签可根据配置文件中的数据填充字段 正在使用一个 JS 文件 该文件使用 jquery 来填充表单中的数据 当我做 id val ab
  • 检测“文件下载”弹出窗口何时关闭

    我有一个网页 用 JSF 制作 其中一些链接允许用户获取 PDF 文件 当用户点击这样的链接时 会显示一个等待弹出窗口 它是一个模式面板 因为 PDF 的生成可能很长 并且一旦创建文件 IE 就会显示 文件下载 弹出窗口 建议 打开 保存
  • 从 Angularjs 应用程序中的 iOS Webview 调用 Javascript 函数

    我的问题是 当我尝试从 UIWebView 中调用 AngularJS 应用程序中存在的 javascript 函数时 该函数无法识别 当我在典型的 html 结构中调用该函数时 该函数会按预期被识别 下面提供的示例 目标 C void v
  • 自定义指令模型在 ng-switch 中不起作用

    我试图使用 AngularJS 提供一个可切换的下拉列表 其中选择各种选项将触发不同的列表 ng switch似乎是正确的方法 但我的ng model在内部时不具有约束力ng switch 如果我不使用 绑定工作正常ng switch 但如
  • JavascriptError:javascript 错误:等待结果时文档已卸载

    在使用 Protractor e2e 测试运行测试角度应用程序时 我目前面临一个问题 这是一个间歇性的问题 我收到 JavascriptError javascript错误 等待结果时已卸载文档 以下是日志 Failures 18 51 4
  • 从字符串开头过滤 ng-repeat 元素

    我正在尝试 AngularJS 这是我的第一次尝试 我正在尝试使用 开头为 而不是 包含 之类的内容来过滤对象数组 但我不明白如何做到这一点 假设我有一个elements像这样的数组 amount 50 amount 25 如果我想过滤5两
  • 在 Protractor 测试中同步处理

    我正在尝试在量角器中编写一个我认为相当简单的测试 但似乎当您尝试同步执行任何操作时 量角器就会让您的生活变得困难 通常 处理定位器函数 返回 Promise 不是问题 因为任何 Expect 语句都会在测试断言之前自动解析传递给它的任何 P
  • Angular ui-router:链接不可点击

    我尝试运行 angular ui router 来处理我的视图 但我遇到了问题 以下视图的两个链接不可点击 带有链接标签的角度更改变量 但我无法单击 我有这样的观点 h1 App h1
  • 离子动态列表分隔符

    我已经被这个问题困扰了一段时间 所以我希望你能让我朝正确的方向前进 我的角度工厂返回一个看起来像这样的对象 name Fall year 20xx id some id 这是一个学期列表 每个学期都有一个对象 其中包含名称 年份和学期 ID
  • 对一个指令进行单元测试,该指令的模板都是带有脚本标签的文件

    我很难弄清楚如何在我的 Karma 单元测试中包含我的指令模板 全部位于不同脚本标记的一个文件中 我得到的错误 PhantomJS 1 9 Linux ERROR SyntaxError Parse error at var www htm
  • Angular 2.0 是否有类似于 Angular 1 中的 `$setPristine` 函数?

    提交表格后 pristine输入的状态仍然是 假 我不知道如何重置pristine陈述为真 在 Angular 1 中 我会使用 setPristine功能 我查看了 API 和开发人员指南 没有 API 可以将输入重置为原始状态 Inst
  • 如何在 Angular JS 中显示以字节数组形式接收的图像

    我有一个将返回图像的服务器端应用程序 这些是响应标头 Content Disposition attachment filename 8822a009 944e 43f4 999b d297198d302a 1 0 low res Cont
  • 处理量角器中的未知错误

    我有一个protractor通过配置多个浏览器进行设置multiCapabilities 在 browserstack 上运行测试 我的主要量角器规格 测试之一包含以下内容afterEach block afterEach function
  • AngularJS + Laravel 5 身份验证

    在使用 AngularJS 构建 SPA 时 我想在 AngularJS 网站中实现用户身份验证 但是 我不知道从哪里开始以及最佳实践是什么 基本上我有一个确定可以担任一个或多个角色 我寻找了一些例子 这样我就可以对如何正确处理这个问题有一
  • PHP:如何访问根目录之外的下载文件夹? [复制]

    这个问题在这里已经有答案了 我如何创建一个 PHP 脚本 页面 允许会员 买家下载存储在根目录之外的下载文件夹中的压缩文件 产品 我正在使用 Apache 服务器 请帮忙 谢谢 保罗 G 您可能会在 soac 提供的链接中找到一些更好的信息
  • 单击菜单外部以关闭菜单时,Bootstrap 导航栏“闪烁”

    我遇到了导航栏问题 当您单击菜单外部以关闭菜单时 导航栏会出现 闪烁 如果在单击菜单外时按住鼠标 则闪烁会持续存在 如下所示 我认为这可能与角度有关 而不是与CSS有关 主要是因为其他人未能在小提琴上复制它 上一个问题在这里 https s
  • triggerHandler 导致错误:[$rootScope:inprog] $apply 已进行中错误 - AngularJS

    我试图在按下某个键时触发按钮的单击 我正在使用triggerHandler函数 但这导致了上述错误 我想我一定创建了某种循环引用 循环 但我看不到在哪里 这是我的 HTML
  • 条件顺序仅在 init AngularJS 上执行

    如何在视图初始化时仅运行 orderBy 过滤器一次 我不希望我的列表在运行时被重新排序 li li 使用 orderBy 作为控制器中的过滤器 app controller DemoCtrl scope filter function s

随机推荐