I have been searching everywhere to try and find anyone who has had similar issues to this but come up with nothing…
I’m assuming there are a very significant number of Bubblers who advertise their apps through Facebook and don’t even realise this is a massive issue.
Basically, dynamic data and other elements do not render correctly on the in-app browser for Facebook. Essentially, for anyone who clicks on our ad in Facebook on an iphone can’t see our app correctly.
I have only just realised this issue and assume we have lost tens of thousands if not hundreds of thousands in revenue due to this problem since we’ve launched.
Every page in our app displays correctly in any browser except for Facebooks in-app browser. I have tried changing fonts to web-safe fonts but this doesn’t solve the issue.
Has anyone experienced similar? I presume this bug has been reported before but does Bubble actually have a working solution to this or are we just doomed if our sales channel is Facebook ads?
We had apps working fine on Facebook’s in-app browser previously, but now having just checked it seems none are, at least in Apple IOS 14 (even Bubble’s own website is not displaying dynamic data).
I remember there were some issues a while ago with Instagram’s in-app browser not loading Bubble apps correctly, but Facebook always seemed to work fine. Alas, not anymore.
It seems to be loading certain data from the database, and not other things - certain fields are displaying (specifically images) whilst others are not.
Very frustrating for anyone who relies on FB advertising or organic FB traffic for their app (as we do).
Hopefully this issue can be resolved soon (but seeing as this post is already 22 days old, I’m not so sure!).
It seems to be specifically an issue with dynamic data being displayed as a text, button, or a link.
Dynamic images work fine, and I can display text data in, for example, an input’s initial content, but it won’t display in text elements, buttons, or in links.
So it’s not an issue i accessing the data, but rather displaying it in certain types of elements.
I had no choice but to come up with the workaround.
Currently, my primary goal is to get them off the FB browser. So to achieve that, I have my user go through survey questions and sign up (using all static and Arial or Inter fonts). After they signup, they will receive a SMS notification with the verification code and then the link to my website. When they click on the link from SMS, they will open up the site with the default browser on their phone. They put in their verification code, and now they are in the perfectly working browser.
This is the best workaround I could come up with. If anybody else has a recommendation, please let me know!
That’s a good workaround. It won’t work for my use case, unfortunately.
Bubble has confirmed this is a bug so I hope their engineers will resolve it quickly.
In the meantime, I am detecting the user agent of the Facebook InApp browser and if the OS is ios 14.8 or 15. When that is true, I display a floating group overlay over the whole site with the message:
For faster speed without any API calls, it’s best to use the client’s userAgent though since we’re looking for one specific thing for the time being.
Here’s what my phone shows for the FB inApp browser user agent when on iOS 14.8: Mozilla/5.0 (iPhone; CPU iPhone OS 14_8 like Mac OS X) WebKit/8611 (KHTML, like Gecko) Mobile/18H17 [FBAN/FBIOS;FBDV/iPhone12,3;FBMD/iPhone;FBSN/iOS;FBSV/14.8;FBSS/3;FBID/phone;FBLC/en_US;FBOP/5]
(To get the user agent, post this link to you facebook page and then open it up in Facebook and it will use the in-app browser and you can get the user agent for your device: Parse a user agent - WhatIsMyBrowser.com )
