获取Angularjs$http post响应作为文件结果

我的web api中有很长的内容请求参数。所以我需要发送一个POST请求。我的api正在创建一个PDF文件作为响应。但是我无法使用angularjs$

http

provider获得结果

var req = {
  method: 'POST',
  url: 'http://myapi.com/api/renderfile',
  data: { 
       p1: 'very long text....' ,
       p2: 'another very long text....',
       p3: 'another very long text....' 
  }
}

$scope.isLoading = true;

$http(req).then(function(response){

       // response is file result how can I save it ???

       $scope.isLoading = false;
   }, function(){
       $scope.isLoading = false;
   });

我无法在客户端上保存文件响应

答案是这样的：

当我使用FileReader时

 new FileReader().readAsDataURL(new Blob([response.data], {type:'application/pdf'}));

弹出窗口显示在浏览器上：

---

但文件为空。

如果您的响应中包含文件内容，则可以强制浏览器下载此文件

var reader = new FileReader();

$http(req).then(function(response){
   reader.readAsDataURL(new Blob([response.data], {type:'application/pdf'}));
});

reader.onload = function(e) { 
    window.open(decodeURIComponent(reader.result), '_self', '', false); 
}

但首选的解决方案是在您的响应中包含

位置

标题和文件链接。所以，您可以通过导航到此链接强制浏览器下载

建议的解决方案仅适用于HTML5浏览器。

使用AngularJS下载二进制文件 下载二进制文件时，设置XHR的

responseType

属性非常重要

var config = { responseType: 'blob' }

var httpPromise = $http.get(url, config);

httpPromise.then(function (response) {
    $scope.data = response.data;
});

有关详细信息，请参阅

---

创建下载按钮 这是一个下载按钮的示例，该按钮在从服务器加载数据后变为活动状态：

<a download="data_{{files[0].name}}" xd-href="data">
  <button ng-disabled="!data">Download</button>
</a>

---

什么是响应内容类型？您真的需要使用AJAX吗？我认为一种常见的方法是返回一个指向远程回购的链接，用户可以在远程回购中下载文件，并让浏览器处理下载。你说的“无法获得结果”是什么意思？响应对象中有什么？您收到了什么错误消息？酷！从来没有这样想过。。我曾经在需要下载文件时创建表单：P@atulquest93有趣。如何下载表格？我的意思是，当您对文件内容有AJAX响应时？你能指出一些资源或源代码吗？@bookmarker，使用

FileReader

时，只需参考

response.data

。我已更新代码。我已更新，但错误是：未能在“FileReader”上执行“readAsDataURL”：参数1不是“Blob”类型。您的数据的类型似乎不正确。需要转换为

Blob

=>

新Blob（[response.data]，{type:'application/pdf}）

。我已经更新了示例

app.module("myApp").directive("xdHref", function() {
  return function linkFn (scope, elem, attrs) {
     scope.$watch(attrs.xdHref, function(newVal) {
       if (newVal) {
         elem.attr("href", newVal);
       }
     });
  };
});