Origin does not have permission to use Geolocation service -- even over HTTPS

Question

I have a web page that uses HTML5 geolocation over HTTPS. It works a-okay on desktop browsers. On iOS Safari, however, I get the error that "Origin does not have permission to use Geolocation service". I have ensured that everything on the page loads via HTTPS -- every image, every script, and all other assets are showing HTTPS in Chrome dev tools. Nonetheless, geolocation returns the error.

Here's some of my JavaScript:

if ("geolocation" in navigator) {
    navigator.geolocation.getCurrentPosition(function (position) {
        // Do stuff with the geo data...
    }, function(error) {
        // I always end up here on iOS Safari.
        alert(error.code + ": " + error.message);
    });
} 
else {
    $("#search-results").append("Location is unavailable in this browser.");
}

What have I missed?

More info: I just grabbed the code from this W3 Schools example, which works perfectly in my iOS Safari, and pasted it on my site. It did not work. I still receive no prompt to allow geolocation on my site. I've cleared browser cache and reset location warnings in Settings to no avail.

Solution

I had the same problem and it is because of new standards for the Golocation API in Chrome (and Safari):

Chrome no longer supports obtaining the user's location using the HTML5 Geolocation API from pages delivered by non-secure connections.

The only solution is to host from HTTPS and remove all HTTP requests from third parties. Check your network tab in developer mode to filter out HTTP calls, this also includes images (which was the trouble in my case).

You can read more here: Geolocation API Removed from Unsecured Origins.

Comments

[mrcoulson]

I got this sorted out. Although I declined other accepted answers to other questions related to HTTP content because I had verified that all content was loading over HTTPS, it turned out that mixed content was precisely the cause. On this particular page, there are lots of other JavaScript errors and warnings in the console (not all my code), so I missed two stray HTTP scripts from a third party. I contacted those guys, they fixed their scripts to use HTTPS, and now my geolocation works flawlessly. So, how do I properly handle this in SO?

[James Okpe George]

Does this also apply to localhost, cause I get the same issue on localhost. I looked at the doc and it explicitly says that localhost is by default recognized as safe.