如何在 API 调用中为 Angular 8 中的一个对象设置响应类型

Question

I have an API written in C# which sends an object data as json in which one of the data is in the form of byte[].
Model:

public class A {
int id;
string name;
byte[] data;
}

API:

[HttpGet]
[Route("~/api/getdata")]
public IActionResult GetData()
{
  A a = new A
    { id= 1,
      name = "JOHN",
      data = { 0, 0, 0, 25 } 
     };
  return Ok(a);
}

When I call the same API in my angular application as:

getData(): Observable<A> {
    return this.http.get<A>(`${API_URL}/api/getdata`).pipe(
      map(data => data)
    );
  }

I have defined the same model A in my Client Side as well:
A:

 export interface A { id: number; name: string; data: ArrayBuffer; }

But when I am calling the API the data is getting converted to base64 encoded string. Is there a way so that I get Array Buffer only and I need not to write any extra method for conversion from base 64 string to Array Buffer.

I tried using :

 getData(): Observable<A> { const httpOptions = { 'responseType': 'arraybuffer' as 'json' }; return this.http.get<A>(`${API_URL}/api/getdata`, httpOptions).pipe( map(data => data) ); }

but it's converting complete response to array buffer, where as I want arraybuffer just for data which is ArrayBuffer type.

Answer 1

In respect of you comment

@MoxxiManagarm The problem is I have 200MB of data in array buffer, so at front end side, converting the base 64 string to array buffer is crashing my browser.

This is a serious architecture issue then. No one should transfer 200MB of data in a json. Please think about providing the id of the data only and concat another requests with a respective response type (arraybuffer or blob) to retrieve the data.

See also: https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest/Sending_and_Receiving_Binary_Data