Ionic proxy api

Ionic Framework ionic-v3
1

how to implement api proxy in ionic? My console.log says

“Failed to load https://api.wh.geniussports.com/v1/basketball/competitions/19816/matcheslive?ak=eebd8ae256142ac3fd24bd2003d28782&fromDate=2017-11-17&toDate=2017-12-17&teamId=88261&limit=1: No ‘Access-Control-Allow-Origin’ header is present on the requested resource. Origin ‘http://localhost:8100’ is therefore not allowed access.”

Someone said I’m gonna use proxy api.

my actual api:

https://api.wh.geniussports.com/v1/basketball/competitions/19816/matcheslive?ak=eebd8ae256142ac3fd24bd2003d28782&fromDate=2017-11-17&toDate=2017-12-17&teamId=88261&limit=1

my ionic.config.json

{
  "name": "slingers",
  "app_id": "",
  "type": "ionic-angular",
  "integrations": {
    "cordova": {}
  },
  "proxies": [
    {
      "path": "/api",
      "proxyUrl": "https://api.wh.geniussports.com"
    }
  ]
}

my home.ts

  getMatches(){
  
    this.http.get(this.lets + '/v1/basketball/competitions/19816/matcheslive?ak=eebd8ae256142ac3fd24bd2003d28782&fromDate=2017-11-17&toDate=2017-12-17&teamId=88261&limit=1')
    .map(res => res.json())
    .subscribe(data => {
      this.dataMatches = data.response.data;
      console.log(this.dataMatches);
    }, err => {
      console.log(err);
    });
  }

in my ios device console says:

http://localhost:8080/api/v1/basketball/competitions/19816/matcheslive?ak=eebd8ae256142ac3fd24bd2003d28782&fromDate=2017-11-17&toDate=2017-12-17&teamId=88261&limit=1
Failed to load resource: the server responded with a status of 404 (Not Found)
2

Best way is to fix CORS in your server. Because you have to fix it anyways to make http calls on iOS devices. That is because WebKitWebView enforces CORS.

Allow the origin http://localhost:8100
and allow the http methods

If you cannot change the server, then use Cordova http plugin.

3

I fixed the issue using UIWeb instead of WKWeb. and using platform https://ionicframework.com/docs/api/platform/Platform/

   if (this.platform.is('mobile')) {
      this.lets = "https://api.wh.geniussports.com/v1";
    } else {
      this.lets = "/v1";
    }