Ionic call API with Proxy always return 404

Ionic Framework ionic-v3
1

I have a problem access API url always return External IP : http://192.168. ** . ** :8100. My API is hosted on local IIS server like this IP 192.168. ** . ** :3000.

When I debuging project on Android Emulator I see on debug console
Proxy added:/api => http://192.168. ** . ** :3000/

ı use this method access to api. But my url return always
192.168. ** . ** : 8100/api/Configurations/GetAppConfiguration so ı get an error 404 because my API IP address use 3000 port.

I added config.xml allow navigation href my API url http://192.168. ** . ** :3000 but it did not work.

What is the problem ? What am i missing ?

Thanks you for help…

    getPosts (): Observable<any[]> {
        debugger;
        return this.http.get("/Configurations/GetAppConfiguration")
            .map(this.parseData)
            .catch(this.handleError);
    }

Ionic.config.json

{
  "name": "myApp",
  "app_id": "",
  "type": "ionic-angular",
  "integrations": {
    "cordova": {}
  },
  "proxies": [
    {
      "path": "/api",
      "proxyUrl": "http://192.168.** .** :3000"
    }
  ]
}

this is launch.json info

     "name": "Run Android on emulator",
            "type": "cordova",
            "request": "launch",
            "platform": "android",
            "target": "emulator",
            "port": 9222,
            "sourceMaps": true,
            "cwd": "${workspaceRoot}",
            "ionicLiveReload": true,
            "devServerTimeout": 120000

config.xml


<?xml version='1.0' encoding='utf-8'?>
<widget id="io.ionic.starter" version="0.0.1" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
    <name>MyApp</name>
    <description>An awesome Ionic/Cordova app.</description>
    <author email="hi@ionicframework" href="http://ionicframework.com/">Ionic Framework Team</author>
    <content original-src="index.html" src="http://192.168.**.**:8100" />
    <access origin="*" />
    <allow-navigation href="http://ionic.local/*" />
    <allow-intent href="http://*/*" />
    <allow-intent href="https://*/*" />
    <allow-intent href="tel:*" />
    <allow-intent href="sms:*" />
    <allow-intent href="mailto:*" />
    <allow-intent href="geo:*" />
    <preference name="webviewbounce" value="false" />
    <preference name="UIWebViewBounce" value="false" />
    <preference name="DisallowOverscroll" value="true" />
    <preference name="android-minSdkVersion" value="16" />
    <preference name="BackupWebStorage" value="none" />
    <preference name="SplashScreen" value="none" />
    <platform name="android">
        <allow-intent href="market:*" />
        <icon density="ldpi" src="resources/android/icon/drawable-ldpi-icon.png" />   
    </platform>
    <platform name="ios">
        <allow-intent href="itms:*" />
        <allow-intent href="itms-apps:*" />
        <icon height="57" src="resources/ios/icon/icon.png" width="57" />      
    </platform>
    <preference name="SplashShowOnlyFirstTime" value="false" />
    <preference name="SplashScreenDelay" value="3000" />
    <allow-navigation href="http://192.168. ** . ** :8101" />
    <allow-navigation href="http://192.168. ** . ** :8100" /> 
    <engine name="android" spec="^6.2.3" />
    <plugin name="cordova-plugin-device" spec="^1.1.6" />
    <plugin name="cordova-plugin-network-information" spec="^1.3.3" />
    <plugin name="cordova-plugin-screensize" spec="^1.3.1" />
    <plugin name="cordova-plugin-splashscreen" spec="^4.0.3" />
    <plugin name="cordova-plugin-statusbar" spec="^2.2.3" />
    <plugin name="cordova-plugin-whitelist" spec="^1.3.2" />
    <plugin name="ionic-plugin-keyboard" spec="^2.2.1" />
</widget>
2

I solved this problem

  • Added ionic.config.json files my proxies setting like this
"proxies": [
      {
          "path": "*/apibase",
          "proxyUrl": "http://192.168. ** . **:3000"
      }
   ]
  • change Config.xml file and added new configuration property
<allow-navigation href="http://*/*" />
<allow-intent href="https://*/*" />
  • use get method like this
getPosts (): Observable<any[]> {        
 return this.http.get("apibase/api/Configurations/GetAppConfiguration")
    .map(this.parseData)
    .catch(this.handleError);
}
1 Like
3

How can I add a Host header inside the proxy ? I need the Host header for Kong API gateway.

4

I have same problem …But this doesn’t solved my issue…It still connects to 8100. Any help please…