CODEWITHSUNDEEP
htmlgeolocation
lpaxionj
lpaxionj

Reputation: 175

Custom HTML5 Geolocation Prompt

As I am testing out one of the HTML5 features - geolocation for my project, I realized that users can close the prompt without allowing or denying it, that defeats the whole purpose of the prompt.

And because in my project I want to dynamically display data to users depending on user's location, this can't be done, simply because without knowing user's response, it doesn't trigger any of the two callbacks - success / error.

so I started searching to see if there's any solution to this, and a lot of suggestions to this is to set timeout, I tried and everything works perfectly. However, one small flaw here is tho, by the time it hits the timeout expiration, all the data are already displayed, and when i say all, i mean EVERYTHING, because there's no location detected.

So I came up with two solutions that might work, 1) create a custom geolocation prompt that forces users to allow/deny location to be shared, and pass the response to browser to set the location preference 2) pause page-load (stop stuff from being rendered) and wait till it hits the timeout expiration or it gets response from users

Does anyone have any idea how to implement one of these two solutions?

PS: sorry if this isn't unclear to you, i know my english sucks, but I can explain in more details.

Thanks guys!

Upvotes: 5

Views: 3686

Answers (1)

theaccordance
theaccordance

Reputation: 889

You shouldn't be able to use a custom Geolocation prompt if your project is browser based, because malicious developers could use the method to trick the user. Also, since the Geolocation API is an asynchronous event, it's going to continue loading the rest of the page while it waits.

What I recommend is to use a conditional statement instead with an else clause. This way, your script functions should only execute after location has been shared, and you have a fall back on what should happen if no geolocation information is provided (which I highly recommend as situations will occur when the data isn't provided).

Example of the conditional statement to check for geolocation information using JS:

if (navigator.geolocation) {
    // code to run if there is geolocation information
}
else{
// code to run if no geolocation info is given to the browser
}

Upvotes: 4

Related Questions