Skip to content
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
26 changes: 26 additions & 0 deletions adev/src/content/guide/ssr.md
Original file line number Diff line number Diff line change
Expand Up @@ -427,6 +427,32 @@ To configure this, update your `angular.json` file as follows:

`HttpClient` caches outgoing network requests when running on the server. This information is serialized and transferred to the browser as part of the initial HTML sent from the server. In the browser, `HttpClient` checks whether it has data in the cache and if so, reuses it instead of making a new HTTP request during initial application rendering. `HttpClient` stops using the cache once an application becomes [stable](api/core/ApplicationRef#isStable) while running in a browser.

### Configuring the response body size limit

When `HttpClient` uses the default fetch backend during server-side rendering, Angular limits each response body to 1 MB. This limit prevents the server from buffering unexpectedly large responses during rendering. If a response exceeds the configured limit, the request fails with the [NG02825](errors/NG02825) error.

If your application needs to fetch larger responses during server rendering, set `maxResponseBodySize` in the `provideServerRendering` options:

```ts
import {provideServerRendering, withRoutes} from '@angular/ssr';
import {serverRoutes} from './app.routes.server';

const serverConfig: ApplicationConfig = {
providers: [
provideServerRendering(
{
maxResponseBodySize: 5 * 1024 * 1024, // 5MB
},
withRoutes(serverRoutes),
),
],
};
```

`maxResponseBodySize` is configured in bytes and applies globally to server-side `HttpClient` requests that use the fetch backend.

IMPORTANT: Keep this limit as small as your application allows. Increasing it lets server-side requests buffer larger response bodies, which can increase memory use and denial-of-service risk. Prefer moving large downloads outside server rendering.

### Configuring the caching options

You can customize how Angular caches HTTP responses during server‑side rendering (SSR) and reuses them during hydration by configuring `HttpTransferCacheOptions`.
Expand Down
37 changes: 37 additions & 0 deletions adev/src/content/reference/errors/NG02825.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,37 @@
# Fetch response body exceeds the configured limit

Angular produces this error when `HttpClient` uses the fetch backend during server-side rendering and the bytes buffered for a response body exceed the configured `maxResponseBodySize` limit. By default, Angular limits each buffered response body to 1 MB to prevent the server from buffering unexpectedly large responses during rendering.

## Fixing the error

Set `maxResponseBodySize` in the `provideServerRendering` options to increase the limit:

```ts
import {provideServerRendering, withRoutes} from '@angular/ssr';
import {serverRoutes} from './app.routes.server';

const serverConfig: ApplicationConfig = {
providers: [
provideServerRendering(
{
maxResponseBodySize: 5 * 1024 * 1024, // 5MB
},
withRoutes(serverRoutes),
),
],
};
```

`maxResponseBodySize` configures the maximum number of response body bytes Angular buffers for each server-side `HttpClient` request that uses the fetch backend. The value is configured in bytes and applies globally.

IMPORTANT: Keep this limit as small as your application allows. Increasing it lets server-side requests buffer larger response bodies, which can increase memory use and denial-of-service risk. Prefer moving large downloads outside server rendering.

## Debugging the error

The error message includes the configured `maxResponseBodySize` limit in bytes. To identify which HTTP request is returning a large response, check your network logs or the SSR server console for the failing request URL.

If the large response is only needed on the client and not required for server-side rendering, you can disable the transfer cache for that specific request:

```ts
httpClient.get('/api/large-data', {transferCache: false});
```
1 change: 1 addition & 0 deletions adev/src/content/reference/errors/overview.md
Original file line number Diff line number Diff line change
Expand Up @@ -43,6 +43,7 @@
| `NG02200` | [Missing Iterable Differ](errors/NG02200) |
| `NG02800` | [JSONP support in HttpClient configuration](errors/NG02800) |
| `NG02802` | [Headers not transferred by HttpTransferCache](errors/NG02802) |
| `NG02825` | [Fetch response body exceeds the configured limit](errors/NG02825) |
| `NG05000` | [Hydration with unsupported Zone.js instance.](errors/NG05000) |
| `NG05104` | [Root element was not found.](errors/NG05104) |

Expand Down
2 changes: 1 addition & 1 deletion goldens/public-api/common/http/errors.api.md
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,7 @@ export const enum RuntimeErrorCode {
// (undocumented)
CREDENTIALS_NOT_SUPPORTED_WITH_XHR = 2818,
// (undocumented)
FETCH_RESPONSE_BODY_TOO_LARGE = 2825,
FETCH_RESPONSE_BODY_TOO_LARGE = -2825,
// (undocumented)
FETCH_UPLOAD_PROGRESS_NOT_SUPPORTED = 2824,
// (undocumented)
Expand Down
2 changes: 1 addition & 1 deletion packages/common/http/src/errors.ts
Original file line number Diff line number Diff line change
Expand Up @@ -37,6 +37,6 @@ export const enum RuntimeErrorCode {
REFERRER_POLICY_NOT_SUPPORTED_WITH_XHR = 2823,

FETCH_UPLOAD_PROGRESS_NOT_SUPPORTED = 2824,
FETCH_RESPONSE_BODY_TOO_LARGE = 2825,
FETCH_RESPONSE_BODY_TOO_LARGE = -2825,
JSONP_UNSAFE_URL = 2826,
}
Loading