404 not found error while calling an api

Ionic Framework ionic-v3
1

error: "\n<html lang=“en”>\n\n<meta charset=“utf-8”>\nError\n\n\n

Cannot GET /api.openweathermap.org/data/2.5/forecast
\n\n\n"
headers: Object { normalizedNames: Map, lazyUpdate: null, lazyInit: HttpHeaders/this.lazyInit() }
message: "Http failure response for http://localhost:8100/api.openweathermap.org/data/2.5/forecast?q=London,uk&APPID=96a56000e70744cd3f1ab8f1955aacb9: 404 Not Found"
name: "HttpErrorResponse"
ok: false
status: 404
statusText: "Not Found"
url: "http://localhost:8100/api.openweathermap.org/data/2.5/forecast?q=London,uk&APPID=96a56000e70744cd3f1ab8f1955aacb9"
proto: Object { constructor: HttpErrorResponse() }

I’m getting this error while trying to call weather api.
it is working good when i request directly(removing local host part i.e, (http://api.openweathermap.org/data/2.5/forecast?q=London,uk&APPID=96a56000e70744cd3f1ab8f1955aacb9))
so no problem with apikey
I’m using httpClient module of angular5
Further details can be queried.
thank you

2

is the api on your local server?

3

no it is open weather api not local

4

so why do you want to call it on localhost:8100?

5

im making a request using a provider on dev server so it automatcally do that

6

i am facing same problem as well. Ionic is calling to local server instead of web. Below is the code for provider. Please let me know if anyone can help here.

import { HttpClient } from '@angular/common/http';
import { HttpHeaders } from '@angular/common/http';
import { Injectable } from '@angular/core';
import 'rxjs/add/operator/map';

const httpOptions = {
  headers: new HttpHeaders({
    'Content-Type': 'application/json'
  })
}

@Injectable()
export class WeatherProvider {
  apikey ='a65d1067fb6d51ee336bd94e634972e9';
  url;

  constructor(public http: HttpClient) {
    console.log('Hello WeatherProvider Provider');
    this.url = 'https://api.openweathermap.org/data/2.5/weather?q=';
  }
getweather(city, country){
return this.http.get(this.url+city+','+country+'&appid='+this.apikey)

}
}
7

Thats not ionic issue that is an issue in your API so install postman or insomnia to test your api and then if it works fine there then you are good to go and use it in ionic and if your backend api is in laravel then you might be facing some authentication problem, if your API route is in middleware take it out of middleware. This is a server side problem.

8

thanks for your feedback. I resolved this with proxy settings

1 Like