angular/angular · error · RuntimeError

MISSING_JSONP_MODULE

MISSING_JSONP_MODULE

Error message

Cannot make a JSONP request without JSONP support. To fix the problem, either add the `withJsonpSupport()` call (if `provideHttpClient()` is used) or import the `HttpClientJsonpModule` in the root NgModule.

What it means

Thrown by XhrBackend.handle when it receives a request with method 'JSONP'. XhrBackend is the default backend and cannot perform JSONP (which needs script-tag injection and a dedicated backend); a JSONP request reaching it means the JSONP support that reroutes such requests to JsonpClientBackend was never installed. The message tells you exactly which registration is missing for your setup style.

Source

Thrown at packages/common/http/src/xhr.ts:128

    optional: true,
  });

  constructor(private xhrFactory: XhrFactory) {}

  private maybePropagateTrace<T extends Function>(fn: T): T {
    return this.tracingService?.propagate ? this.tracingService.propagate(fn) : fn;
  }

  /**
   * Processes a request and returns a stream of response events.
   * @param req The request object.
   * @returns An observable of the response events.
   */
  handle(req: HttpRequest<any>): Observable<HttpEvent<any>> {
    // Quick check to give a better error message when a user attempts to use
    // HttpClient.jsonp() without installing the HttpClientJsonpModule
    if (req.method === 'JSONP') {
      throw new RuntimeError(
        RuntimeErrorCode.MISSING_JSONP_MODULE,
        (typeof ngDevMode === 'undefined' || ngDevMode) &&
          `Cannot make a JSONP request without JSONP support. To fix the problem, either add the \`withJsonpSupport()\` call (if \`provideHttpClient()\` is used) or import the \`HttpClientJsonpModule\` in the root NgModule.`,
      );
    }

    // Validate that the request is compatible with the XHR backend.
    ngDevMode && validateXhrCompatibility(req);

    // Check whether this factory has a special function to load an XHR implementation
    // for various non-browser environments. We currently limit it to only `ServerXhr`
    // class, which needs to load an XHR implementation.
    const xhrFactory: XhrFactory & {ɵloadImpl?: () => Promise<void>} = this.xhrFactory;
    const source: Observable<void | null> =
      // Note that `ɵloadImpl` is never defined in client bundles and can be
      // safely dropped whenever we're running in the browser.
      // This branching is redundant.
      // The `ngServerMode` guard also enables tree-shaking of the `from()`

View on GitHub (pinned to 51cb07e980)

Solutions

  1. If using provideHttpClient: add withJsonpSupport() to the same provideHttpClient(...) call that provides HttpClient for the code making the request
  2. If using NgModules: import HttpClientJsonpModule alongside HttpClientModule in the root NgModule
  3. Verify the feature is registered in the injector that serves the component calling http.jsonp() (not a sibling/lazy injector)
  4. Consider replacing the JSONP endpoint with a CORS-enabled normal request — JSONP is deprecated and XSS-prone

Example fix

// before
provideHttpClient(withFetch(), withInterceptors([authInterceptor]));
// ...
http.jsonp('https://api.example.com/data', 'cb'); // throws MISSING_JSONP_MODULE

// after
provideHttpClient(withFetch(), withInterceptors([authInterceptor]), withJsonpSupport());
Defensive patterns

Strategy: try-catch

Validate before calling

// fail fast before issuing JSONP if support is missing (dev aid)
import {JsonpClientBackend} from '@angular/common/http';
function jsonpSupportRegistered(): boolean {
  return inject(JsonpClientBackend, {optional: true}) !== null;
}

Try / catch

http.jsonp<unknown>(url, 'cb').subscribe({
  next: handleData,
  error: (err) => {
    if (err instanceof Error && err.message.includes('without JSONP support')) {
      // registration bug: add withJsonpSupport() / HttpClientJsonpModule
      console.error('JSONP support is not registered — fix provideHttpClient setup');
    } else {
      handleFailure(err);
    }
  },
});

Prevention

When it happens

Trigger: Calling http.jsonp(url, 'cb') after provideHttpClient(...) without withJsonpSupport(); using NgModule-based HttpClientModule (which defaults to XhrBackend) without importing HttpClientJsonpModule; registering withJsonpSupport() on a different injector than the one issuing the request.

Common situations: Migrating from HttpClientModule to provideHttpClient and dropping the JsonpModule import; enabling provideHttpClient in a lazy route but adding withJsonpSupport() only in the root; hitting a legacy JSONP endpoint after an Angular upgrade. JSONP is deprecated since 22.1, so ideally migrate the endpoint.

Related errors


AI-assisted analysis of angular/angular@51cb07e980 (2026-08-22). Data as JSON: /api/errors/83439c355704ef81. Report an issue: GitHub.