javascript - 使用 Angular js 在前端下载文件

标签 javascript angularjs

单击文件名旁边的下载按钮时,我将从后端获取文件内容。该内容以字节为单位。该文件可以是任何类型。如何将从后端接收到的数据转换为文件并在接收响应(文件内容)时自动下载。html 和 Angular js 中的新蜜蜂。需要任何指针或建议:)

最佳答案

您需要让后端告诉前端文件的位置,然后前端可以放置指向该文件的链接。后端可能应该为此文件生成唯一的哈希名称。

只要后端 Web 服务器配置了正确的 MIME 类型,实际文件就可以作为 Rest GET 请求的一部分返回。

因此,在您的 Controller 中,您将调用一个服务来获取文件路径:

SomeController.$inject = ['$http'];
var SomeController = function($http) {

    var self = this;
    $http.get('/download-file-path').then(function(path) {
        self.path = path; 
    }

}

然后在你看来

<div ng-controller='SomeController as vm'>
    <a ng-href="{{vm.path}}">Download</a>
</div>

当 Angular 调用 GET:/download-file-path 时,后端应返回文件的名称和路径,例如 /download/file-7dje79ae.xml >。然后 Angular 将此路径放入 a 链接中。当用户单击下载按钮时,用户浏览器将向 /download/file-7dje79ae.xml 发出请求并下载文件。

关于javascript - 使用 Angular js 在前端下载文件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29413238/

相关文章:

javascript - 如何为我的 vue 应用程序提供独立安装程序?

java - 如何在不使用 JSP 的情况下将 Java 数组分配或初始化为 Javascript 数组?

javascript - if 语句中的函数仅在第一次时未定义,但在休息时间函数调用也未定义

javascript - 如何有条件地在 AngularJS 模板中显示跨度?

javascript - 从 xml 中获取字符串值

javascript - 堆叠 UIkit.modal 内置对话框

javascript - Vuejs : Fullscreen the editor only in quilljs

javascript - AngularJS,选择框,对象数组,需要显示名称但将值发送到 PHP

javascript - 在 AngularJS 中使用 ng-required 和模型值

javascript - AngularJS 选择框中的默认静态 HTML 值