ionic-frameworkionic3google-chrome-devtoolsionic-nativeionic-view

Ionic application shows localhost:8080 in chrome inspect

beginner in ionic technology. Facing issue after creating project ionic start Myapp blank ionic cordova run android

@ionic/cli-utils  : 1.19.2
ionic (Ionic CLI) : 3.20.0

global packages:

cordova (Cordova CLI) : 8.0.0

local packages:

@ionic/app-scripts : 3.1.11
Cordova Platforms  : android 7.0.0
Ionic Framework    : ionic-angular 3.9.2

System:

Android SDK Tools : 26.1.1
Node              : v8.11.2
npm               : 5.6.0
OS                : Windows 10

Environment Variables:

ANDROID_HOME : C:\Users\XXX\AppData\Local\Android\Sdk

Misc:

backend : pro.

After running the application to inspect using android device. chrome://inspect/#devices Following differences are there ! enter image description here

Above image and URL starts with localhost:8080

here in below image URL starts with file:///android_asset/www/index.html

enter image description here

How to get URL as file:///android_asset/www/index.html in every ionic projects using chrome inspect instead of localhost:8080?

Due to this issue Facing issue like : Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:8080' is therefore not allowed access. The response had HTTP status code 400.

Solution

  • The above issue resolved by following command

    project directory>ionic cordova plugin remove cordova-plugin-ionic-webview 
project directory>ionic cordova run android

    and check in chrome://inspect it will connect with file:///android_asset it will work !! Happy coding