New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Show weather location challenge is not solvable in Chrome v51 #7853
Comments
Yes and I agree we definitely need an alternative here. Open to suggestions as well. We have been trying to updgrade the codepen.io examples to Open to all suggestions in this regard! I haven't had the time to check but if you or anyone else willing to look at this could go through the https://github.com/toddmotto/public-apis and check if we have any promising candidate. Thanks. |
Arguably, 51 is not the current production/public release, and all these dev versions do come with a disclaimer on how you should not use them as your main browser. Though I do agree we should find alternatives, I do not believe this is an issue of priority. |
@hallaathrad I agree that it is not a priority issue. But in less than (12 weeks / 3months) a lot of people will notice that their old code isn't working. I don't know how people will react to that. May be show a notice. I don't know the best way to resolve this issue. |
I saw someone asking about this issue today on the subreddit, because Chrome v50 just released and has broken anyone's project that uses OpenWeather (if viewed through Chrome, of course). I have given Wunderground a try, and it seems fine enough to me - https://www.wunderground.com/weather/api/d/pricing.html?MR=1 Here's my new version using this API - https://codepen.io/Fattox/pen/mPxzgg Would it be enough to update the description pointing to this as the new API to be used? |
@fattox Leaving API keys like that is not good practice. So, I don't like this option that. |
@vramana I see your point, but i'm not sure that detail is intended for the scope of this early project? The current example also shows the API key in public form - https://www.freecodecamp.com/challenges/show-the-local-weather (your point is mentioned in "7" also) Unless FCC want to add in the steps on early projects, explaining how to config + forward them from a server. If they do, that's cool too. |
Since Chrome 50 Geolocation API is not working anymore with unsecured connections. Weather apps using Openweathermaps API are broken in Chrome 50, but work in Firefox and Opera. |
@hutstep thanks for the update. |
Can I suggest two things for this issue:
My functioning zipline: https://codepen.io/tparikka/pen/bpQEeP |
@tparikka thanks for https://crossorigin.me/ . My OpenWeatherMap-App is working again in Chrome. So the solution is to open the Codepen URL with https:// in front, and use https://crossorigin.me/ in front of the unsecured API calls like from OpenWeatherMaps. Here's my weather app using OWM-API |
Thanks everyone. This one is bit tricky with the CSP restrictions on CodePen. It will keep breaking for non-secure resources. Considering so many browser types as well. Also we can't actively endorse any website or resource such as @FreeCodeCamp/issue-moderators Can we go for a second opinion and sort this out, like @tparikka is suggesting. |
Hi Everyone. the https://crossorigin.me/ doesn't seem to very liable service as it doesn't work often. Would you mind suggesting some free HTTPS weather API to use for the challenge ? https://codepen.io/olv1do/pen/KzbdMe/ this page works fine and does the task but only in case if the crossorigin.me site is up. I really would not want to submit the project that works in 20% of cases Thanks! |
@Cu3bIu I suggested Wunderground ~4 weeks ago (see my reply above). Changing to this API was quite trivial, and i imagine would also be for anyone else who has already made the weather app. The API also provides a URL to the relevant Wunderground weather icon, also. So no need for an external icon pack, though it is still supported by packs such as - https://erikflowers.github.io/weather-icons/api-list.html ... if you prefer those icons. |
@Cu3bIu I would suggest forecast.io as per my last comment - it includes an HTTPS endpoint that you can use. My pen at https://codepen.io/tparikka/pen/bpQEeP uses forecast.io and I haven't run into any issues. |
As pointed in the comment here by @benschac, we could add a hint or warning on the challenge about the ongoing issues with this challenge until resolved. /cc @FreeCodeCamp/issue-moderators thoughts? |
I agree this particular challenge is getting frustrating to many, we apologize for the inconveniences. For a resolution:
We are definitely not going to recommend crossorigin.me officially, campers may or may not use that at their own discretion. Alternatively, come up with a plan to scrap this challenge to be replaced with any alternate, using some APIs available at https://github.com/toddmotto/public-apis |
I just got this working today thanks to this thread and some other digging around. Here's what I did, without using crossorigin or another CORS proxy. Thought I'd post for other campers.
$.getJSON("https://api.wunderground.com/api/YOUR_API_KEY/conditions/q/" + lat + "," + lon + ".json", function(response) {
console.log(response);
}); |
@tparikka Nice code! You are able to use the forecast.io API without crossorigin.me. You have to use a $.ajax() request instead of the $.getJSON() request and specify jsonp for the dataType. I learned this from the second answer here: http://stackoverflow.com/questions/20035101/no-access-control-allow-origin-header-is-present-on-the-requested-resource
So you'd code (with variables for the latitude and longitude): var url = "https://api.forecast.io/forecast/YOUR_API_KEY/" + lat + "," + lon;
$.ajax({
url: url,
dataType: 'jsonp',
success: function(results) {
console.log(results);
}
}); |
@raisedadead May be we should close this issue in favour of #9145 |
@vramana Yup. Thanks for pointing out. |
getting this error...Missing required request header. Must specify one of: origin,x-requested-with |
The Open Weather Map API was not serving over HTTPS, leading to mixed content issues, since geolocation requires HTTPS. Forecast.io's API is also free, requires sign up, but up to 1k hits per day w/ no charge or card on file. I'm (unsurprisingly) not the first person to notice this. Seems to intersect w/ freeCodeCamp#7853 and freeCodeCamp#9145. squash! updated forecast.io references to 'dark sky' updated forecast.io references to 'dark sky'
The Open Weather Map API was not serving over HTTPS, leading to mixed content issues, since geolocation requires HTTPS. Forecast.io's API is also free, requires sign up, but up to 1k hits per day w/ no charge or card on file. I'm (unsurprisingly) not the first person to notice this. Seems to intersect w/ freeCodeCamp#7853 and freeCodeCamp#9145. squash! updated forecast.io references to 'dark sky' updated forecast.io references to 'dark sky'
In Chrome v51, the geolocation API is only available with secure connections i.e, a camper has to connect to codepen, jsbin etc., via secure connection. So all the http request to openweather API are blocked and only http version of openweather API is free. Also, there are no good free alternatives. The challenge as it stands is impossible to solve in Chrome v51.
So how should this challenge be modified ?? Simplest modification to makes this work will be to ask campers to solve the challenge with city name as an input from the user.
The text was updated successfully, but these errors were encountered: