How to read JSON error response from $http if responseType is arraybuffer

Question

I load some binary data using

$http.post(url, data, { responseType: "arraybuffer" }).success(
            function (data) { /*  */ });

In case of an error, the server responds with an error JSON object like

{ "message" : "something went wrong!" }

Is there any way to get the error response in a different type than a success response?

$http.post(url, data, { responseType: "arraybuffer" })
  .success(function (data) { /*  */ })
  .error(function (data) { /* how to access data.message ??? */ })

You can return whatever error code/message you want from the server. "Something went wrong" seems like a `500`. So in the serverside code once you catch the error don't return a `200` with an error message. For server errors it's `5xx` and for client errors it's `4xx` — dcodesmith, May 05 '15 at 12:13
@dcodesmith The status code is !== 200.I want to know what went wrong. Therefore I need to read the error message from the response. — hansmaad, May 05 '15 at 12:15
@dcodesmith Status code doesn't matter for this question. The question is how to read the error response that is also an arraybuffer. — hansmaad, May 05 '15 at 12:17

smkanadl · Accepted Answer · 2016-12-07T09:41:14.803

83

Edit: As @Paul LeBeau points out, my answer assumes that the response is ASCII encoded.

Basically you just need to decode the ArrayBuffer into a string and use JSON.parse().

var decodedString = String.fromCharCode.apply(null, new Uint8Array(data));
var obj = JSON.parse(decodedString);
var message = obj['message'];

I ran tests in IE11 & Chrome and this works just fine.

edited Dec 07 '16 at 09:41

answered May 20 '15 at 13:39

smkanadl

957
9
12

This gives me `Unexpected token N in JSON at position` – Bassie Jun 16 '20 at 20:40
Have you looked at the decoded JSON string? Probably your API does not answer in proper JSON at all? – smkanadl Jun 18 '20 at 06:35
2

Looks like my issue got resolved after casting it as any like this `....apply(null, new Uint8Array(data) as any)` (I'm using TypeScript) – Bassie Jun 18 '20 at 08:31
Confirmed this is working fine. – jet_choong May 22 '22 at 02:25

score 29 · Answer 2 · answered Oct 17 '16 at 02:35

@smkanadl's answer assumes that the response is ASCII. If your response is in another encoding, then that won't work.

Modern browsers (eg. FF and Chrome, but not IE yet) now support the TextDecoder interface that allows you to decode a string from an ArrayBuffer (via a DataView).

if ('TextDecoder' in window) {
  // Decode as UTF-8
  var dataView = new DataView(data);
  var decoder = new TextDecoder('utf8');
  var response = JSON.parse(decoder.decode(dataView));
} else {
  // Fallback decode as ASCII
  var decodedString = String.fromCharCode.apply(null, new Uint8Array(data));
  var response = JSON.parse(decodedString);
}

Definitely right. I tried your solution back then and found out it does not work in IE which was required. — smkanadl, Dec 07 '16 at 09:36

score 1 · Answer 3 · answered Feb 09 '17 at 21:38

Suppose in your service, you have a function you are using like, This is for Angular 2

someFunc (params) {
    let url = 'YOUR API LINK';
    let headers = new Headers();
    headers.append('Content-Type', 'application/json');
    headers.append('Authorization','Bearer ******');
    return this._http
            .post(url, JSON.stringify(body), { headers: headers})
            .map(res => res.json());    
}

Make sure when you return it it is res.json() and not res.json. Hope it helps, to anyone having this issue

How to read JSON error response from $http if responseType is arraybuffer

3 Answers3

Linked