I'm using Auth0 to authenticate my users and then ...
# gooddata-platformm
Mitchel Roling
01/09/2024, 8:50 PMI'm using Auth0 to authenticate my users and then embed GoodData. In order to log users into GoodData, I use the relaystate redirect. It works great, except on mobile phones where it doesn't seem to work. The iframe is blank... it's as if the redirect is blocked. Have you ever seen this before? Here is my iframe code (with identifiers blocked out).
Again, this iframe code works fine when my product is viewed on desktop. It doesn't work on mobile.
j
Jan Kos
01/10/2024, 9:58 AMHi Mitchel, to be honest, I’ve never come across this.. Are you able to reproduce it on your mobile device? Which mobile browser is used?
m
Mitchel Roling
01/10/2024, 2:57 PMYeah, very strange, right? It occurs on my iphone in both Safari and Chrome
Mitchel Roling
01/10/2024, 2:58 PMBut it works in Chrome on my macbook just fine. Same exact code
Mitchel Roling
01/10/2024, 2:58 PMAnd if I change the url to just be the embed URL without the redirect, it works fine on mobile.
j
Jan Kos
01/10/2024, 3:04 PMand are third party cookies allowed on mobile browsers?
m
Mitchel Roling
01/10/2024, 3:27 PMYes
Mitchel Roling
01/10/2024, 3:28 PMSo if I do the redirect outside of the iFrame (i.e. redirect the user through Auth0 and then have them land on the page with the iframe), it works fine on mobile. If that makes sense...
j
Jan Kos
01/10/2024, 3:54 PM🤔 can you please copy paste the iframe code here (with placeholders instead of identifiers)
Jan Kos
01/10/2024, 3:57 PMI’m thinking, maybe the auth and redirect succeeds but then mobile browser has issues with iframe width and height and has trouble rendering it
m
Mitchel Roling
01/10/2024, 3:57 PM<iframe src="https://[org_name].us.auth0.com/samlp/[auth0_id]?RelayState=https%3A%2F%2Fanalysis.[org_name].com%2Fdashboards%2Fembedded%2F%23%2Fworkspace%[workspace_id}%3FshowNavigation%3Dtrue%26excludeObjectsWithTags%3D%5Bhide%5D" height="100%" width="100%" frameborder="0"
</iframe>
Mitchel Roling
01/10/2024, 3:59 PMMeanwhile, this works fine on mobile:
<iframe src="https://analysis.mydataist.com/dashboards/embedded/#/workspace/[workspace_id}?showNavigation=true&excludeObjectsWithTags=[hide]" height="100%" width="100%" frameborder="0"
/iframe
In this scenario, I do the redirect outside the iFrame to make sure the user is authenticated. But it leads to a weird user-experience where the user ends up on the page and then has to be redirected, so the page essentially refreshes awkwardly. It does work though, and is the solution I have in place currently.
j
Jan Kos
01/11/2024, 11:18 AMI recommend to check
Allow Cross-Website TrackingRelayStateworkspace%[workspace_id}workspace%2F[workspace_id}m
Mitchel Roling
01/11/2024, 2:54 PMYeah, nobody seems to have noticed this issue. I've scoured Auth0's discussion boards with no luck. And yes, it is formatted as workspace%2F[workspace_id}. Human error on my part when obfuscating the ID here in Slack.
The issue with Allow Cross-Website Tracking is that I cannot guarantee my clients will know to do this, and it is clearly not the default setting in mobile browsers. That's why I've moved the redirect out the iFrame for now -- even if it means the user's page has to awkwardly refresh.
Mitchel Roling
01/12/2024, 9:09 PMJust following up on this. I disabled 3rd party cookies on my desktop (since that seems to be how things will work moving forward... at least in Chrome), and the iframe stopped working on my desktop as well. I've moved the redirect out of the iframe moving forward.