AngularJS可以在收到响应后设置responseType吗?

时间:2016-12-01 20:14:10

标签: angularjs

我有一个Angular 1.x应用程序,期望使用$http.post()调用接收二进制文件下载(pdf)。问题是,我希望另外得到一个作为json发送的处理错误消息。我可以使用config

执行此操作
headers: {
  'Accept': 'application/pdf, application/json'
}

问题是我必须设置responseType: 'arraybuffer',否则pdf二进制文件将被转义(或更改为无法加载)。但是,这会阻止正确读取或解释json。

我怎么能同时拥有两者?

编辑:我打算澄清一下;也许我的理解是错误的。

$http({
    method: 'POST',
    url: "/myresource",
    headers: {
        'Accept': 'application/pdf, application/json'
    },
    responseType: 'arraybuffer'
})
.then(
    function(response) {
        // handle pdf download via `new Blob([data])`
    }, function(response) {
        // pop up a message based on response.data
    }
)

在我返回pdf数据块且http状态为200的情况下,第一个函数处理响应并提示用户保存文件。但是,如果状态是错误(422),则response.data未定义。我认为这是因为responseType阻止了json的正确处理。

如果我删除responseType行,则会正确读取错误数据,但是当保存pdf时,某些文件字节不正确并且它们已被有效损坏。我认为这是因为文件正在编码,因为javascript期待一个字符串。

1 个答案:

答案 0 :(得分:9)

加载响应后,无法更改XHR responseType属性。但arraybuffer可以根据Content-Type解码和解析:

 var config = {
    responseType: "arraybuffer",
    transformResponse: jsonBufferToObject,
  };

  function jsonBufferToObject (data, headersGetter, status) {
      var type = headersGetter("Content-Type");
      if (!type.startsWith("application/json")) {
        return data;
      };
      var decoder = new TextDecoder("utf-8");
      var domString = decoder.decode(data);
      var json = JSON.parse(domString);
      return json;
  };

  $http.get(url, config);

以上示例将XHR设置为返回arraybuffer并使用transformResponse函数检测Content-Type: application/json并在必要时进行转换。

DEMO on PLNKR