Help with Iframe in Ionic React

Hello, I have an react capacitor app,
where i have to use hostname as prod url to avoid CORS issues like,
So updated capacitor.config.ts to

  appId: 'io.ionic.starter',
  appName: 'myApp',
  webDir: 'dist',
  server: {
    androidScheme: 'https',

My app also loads url(United States - Wikipedia) in iframe ,
Issue : In iframe instead of page, it is reloading the same app again as domain matches
const config: CapacitorConfig = {
appId: ‘io.ionic.starter’,
appName: ‘myApp’,
webDir: ‘dist’,
server: {
androidScheme: ‘https’,

How to address this issue

when using in localhost:8100 or any other hostname

in actual android

First off, please use proper code blocks so that we can easily read your code - Extended Syntax | Markdown Guide

Second, what are you trying to accomplish? Why are you including Wikipedia in an iframe?

server -> hostname shouldn’t be set to a public hostname. It is recommended to keep it localhost.

App is making an api calls. if we use other domain all are failing with CORS error.

If you set a local hostname it can’t match a remote hostname you want to reach, local requests go to Capacitor internals and won’t hit the remote server.

Try setting the hostname to some subdomain that don’t exists or you don’t want to reach, in example

Thankyou @julio-ionic @twestrick
I updated my code to use capacitor for http calls.
And updated domain to,
We have already added * in CSP frame-ancestors
But I see an error when loading a iframe with
Blocked a frame with origin from accessing a cross-origin frame

That looks like a limitation from itself not allowing to be put in an iframe