title: Ionic 2 GET http://localhost:8100/search/aq?query= 404 (Not Found)
body: <p>I want to make a simple app with a <code>http</code> request but I have and issue with <code>cors</code> in ionic 2.</p>
  
  <p>Firstly, i have changed my <code>ionic.config.json</code></p>
  
  <pre><code>{
    "name": "weatherapp",
    "app_id": "",
    "v2": true,
    "typescript": true,
     "proxies": [
      {
        "path": "/api",
        "proxyUrl": "http://api.wunderground.com/api"
      },
      {
        "path":"/search",
        "proxyUrl": "http://autocomplete.wunderground.com"
      }
    ]
  }
  </code></pre>
  
  <p><code>weather.service.ts</code></p>
  
  <pre><code>import {Injectable, Inject} from '@angular/core';
  import {Http} from '@angular/http';
  import {Observable} from 'rxjs/Observable';
  import 'rxjs/Rx';
  
  @Injectable()
  export class WeatherService {
          http: any;
          searchUrl: any;
          apiKey: string;
          conditionsUrl: string;
      static get parameters(){
          return [Http];
      }
  
      constructor(http){
          this.http = http;
          console.log('Service Connected : )');
          this.apiKey = '1e4420a89011eef4';
          this.conditionsUrl= 'http://api.wunderground.com/api/'+this.apiKey+'/conditions/q';
          this.searchUrl='http://localhost:8100/search/aq?query=';
      }
  
      getWeather(city, state){
          return this.http.get(this.conditionsUrl+'/'+state+'/'+city+'.json')
          .map(res =&gt; res.json());
      }
  
       searchCities(searchStr){
          return this.http.get(this.searchUrl+''+searchStr)
             .map(res =&gt; res.json());
      }
  }
  </code></pre>
  
  <p><code>weather.ts</code></p>
  
  <pre><code>import { Component } from '@angular/core';
  import { NavController } from 'ionic-angular';
  import { OnInit } from '@angular/core';
  import { WeatherService } from '../../services/weather.service';
  
  @Component({
    selector: 'page-weather',
    templateUrl: 'weather.html',
    providers: [WeatherService]
  })
  export class WeatherPage {
      results: any;
      searchStr: any;
      weather: any;
      state: string;
      city: string;
  
    weatherService : WeatherService;
    static get parameters(){
      return [[WeatherService]];
    }
  
    constructor(weatherService) {
      this.weatherService = weatherService;
      this.city = 'Istanbul';
      this.state = '';
      this.searchStr;
      this.weather;
      this.results;
    }
  
    ngOnInit(){
      this.weatherService.getWeather(this.city, this.state)
      .subscribe(weather =&gt; {
        //console.log(weather);,
        this.weather = weather.current_observation;
      })
    }
  
    getQuery(){
          this.weatherService.searchCities(this.searchStr)
      .subscribe(res =&gt; {
        //console.log(weather);
        this.results = res.RESULTS
       console.log(this.results);
      })
    }
  }
  </code></pre>
  
  <p><code>weather.html</code></p>
  
  <pre><code>&lt;ion-header&gt;
    &lt;ion-navbar&gt;
      &lt;ion-title&gt;Weather Home&lt;/ion-title&gt;
    &lt;/ion-navbar&gt;
  &lt;/ion-header&gt;
  
  &lt;ion-content padding class="body"&gt;
    &lt;ion-grid *ngIf="weather"&gt;
      &lt;ion-row&gt;
        &lt;ion-col width-100&gt;
          &lt;ion-list&gt;
            &lt;ion-item&gt;
              &lt;ion-label fixed&gt;Enter City&lt;/ion-label&gt;
              &lt;ion-input (keyup)="getQuery()" [(ngModel)]="searchStr" type="text"&gt;&lt;/ion-input&gt;
            &lt;/ion-item&gt;
          &lt;/ion-list&gt;
        &lt;/ion-col&gt;
      &lt;/ion-row&gt;
      &lt;ion-row&gt;
        &lt;ion-col width-50 offset-25&gt;
          &lt;h2 class="location"&gt;{{weather.display_location.full}}&lt;/h2&gt;
          &lt;div class="icon"&gt;&lt;img src="{{weather.icon_url}}"&gt;&lt;/div&gt;
          &lt;h3 class="desc"&gt;{{weather.weather}}&lt;/h3&gt;
          &lt;h1 class="temp"&gt;{{weather.temp_c}}&amp;deg;&lt;/h1&gt;
        &lt;/ion-col&gt;
      &lt;/ion-row&gt;
        &lt;ion-row&gt;
        &lt;ion-col width-100&gt;
          &lt;ion-list&gt;
            &lt;ion-item&gt;
              &lt;strong&gt;Temp: &lt;/strong&gt;{{weather.temperature_string}}
            &lt;/ion-item&gt;
            &lt;ion-item&gt;
              &lt;strong&gt;Relative Humidity: &lt;/strong&gt;{{weather.relative_humidity}}
            &lt;/ion-item&gt;
            &lt;ion-item&gt;
              &lt;strong&gt;Dewpoint: &lt;/strong&gt;{{weather.dewpoint_string}}
            &lt;/ion-item&gt;
            &lt;ion-item&gt;
              &lt;strong&gt;Visibility: &lt;/strong&gt;{{weather.visibility_mi}}
            &lt;/ion-item&gt;
            &lt;ion-item&gt;
              &lt;strong&gt;Wind: &lt;/strong&gt;{{weather.wind_mph}} Mph
            &lt;/ion-item&gt;
            &lt;ion-item&gt;
              &lt;strong&gt;Wind Direction: &lt;/strong&gt;{{weather.wind_dir}}
            &lt;/ion-item&gt;
            &lt;ion-item&gt;
              &lt;strong&gt;Heat Index: &lt;/strong&gt;{{weather.heat_index_string}}
            &lt;/ion-item&gt;
            &lt;ion-item&gt;
              &lt;strong&gt;Last Updated: &lt;/strong&gt;{{weather.observation_time_rfc822}}
            &lt;/ion-item&gt;
          &lt;/ion-list&gt;
        &lt;/ion-col&gt;
      &lt;/ion-row&gt;
    &lt;/ion-grid&gt;
  &lt;/ion-content&gt;
  </code></pre>
  
  <p>This is the error I receive.
  <a href="https://i.stack.imgur.com/G2KeM.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/G2KeM.png" alt="enter image description here"></a></p>
  
  <p>I have only found one solution - <strong><em>"adding proxies to ionic.config.json</em></strong>", but was not able to get it to work.</p>