title: Getting an incomplete (chunked) JSON response on Angular proxy
body: <p>While developing an Angular 7 web app, I am using the proxy.conf.json file and --proxy-config option on the ng serve command to proxy my requests from <a href="https://localhost:4200/api" rel="nofollow noreferrer">https://localhost:4200/api</a> to a remote url which hosts the actual REST API.</p>
  
  <p>When doing an HTTP GET request directly to the remote url through my browser (Chrome) or Postman, I always get the full JSON response like I expect it to be.</p>
  
  <p>When requesting this on the angular proxy url, I get only a part of the JSON response (most of the time - not always).</p>
  
  <p>I am aware that the API returns response header Transfer-encoding 'chunked' and from what I understand, this means having to process the response as a stream.</p>
  
  <ol>
  <li>One way to avoid this, is to let the API return a Content-Length header. But I'd rather want to leave the API unchanged.</li>
  <li>I read that when proxying on an nginx server, there is an option 'proxy_buffering' to configure how to handle large HTTP responses. But I'm using the built-in angular proxy (which is a webpack dev server) and I haven't found a way to configure such property.</li>
  </ol>
  
  <p><em>proxy.conf.json</em></p>
  
  <pre><code>...
   "/api/messages": {
      "target": "http://myRemoteHost:myRemotePort/myRemoteContext/v1/",
      "secure": false,
      "changeOrigin": true,
      "logLevel": "debug",
      "pathRewrite": {
        "^/api": ""
      }
    },
  ...
  </code></pre>
  
  <p><em>messages.service.ts</em></p>
  
  <pre><code>return this.http.get&lt;Message[]&gt;(this.endpoint, {params: httpParams});
  </code></pre>
  
  <p><em>Error in console</em></p>
  
  <pre><code>Error Code: 200
  Message: Http failure during parsing for http://...
  
  HttpErrorResponse:
  error: SyntaxError: Unexpected end of JSON input at JSON.parse (&lt;anonymous&gt;) 
  at XMLHttpRequest.onLoad (https://localhost:4200/hal/vendor.js:32570:51) 
  at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (https://localhost:4200/hal/polyfills.js:2768:31) 
  at Object.onInvokeTask (https://localhost:4200/hal/vendor.js:78088:33) at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (https://localhost:4200/hal/polyfills.js:2767:60) 
  at Zone.push../node_modules/zone.js/dist/zone.js.Zone.runTask (https://localhost:4200/hal/polyfills.js:2540:47) 
  at ZoneTask.push../node_modules/zone.js/dist/zone.js.ZoneTask.invokeTask [as invoke] (https://localhost:4200/hal/polyfills.js:2843:34) 
  at invokeTask (https://localhost:4200/hal/polyfills.js:4089:14) 
  at XMLHttpRequest.globalZoneAwareCallback (https://localhost:4200/hal/polyfills.js:4126:21)
  
  message: "Unexpected end of JSON input"
  </code></pre>
  
  <p>I was expecting that when using the standard HttpClient from Angular, I always would get the full response (also for large HTTP responses). This does not seem to be the case. My gut feeling says the proxy is causing this.</p>
  
  <p>So do I need to specifically change my code in order to process chunked http responses? 
  Or is this (hopefully configurable) behaviour from the webpack server?</p>
  
  <p>Does anyone know a possible solution?</p>