angular/angular · warning
JSONP support is deprecated as it can cause XSS vulnerabilit
Error message
JSONP support is deprecated as it can cause XSS vulnerabilities, and will be removed in a future version of Angular. Please use standard HTTP requests instead.
What it means
Constructing `JsonpClientBackend` — i.e., activating JSONP support in HttpClient via `provideHttpClient(withJsonpSupport())` or importing `HttpClientJsonpModule` — logs a dev-mode deprecation warning: JSONP will be removed because it works by injecting executable <script> tags, creating XSS exposure when the endpoint is untrusted. Angular recommends standard HTTP requests, which rely on CORS instead of script injection.
Source
Thrown at packages/common/http/src/jsonp.ts:110
* @see {@link HttpXhrBackend}
*
* @publicApi
* @deprecated 22.1 JSONP is deprecated as it can cause XSS vulnerabilities. Use standard HTTP requests instead. Intent to remove in future versions of Angular.
*/
@Injectable()
export class JsonpClientBackend implements HttpBackend {
/**
* A resolved promise that can be used to schedule microtasks in the event handlers.
*/
private readonly resolvedPromise = Promise.resolve();
private readonly nonce = inject(CSP_NONCE, {optional: true});
constructor(
private callbackMap: JsonpCallbackContext,
@Inject(DOCUMENT) private document: any,
) {
if (typeof ngDevMode === 'undefined' || ngDevMode) {
console.warn(
'JSONP support is deprecated as it can cause XSS vulnerabilities, and will be removed ' +
'in a future version of Angular. Please use standard HTTP requests instead.',
);
}
}
/**
* Get the name of the next callback method, by incrementing the global `nextRequestId`.
*/
private nextCallback(): string {
return `ng_jsonp_callback_${nextRequestId++}`;
}
/**
* Processes a JSONP request and returns an event stream of the results.
* @param req The request object.
* @returns An observable of the response events.
*View on GitHub (pinned to 51cb07e980)
Solutions
- Replace `http.jsonp()` calls with `http.get()` once the endpoint sends proper CORS headers (Access-Control-Allow-Origin)
- If the third-party endpoint cannot change, proxy it through your own server/BFF that adds CORS headers, then use `http.get()`
- Remove `provideHttpClient(withJsonpSupport())` / `HttpClientJsonpModule` once no `jsonp()` calls remain
Example fix
// before
provideHttpClient(withJsonpSupport());
this.http.jsonp('https://legacy.example.com/data', 'callback');
// after
provideHttpClient(withFetch());
this.http.get<ApiResponse>('https://api.example.com/data'); // server sends CORS headers Defensive patterns
Strategy: fallback
Prevention
- Never use JSONP for new integrations; require CORS on APIs you consume
- Proxy unchangeable legacy endpoints through your own backend instead
- Grep for withJsonpSupport / HttpClientJsonpModule / http.jsonp during upgrades and remove them before the API is deleted
When it happens
Trigger: Providing `withJsonpSupport()` (or `HttpClientJsonpModule`) in the app config; the warning fires in the `JsonpClientBackend` constructor in dev mode, as soon as the JSONP backend is instantiated (first `http.jsonp()` call or eager provider creation).
Common situations: Legacy enterprise apps consuming old third-party APIs that never sent CORS headers; upgrading such apps to modern Angular where removal is scheduled; teams discovering hidden JSONP usage only when the warning appears during a migration.
Related errors
- JSONP_UNSAFE_URL
- JSONP_WRONG_RESPONSE_TYPE
- JSONP_HEADERS_NOT_SUPPORTED
- MISSING_JSONP_MODULE
- WARNING: sanitizing HTML stripped some content, see ${XSS_SE
AI-assisted analysis of angular/angular@51cb07e980 (2026-08-22).
Data as JSON: /api/errors/19554bb867d944ba.
Report an issue: GitHub.