Avoid Chrome error messages in GoNative

Hey people

Sometimes in GoNative, I get the error message below. I believe it happens the phone switches between network during a transfer (going from wi-fi to 3G for example). It’s extremely annoying, as it exposes the fact that it’s not a native app, and also the URL, so that people can access the app from a non-mobile device.

GoNative’s support was everything but supportive, saying that it can’t be fixed. I was pretty disappointed by their nonchalanse to be honest. Surely I can’t be the only one to think that hiding the URL is an extremely vital part of the GoNative product?

(The message says “The website is not available”, and "The website [URL] couldn’t be loaded because net::ERR[…]

Does anyone know if this can be solved somehow? Or if any of GoNative’s competitors have a better solution?

I think this is going to be a limitation of using a webview solution for your mobile app. All it’s doing is wrapping your website, so I’m not sure that there’s anyway for them to catch it

1 Like

Yeah, unfortuntely webview will do this. It looks like GoNative actually gives you the source code, so you can always have a developer do some minor work to have the browser display a splash screen (or something like offline.js) when the connection is lost. That might be a cost effective solution.

1 Like

Yeah, I’m kind of surprised that a solution like GoNative haven’t addressed it already, by offering a customized splash screen for example.

Thanks for the input guys, I appreciate it. We’ll probably look into a developer to do that.

Do any of you know if there’s a way to redirect visitors to the app URL if it is not accessed through the app?

I could do it by determining screen size, etc, but it might redirect people with Galaxy Note etc. Is there a way to identify the GoNative client directly?

In the same way that you extract a One Signal ID, you can extract the ‘user agent’ using javascript. If the user agent doesn’t match gonative’s agent, redirect the user.

1 Like

Thanks a lot @supernaturally! I’ll look into that!

if (navigator.userAgent.indexOf(‘gonative’) > -1) {
// do something (trigger bubble_fn_redirectuser, etc.)
}

1 Like

Oh, I’m starting to love you :heart_eyes::slightly_smiling_face:

I’ve never used any custom scripting in Bubble. Could I ask you where I place the script, and how to identify and trigger the workflow to be run?

Glad to help, that’s what the Bubble Community is for :slight_smile:

You’ll need to install the amazing Toolbox plugin. After installing that, several things:

  • Create an html element and place it onto the page (you don’t need to do anything to it yet)

  • Using the Toolbox plugin, create a ‘Javascript To Bubble’ function (“bubble_fn_useragent”) and place that onto the page

  • Inside the bubble html element that you have created, encapsulate the code I posted above into script tags (you’ll want this script to be run only after the page has loaded, or it will create problems for you…so encapsulate everthing inside of this --> $(document).ready(function(){ /code here/ })
    ).

  • Now, set the function (i.e. the Javascript To Bubble function that you have created) equal to anything you define after determining that GoNative is in fact present (it could be the number 1, it could be “yes”, it be “gonative”, etc.). At this point, you now have a Bubble element that has stored information on whether your user is accessing the page via GoNative (or Chrome, Mozilla, etc.).

  • Use that Bubble element to trigger any workflow you desire (redirects, etc.). Example: “if bubble_fn_useragent=yes…run this workflow”

That’s it. Now you can run workflows based on the useragent of the browser or webview. User Agent is commonly used to force mobile pages to load mobile instead of desktop, trigger deep linking, etc. Lots of great things to do with it.

2 Likes

Awesome @supernaturally, thank you again! I’ll try this out asap :slight_smile: