The 'Access-Control-Allow-Origin' header has a value 'http://www.wunderground.com' that is not equal to the supplied origin. Origin 'http://localhost:8100' is therefore not allowed access


#1

34 PM

Provider

weather.ts

import { Injectable } from ‘@angular/core’;
import { Http } from ‘@angular/http’;
import ‘rxjs/add/operator/map’;

@Injectable()
export class WeatherProvider {
apikey: ‘71a59f82f0c3de52’;
url;

constructor(public http: Http) {
console.log(‘Hello WeatherProvider Provider’);
this.url =‘http://api.wunderground.com/api/’+this.apikey+’/conditions/q’;

}
getweather(city,state){
return this.http.get(this.url+’/’+state+’/’+city+’.json’)
.map(res => res.json());
}

}

home.ts file
import { Component } from ‘@angular/core’;
import { NavController } from ‘ionic-angular’;
import { WeatherProvider } from ‘…/…/providers/weather/weather’;

@Component({
selector: ‘page-home’,
templateUrl: ‘home.html’
})
export class HomePage {

weather:any;

location:{
city: String,
state: String
}

constructor(public navCtrl: NavController, private weatherProvider: WeatherProvider) {

}
ionViewWillEnter(){
this.location = {
city:‘miami’,
state: ‘FL’
}
this.weatherProvider.getweather(this.location.city, this.location.state)
.subscribe(weather =>{
this.weather = weather.current_observation;
});
}

}

home.html file

Home
    <h2 class="location">{{weather.display_location.full}}</h2>
    
  </ion-col>
</ion-row>

#2

To debug locally you should use a proxy


#3