Weather app: ignoring the use of https://crossorigin.me[SOLVED]

Weather app: ignoring the use of https://crossorigin.me[SOLVED]
0

Hey guys, could anyone kindly explain me why the heck I can’t get my app working on both Github and Codepen ? If you open console, it’s throwing this error:

Mixed Content: The page at 'https://codepen.io/N4thyra/pen/GELrmd?editors=1111' was loaded over HTTPS, but requested an insecure XMLHttpRequest endpoint 'http://api.openweathermap.org/data/2.5/weather?lat=49.3546741&lon=17.8694483&APPID=cfdc05d02854f871e2eae7e3a0988b1f&units=metric'. This request has been blocked; the content must be served over HTTPS.

I’ve encountered this issue a few times, and the only solution I’ve always come up with was to change the APi, but whenever I run the app on my computer it works perfectly, obviously if I don’'t use the ‘https://crossorigin.me’ , it won’t work and I’ll get the same error, but why the heck are these pages ignoring it? Is there an easy solution to fix my issue? Or do I really have to look for another API?

Thank you in advance.

Edit: I only use Chrome/Chromium on Linux, and the app works on my local computer, but doesn’t work on both Github and Codepen.

2nd Edit: GUYS AVOID USING https://crossorigin.me IN YOUR PROJECTS, IT BEHAVES WEIRDLY!!!

Put the URL behind “https://cors-anywhere.herokuapp.com/” and see if that fixes the issue, if not let us know and we’ll look into other solutions. Crossorigin.me has quite a few issues.

8 Likes

Well, I did want to try that… since I thought https://crossorigin.me couldn’t have caused the issue – I was apparently wrong.

The app is working perfectly when your link is used.

Could I ask you a question? What should I do to avoid having such problems in the future? Always look for an API that uses https?

By the way, thanks a lot. I didn’t really expect that. I was even aware of the link you sent.

1 Like

Realistically don’t use crossorigin.me, it has issues and is slow, but the Darksky API is nice and has HTTPS - though again you’ll need to work around cross origin issues - either the proxy i provided or jsonp will resolve the issue.

1 Like

Alright then. I’ll keep this API for now, if it stops working for some reason, I’ll make some changes. For my future projects, I’ll try to play around with JSONP. I appreciate your help. Cheers!

1 Like

Glad I could help and let us know if you need anything else :slight_smile:

This worked for me!

Thank you you kept me focussed on my 100 Days of Code challenge as a result. Only on Day 3 atm.

Amazing! Thank you so much for the help! It worked for me as well!
:grinning:

Worked a treat!! Thank you :slight_smile: