Display ByteArrayContent in Angular

I am having Web API which is two years old and don't want to make changes as it is working fine in existing Knockout and polymer applications.

I am trying to work with angular and wants to display this image.

Here is my API Code

 public HttpResponseMessage GetResponse()
    {
        HttpResponseMessage response = new HttpResponseMessage(HttpStatusCode.OK);

        response.Content = new ByteArrayContent(this.Data);
        response.Content.Headers.ContentType = "image/jpeg";

        return response;
    }

when I go to http://localhost:6060/designs/42698 in the browser it display image. No issues.

When I am trying to access this in angular using the below code, I am getting error as shown in attached image

this.service
  .getImage(this.id)
  .subscribe(
    (baseImage: any) => {
      if (baseImage !== null) {
      const objectURL = 'data:image/jpeg;base64,' + baseImage.image;
      this.image = this.sanitizer.bypassSecurityTrustUrl(objectURL);
      } else {
        this.image  = '../assets/images/placeholder.png';
      }
    },
    error => {
      this.errorMessage = error.error;
    }
  );

Here is getimage code

 public getImage(id: number) {
const url = `http://localhost:6060/designs/42968`;
return this.http.get<any>(url)
  .pipe(catchError(error => this.errorHandler(error))); }

I can see the image in Network tab in chrome developer tools but still throwing error.

from Display ByteArrayContent in Angular