angular - Ionic 2 GET http://localhost:8100/search/aq?query= 404 (Not Found) -
i want make simple app http request have , issue cors in ionic 2.
firstly, have changed ionic.config.json
{ "name": "weatherapp", "app_id": "", "v2": true, "typescript": true, "proxies": [ { "path": "/api", "proxyurl": "http://api.wunderground.com/api" }, { "path":"/search", "proxyurl": "http://autocomplete.wunderground.com" } ] } weather.service.ts
import {injectable, inject} '@angular/core'; import {http} '@angular/http'; import {observable} 'rxjs/observable'; import 'rxjs/rx'; @injectable() export class weatherservice { http: any; searchurl: any; apikey: string; conditionsurl: string; static 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 => res.json()); } searchcities(searchstr){ return this.http.get(this.searchurl+''+searchstr) .map(res => res.json()); } } weather.ts
import { component } '@angular/core'; import { navcontroller } 'ionic-angular'; import { oninit } '@angular/core'; import { weatherservice } '../../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 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 => { //console.log(weather);, this.weather = weather.current_observation; }) } getquery(){ this.weatherservice.searchcities(this.searchstr) .subscribe(res => { //console.log(weather); this.results = res.results console.log(this.results); }) } } weather.html
<ion-header> <ion-navbar> <ion-title>weather home</ion-title> </ion-navbar> </ion-header> <ion-content padding class="body"> <ion-grid *ngif="weather"> <ion-row> <ion-col width-100> <ion-list> <ion-item> <ion-label fixed>enter city</ion-label> <ion-input (keyup)="getquery()" [(ngmodel)]="searchstr" type="text"></ion-input> </ion-item> </ion-list> </ion-col> </ion-row> <ion-row> <ion-col width-50 offset-25> <h2 class="location">{{weather.display_location.full}}</h2> <div class="icon"><img src="{{weather.icon_url}}"></div> <h3 class="desc">{{weather.weather}}</h3> <h1 class="temp">{{weather.temp_c}}°</h1> </ion-col> </ion-row> <ion-row> <ion-col width-100> <ion-list> <ion-item> <strong>temp: </strong>{{weather.temperature_string}} </ion-item> <ion-item> <strong>relative humidity: </strong>{{weather.relative_humidity}} </ion-item> <ion-item> <strong>dewpoint: </strong>{{weather.dewpoint_string}} </ion-item> <ion-item> <strong>visibility: </strong>{{weather.visibility_mi}} </ion-item> <ion-item> <strong>wind: </strong>{{weather.wind_mph}} mph </ion-item> <ion-item> <strong>wind direction: </strong>{{weather.wind_dir}} </ion-item> <ion-item> <strong>heat index: </strong>{{weather.heat_index_string}} </ion-item> <ion-item> <strong>last updated: </strong>{{weather.observation_time_rfc822}} </ion-item> </ion-list> </ion-col> </ion-row> </ion-grid> </ion-content> this error receive. 
i have found 1 solution - "adding proxies ionic.config.json", not able work.
i solved finally, i've installed cordova add 'cordova plugin add cordova-plugin-whitelist'. @ project index.html, i've added ''
Comments
Post a Comment