CODEWITHSUNDEEP
angularionic-frameworkionic2
Hüseyin Burak Karadag
Hüseyin Burak Karadag

Reputation: 1888

Ionic call API with Proxy always return 404

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/

I use this method access to api. But my url return always 192.168.**.**:8100/api/Configurations/GetAppConfiguration so I 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…

GetMethod

getPosts (): Observable<any[]> {
    debugger;
    return this.http.get("api/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"
    }
  ]
}

launch.json

 "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>

Upvotes: 1

Views: 1054

Answers (1)

H&#252;seyin Burak Karadag
H&#252;seyin Burak Karadag

Reputation: 1888

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);

}

Upvotes: 2

Related Questions