Javascript - geolocation not working in codepen

Question

I am trying to implement a simple weather application in codefen. The application works fine on localhost. It requests permission to use navigator.geolocation, and if it is accepted, it shows the weather, but it did not even ask for permission on codepen.

here's a link

http://codepen.io/asamolion/pen/BzWLVe

Here is the JS function

function getWeather() { 'use strict'; $('#getWeatherButton').hide(); if (navigator.geolocation) { navigator.geolocation.getCurrentPosition(function (position) { var url = 'http://api.openweathermap.org/data/2.5/weather?APPID=53ac88144e6ee627ad0ed85277545ff9'; // var url = 'example.js'; var apiCall = url + '&lat=' + position.coords.latitude + '&lon=' + position.coords.longitude; // window.location.href = apiCall; $.getJSON(apiCall, function (json) { setSkycon(parseInt(json.weather[0].id, 10)); $('#location').html(json.name + ', ' + json.sys.country); var temp = (Math.round((json.main.temp - 273.15) * 100) / 100); $('#temp').html(temp + '<span id="degree">&deg;</span><span id="FC" onclick="convert()">C</span>'); $('#condition').html(json.weather[0].main); }); }); } }; 

Can someone tell me why codepen is not asking for permission?

Answer 1

I had the same problem with the same call. Just add your code using https instead of http and everything will be fine.

Like this:

https://codepen.io/crownedjitter/pen/AXzdvQ

if you want to use this:

 navigator.geolocation.getCurrentPosition(); 

in Chrome.

Answer 2

In the console in Chrome:

getCurrentPosition () and watchPosition () are deprecated when insecure. To use this feature, you should translate the application into a secure origin, such as HTTPS.

Here's more details: https://sites.google.com/a/chromium.org/dev/Home/chromium-security/deprecating-powerful-features-on-insecure-origins Essentially, Chrome wants to send location information via HTTPS . However, to allow developers to test, they handle localhost as if it were a secure network. Hope this helps!

Answer 3

Starting with Chrome 50, Chrome no longer supports geolocation in insecure protocols. https://developers.google.com/web/updates/2016/04/geolocation-on-secure-contexts-only