Capacitor and Ionic CORS errors

Why a Capacitor app hits CORS

A Capacitor app renders its web code in a native WebView that serves your files from a local origin. Capacitor's configuration defaults are server.hostname localhost, server.iosScheme capacitor and server.androidScheme https, so the app's origin is capacitor://localhost on iOS and https://localhost on Android.

Capacitor 6 made https the default androidScheme for existing apps; on Capacitor 5 and earlier the Android origin was http://localhost unless configured. Capacitor's docs say iosScheme cannot be set to a scheme that WKWebView already handles, such as http or https.

Ionic's CORS guide lists two more origins: ionic://localhost for Cordova apps on iOS using cordova-plugin-ionic-webview 3.x, and http://localhost:8100 for ionic serve. Its table still shows http://localhost for Capacitor on Android, the default before Capacitor 6.

fetch() runs inside the WebView, so an API that sends no Access-Control-Allow-Origin for these origins fails on a device the same way it fails in a desktop browser.

Option 1: CapacitorHttp native requests

CapacitorHttp is bundled with @capacitor/core. Capacitor's docs: it "provides native http support via patching fetch and XMLHttpRequest to use native libraries". Native requests are not subject to CORS. The patch is off by default; set plugins.CapacitorHttp.enabled to true in capacitor.config.ts.

import type { CapacitorConfig } from '@capacitor/cli';

const config: CapacitorConfig = {
  appId: 'com.example.news',
  appName: 'News',
  webDir: 'dist',
  plugins: {
    CapacitorHttp: {
      enabled: true,
    },
  },
};

export default config;

The trade-offs, from the Capacitor and Ionic docs:

• Whole app: The patch replaces fetch and XMLHttpRequest for every request in the app, including those from third-party libraries.
• Web builds: On the web it falls back to the browser's own fetch, so a PWA or ionic serve still needs CORS. Ionic's guide says the same for any web context.
• Request bodies: When you call CapacitorHttp.request() directly, data takes only a string or JSON on native.
• Large files: Transfers belong in @capacitor/file-transfer with @capacitor/filesystem.

server.url is not a fix either. It points the WebView at a remote URL for live reload, and Capacitor's docs say it is not intended for use in production.

Option 2: one proxy for every platform

The BBC World RSS feed (https://feeds.bbci.co.uk/news/world/rss.xml, 21,220 bytes, text/xml) sends no Access-Control-Allow-Origin. On 28 October 2026 it answered 200 through https://proxy.cors.dev/ for every origin we sent: Access-Control-Allow-Origin: * for capacitor://localhost and ionic://localhost, and the exact origin echoed for https://localhost, http://localhost and http://localhost:8100.

The proxy works with or without CapacitorHttp, and the same code runs on iOS, Android, ionic serve and a deployed PWA. With CapacitorHttp on, native builds no longer need the proxy, but the web build still does. The snippet returns 10 headlines parsed with DOMParser.

const FEED = 'https://feeds.bbci.co.uk/news/world/rss.xml';

export async function loadHeadlines() {
  const response = await fetch('https://proxy.cors.dev/' + FEED);
  if (!response.ok) {
    throw new Error(response.headers.get('X-Cors-Error') ?? `HTTP ${response.status}`);
  }

  const xml = new DOMParser().parseFromString(await response.text(), 'text/xml');
  return [...xml.querySelectorAll('item')].slice(0, 10).map((item) => ({
    title: item.querySelector('title')?.textContent ?? '',
    link: item.querySelector('link')?.textContent ?? '',
    published: item.querySelector('pubDate')?.textContent ?? '',
  }));
}

The free tier needs no signup and no key. The proxy answers the OPTIONS preflight itself with 204, and when it refuses a request, the X-Cors-Error response header names the reason.

Origins to register for cors.dev Pro

POST, PUT, PATCH and DELETE, request bodies up to 1 MiB, and Authorization or custom headers need cors.dev Pro. A Connection accepts app origins as well as web origins.

1. Start the trial

   Sign up with Google. The 7-day trial includes 1,000 requests and needs no card.

2. List your origins

   capacitor://localhost, https://localhost and ionic://localhost as your builds need, plus http://localhost:8100 for ionic serve and your PWA's https origin, up to 10 in total.

3. List the hosts and send the key

   Enable up to 20 target hosts and send the publishable key in an X-Cors-Key header.

Origin: null never matches a Connection, and an unlisted origin answers 403 origin_not_allowed. Every Capacitor app on iOS shares capacitor://localhost, and every Capacitor 6 or later app on Android shares https://localhost, so an origin check cannot tell your app from someone else's. The list of target hosts is what limits the key. Keep secret API keys on a server: anyone can unpack an app and read the key.

Limits on each tier

The free tier allows about 600 requests per minute per IP and answers 429 with a Retry-After header that JavaScript can read; there is no monthly quota. It refuses Authorization, and header names containing token, apikey, api-key, api_key, secret or password or ending in -key, with 400 header_not_allowed, and drops other custom headers, including names containing csrf or xsrf, listing them in X-Cors-Dropped-Headers.

Good questions.