Ask permission for location on page load?

How can i ask for a user’s location on page load?

When i go on my website on Google Chrome on my mobile Google will ask me:

“This URL wants to use your device’s location [allow] or [block].”

This is what I expect to happen. However, when some other people use my app on their devices they don’t get asked this question. Is it a location setting on Google Chrome or perhaps the location settings on their device?

My app is location-based and is useless without access to a users location. Is there a way to always ask for location perhaps using javascript or something else?

Thank you in advance.

2 Likes

This may be of interest to you:

1 Like

As @J805 points out, there is typically an event that triggers the prompt.

Within Bubble, this prompt is triggered when you have something that references current geographic position is actively being used.

So, if you had a map that is visible on page load that asks for current user’s address, then Google will show the prompt asking for the current user’s location. Though, if the map is not visible on page load, you would not see the corresponding prompt until that map is made visible.

From a UI standpoint, a common thing to do is to have a button that explicitly triggers the request. (Ex. Hotels.com’s booking process).

Location

3 Likes

@J805 thanks for the resource, it is helpful.

@dan1 Thanks for the detailed response. I completely agree with your point regarding UI/UX.

Unfortunately, my app requires location on the page landing because it sorts venues from nearest distance. So perhaps what I would need to do is create a group visible on page load with a button that says “Find Venues” then when that button is clicked I save the current user’s current GPS location, and that should prompt the Allow permission popup in the browser?

The problem is having a group with a button on page load before going to the actual website home page is also bad UI/UX.

1 Like

I think that this page (it’s linked from the page @j805 pointed to) gives some great context for thinking through your user experience and asking for permissions.

You can do all sorts of things with conditional states and show/hide accordingly. Though I think the convention that Yelp, Hotels.com, Stubhub, etc. take is quite alright from a UX standpoint.

Several of these sites use IP address for a proxy value (ie. a regional approximation). If you want to display some fairly relevant results without location, you could use IP address to do just that.

Since there isn’t a plugin that does this currently (AFAIK), I’ll look and see what’s possible.

2 Likes

I agree with what @dan1 is saying, I had an app that requested user location right away and it ended up being a problem. The user just wants to dismiss whatever the popup is out of habit, this would break the functionality of my app. So doing something like Yelp or other major developers do is key. Set up a screen to ask their location and have a button where the person can choose if they want to share their location or not. Take a look at the examples that @dan1 pointed out for some great UI suggestions. I ended up copying Yelp for my design and it helped a lot. I am confident you will be able to figure something that will work without having to request it on page load. :slight_smile:

1 Like

Based on both your replies @dan1 @J805, i think i’m going to have to change the landing page of my app to have a search bar and a button (showing no venues on default). It seems like that is what all the big tech companies are doing and what all the UI suggestions say. I currently have a search bar with all the venues showing below it by default. However, I have a single page app that also complicates things.

1 Like

Ya, it can be a little complicated with a single page app to do things. But don’t make it more complicated than it needs to be. Do you use “custom states” to display “pages”?

If by “pages” you mean groups then yes I do.

Yes, that’s good. That’s what I do as well. Just add a page on top of everything and have that load on page load. Then hide it once you get a location. :slight_smile:

1 Like

@leonidas.petrou4 - this conversation inspired me to build out a plugin that utilized IP-based location as a proxy. You may be interested in exploring this as an option for your app.

2 Likes

@dan1 That’s incredible! Thank you! I will try set it up and let you know how it works out.

1 Like

Hi @J805 my app also requests user location right away and it is also a problem from a UX standpoint.

I have tried adding a group ontop of my Single Page App but because it is the same page it still prompts the browser location permission on page load. I want to set it up like you have it (similar to yelp) to set up a screen to ask the users’ location and have a button where the person can choose if they want to share their location or not.

I also am struggling to find the source in my app that is requesting user location, i have tried disabling all my workflows but the browser location permission popup still appears on page load.

I’d love to get your feedback on how you solved this problem?

No problem. Thanks for reaching out. Have you checked your maps? Do they have the location default as “current location” anywhere? That will set off the request. I noticed that with mine before.

I just checked now, the maps don’t use current location. However I do have repeating groups with a list of venues and I use “distance from current users location”. I tried deleting everything on my index page that uses location (as a test) yet the browser location permission popup still appears on page load. Do you know if there is a way to check what in the app in prompting that permission request?

In that link you sent Here is states Under URLs , Lighthouse reports the line and column numbers where your code is requesting permission to send notifications. Remove these calls, and tie the requests to user gestures instead. However I have no idea what this means. Do you perhaps have any ideas?

Hey. Let me see if there is a way to search all places where “current location” is used. That would be the best place to start. I won’t be around the computer for a few days though. Just on my phone. In the mean time, try searching and see if it allows you to search for current location.

Also, try the debug/test view and if you do “step by step” and refresh the page it might show you at the bottom where it asked you for your current location. The debug mode is super helpful once you get used to how it works.

Thank you for helping me Jason! I tried searching “current location” and similar terms in my workflows and elements but no luck. I also tried the debug/test view on “step by step” and tried refreshing the page but nothing in the debugger refers to location.

Its been a while since any talk in this chat but I currently need to get the users location when they “check into an event”

I have this event check in module in a reusable element popup that contains 4 other non GPS modules. The 2 pages that use this reusable element both ask for the users location on load. I have found that the workflows in the reusable element are causing the prompt on page load even though they are not run.

I have tried using a hidden input has a variable that has a condition that must be met before its initial content is set to getting the current users location. That hidden input is also in a hidden group and in the unopened popup. I used this hidden input to in the workflow to try and stop the permissions prompt on load.

Anyone know if there is a solution? Thanks. If all else fails I’ll just put this GPS Check In on a separate page.

Merry Christmas

I always allow it, I feel safer like this.

1 Like

Hey Dan!
All my groups are not visible on page load, yet it does prompt asking for location permission. :frowning:
Is there a way to disable that? Because I do have specific prompts later on.