Show the Local Weather - can't use geolocation API on insecure server (codepen.io)

Hi , maybe you can check on mine : http://codepen.io/CaiYiLiang/full/WoExeB/

Crossorigin.me just shows an empty page with “Origin: header is required” written on it for me. So pretty much can’t use the true geolocation of the device because we have to use https, which prevents us from using http API calls (which weathermap has).

To sum it up, we either use ip address location (innacurate sometimes) or use some sort of proxy magic to use real geolocation with weathermap API.

Hi Andren,

This is a new issue, I have been travelling the world for the past 4 months and have not been coding. The cross origin proxy was working before I left, but this seems to be a new issue.

If anyone can offer assistance that would be great!

It seems to be an issue from the crossorigin proxy. Time to start trouble shooting.

If you use html5 geolocation, you must use https, and CORS issue will come. To solve this, just use http and another location api. However, I still don’t know how to solve problem with loc propertiy.

I am using geolocation API with https. I call the owm API like so:

https://cors-anywhere.herokuapp.com/http://api.openweathermap.org/data/2.5/weather?q=

It works.

EDIT: apparently it’s not advised to use it, but I leave the decision up to you. More info is here: https://github.com/Rob–W/cors-anywhere/#demo-server

4 Likes

I ended up using https://ipinfo.io/geo API to get my latitude and latitude numbers. It works in http://codepen.io which is not secure (not https).

dude. so much help! thanks!

Thank you so much; saved my app!

Thank you for this GarrusNapp.

Thank you!! works for me too.

hi! this fixed my project too! It was really frustrating, since I had finished this project awhile ago, and occasionally when I went back to it, I had to do some bugfixing with the ajax request. This time was particularly annoying, until I found your post. But I’m having trouble understanding why “https://cors-anywhere.herokuapp.com” needs to be added. Before, my ajax request worked using just “http://api.openweathermap.org/data/2.5/weather?q=...etc”. Would you happen to have an explanation why the normal request stopped working?

Arrrr…thank you so much for this! :smiley:

UPDATE:

https://openweathermap.org/ is now SECURE.

You can use navigator.geolocation and run the app in CodePen and on GitHub

Hello community, I have been trying for 4 hours to make my app work but I can’t do it, I would like some help or advice. The method .getCurrentPosition is not working for me and I do not know why :sleepy::worried:

This is my code https://codepen.io/cobicode/pen/RMGgbz/?editors=0110

I wait for your answer:pray:

I am actually wondering whether it is possible to finish this task without paying for api geolocation services.
those that are free are unreliable or work via http only.

Examples of Weather Apps that were kindly posted here don’t work for me.

@Nims I tried navigator.geolocation but it’s very unreliable showing that I am in another town that is 300kms away.

@RadekKosiada Use ipgeolocation.io it has 50K free requests per month quota which is enough for small-scale work. It’s reasonably accurate to city level.

1 Like

There’s a detailed analysis of all the most popular IP Geolocation APIs that might be useful - https://medium.com/@ipdata_co/what-is-the-best-commercial-ip-geolocation-api-d8195cda7027

another way to get the user location is by its ip but this is far away as accuracy as geolocation.