CORS issue while shaping working web app into a native Ionic app for Android w/ capacitor

I’ve been trying to set up this Ionic CLI proxy server following this guide, but it’s from 2015 and I have no idea how to implement it in Angular 10.

So when I run my app with a command:

ionic capacitor run android --project=myApp -c=production

I have this error in Android Studio:

E/Capacitor/Console: File: http://localhost/login - Line 0 - Msg: Access to XMLHttpRequest at 'https://remoteServer.com/api/v1/oauth/v2/token' from origin 'http://localhost' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' head

This is my capacitor.config.json file:

{
  "appId": "io.ionic.starter",
  "appName": "myApp",
  "bundledWebRuntime": false,
  "npmClient": "npm",
  "webDir": "www",
  "plugins": {
    "SplashScreen": {
      "launchShowDuration": 0
    }
  },
  "cordova": {},
  "linuxAndroidStudioPath": "/opt/android-studio/bin/studio.sh"
}

And this is my ionic.config.json file:

{
  "name": "myApp",
  "integrations": {
    "capacitor": {}
  },
  "type": "angular",
  "proxies": [
    {
      "path": "/api",
      "proxyUrl": "https//remoteServer.com/api"
    }
  ]
}

ionic info

Ionic:

   Ionic CLI                     : 6.10.1 (/home/user/.nvm/versions/node/v12.18.3/lib/node_modules/@ionic/cli)
   Ionic Framework               : @ionic/angular 5.3.1
   @angular-devkit/build-angular : 0.1000.5
   @angular-devkit/schematics    : 10.0.5
   @angular/cli                  : 10.0.5
   @ionic/angular-toolkit        : 2.3.3

Capacitor:

   Capacitor CLI   : 2.4.0
   @capacitor/core : 2.4.0

Utility:

   cordova-res : not installed
   native-run  : not installed

System:

   NodeJS : v12.18.3 (/home/user/.nvm/versions/node/v12.18.3/bin/node)
   npm    : 6.14.6
   OS     : Linux 5.4

Any ideas how to resolve this? I’ve been searching for ages…

1 post - 1 participant

Read full topic