当响应类型为arraybuffer时，如何从HTTP get方法中读取Angular JS中的RAW JSON？

Question

我正在尝试阅读ByteArray，使用

将PDF格式的Java显示到Angular JS中

 method : 'GET'
 url        : '',
 cache  : isCache||false,
 responseType: 'arraybuffer'

当一切正常时，这工作正常。

但是当我使用一些正确的JSON抛出异常并将HTTP Status标记为错误请求时，即使将配置更改为 respone.config.responseType ='application / json'

它在response.data上只显示空ArrayBuffer {}。

但重要的是，我可以在Google Chrome开发者工具请求中看到JSON响应。

我用谷歌搜索，搜索堆栈溢出但没有找到太多。

稍后添加的行

我正在从chrome网络连接添加响应对象图片和数据接收图片。

第一张图片：角度JS误差函数的响应对象。

第二张图片 - 服务器返回正确的JSON消息

第三张图片 - 请求和响应标题图片

我遇到的问题是无法读取响应数据，因为我将响应类型设置为 arraybuffer

Answer 1

而不是期望arraybuffer为什么不一直期望application/json，那么当您返回应该创建pdf的数据时，请执行base64数据，将其放入一个json对象并将其返回给客户端

即使你抛出异常，你仍然期望JSON。您在服务器端的响应可能类似于：

{
    responseCode: // your response code according to whether the request is success or not,
    responseMessage: // success or fail
    data: // your base64 encoded pdf data(the data that if the request is successful will be returned), note it will be returned as a normal string
} // I'm hoping you know how to base64 encode data

然后在您的客户端（Javascript），执行if

if(data.responseCode == //errorCode) {
    alert(data.responseMessage);
} else {
    // Unpack data
    var myPdfData = // base64 decode(data.data)
    // Do logic to create and open/download file
}

您甚至不需要对数据进行解码，只需create a blob object，然后从blob中trigger a download

Answer 2

如果响应类型为arraybuffer，要查看它，您应该将其转换为blob并从该blob创建一个objectUrl，并将其下载或在新的选项卡/浏览器窗口中打开以查看它。 / p>

JS：

$http.get('your/api/url').then(function(response) {
var blob = new Blob([response.data], { type: 'application/pdf' });
    var downloadUrl = URL.createObjectURL(blob);

    $timeout(function () {
        var link = document.createElement('a');
        link.download = 'SOME_FILE_NAME'+ '.pdf';
        link.href = downloadUrl;
        link.click();
    }, 100);
}, function(errorResponse){
    alert(errorResponse.error.message);
});