Actions "on page load" after phone sign in runs twice

[guillemgotes]

Has your issue been reported?

• [X] I have searched the existing issues and confirm it has not been reported.
• [X] I give permission for members of the FlutterFlow team to access and test my project for the sole purpose of investigating this issue.

Current Behavior

The actions "on page load" on the first page after a Firebase authentication via phone are executed twice.

In other words, after a user is authenticated using the phone method, automatically he is redirected to a page. Until here it's fine. But then the actions configured "on page load" on the page he landed are executed twice instead of once.

Expected Behavior

Normally the actions on page load are executed just once.

Steps to Reproduce

1. Create a page and implement the user authentication method (Auth phone sign in).
2. Create another page to verify the phone code.
3. Create a third page.
4. Create an action on the third page. For exemple an external API call.
5. Verify that the API call is exectued twice.

Reproducible from Blank

• [X] The steps to reproduce above start from a blank project.

Bug Report Code (Required)

ITFfl8n635F1ofVG1oSJL8ZsvCUXJW0cTIMziNZ+exUbfaL1Bu0XPeD8VxJocMeraVNcAWeJoEAe+v/Gk+GXVvAVBwmrY7U5/852SQzke2iVSpSVCaqRPUZSDdJUfEjC4Z+nuwhBAMteWHgE2mb7BO+9VgPDFOu/Zwh9f6PHaOI=

Context

It bothers me because after the Firebase sign in I use the JWT token to authenticate the user in another database (Xano). When a new user is creating an account, it creates two records everytime in my external database producing future issuer.

Temporally I solved it creating an extra page between the "code verification" and the "landing page after sign in". So this page just have an action that redirects to the original landing page. It works as follows: Phone sign in > Phone code verification > Page that redirects to another page (here is where the error normally is happening) > Homepage where I really want to land after sign in.

Visual documentation

.

Additional Info

No response

Environment

- FlutterFlow version: 
- Platform:Desktop
- Browser name and version: Chrome
- Operating system and version affected: Windows

[organicnz]

Hi, @guillemgotes. Thanks for adding this issue 🙂

I'm just wondering if you get the same behaviour with another type of Firebase authentication :) Could you pls add your completed API URL that your call by any chance? :)

[github-actions[bot]]

This issue is stale because it has been open for 7 days with no activity. If there are no further updates, a team member will close the issue.

[guillemgotes]

Hi @organicnz,

I have no idea if it happens with other authentication methods... I just use phone sign-in.

What do you mean to add the completed API call? The API url?

In the FF forum I saw someone commented that it happens with any action, even a "show snackbar" was fired twice (https://community.flutterflow.io/c/bugs/action-after-login-is-fired-twice)

[github-actions[bot]]

This issue is stale because it has been open for 7 days with no activity. If there are no further updates, a team member will close the issue.

[agreaves]

Hi @guillemgotes, thanks for the bug report! I've been trying to reproduce this issue for some time and have not managed to on any of my projects. Could you try to reproduce the issue from a blank project? It's definitely quite possible there's a bug, but it could also be due to some configuration on the On Page load action.

I haven't, for example, been able to reproduce even the "show snackbar" example. Thanks!

[livingmydesign]

Same issues here. OnLoad Actions get fired twice at the same time on the "Logged In Page". I use anonymous firebase authentication.

[nicmohr25]

Hello @agreaves @organicnz,

i can confirm this issue on e-mail authentication and apple authentication as well.

After a user logs in, logs out, or registers - basically every time a user is routed with the authentication actions, the page is loaded twice, or at least the on page load action is triggered twice.

Here is my Project with a bug report code: ITFTlcmB34hNodcF+KrqdcJslWQsCUMdXOczitVEew4bCIj4OrMuPPTBP1VtZ+KzaHxEE1KZqzsC/vzQheLXO/U6NSeqQaZaycxUWxPPbDmVMozTEs2eS3dDL99bfRW60reFmxJSCLBeWE5h2Dn3N+eiTT+Cf9qOYwx5e6fDbOY=

Could you please check this?

Thanks :)

[alexsanderp]

I am also having the same problem, after any login with firebase (email and password, gmail) the actions are performed twice.

[alexsanderp]

@organicnz @agreaves Any news about this? I'm having several problems using Firebase Auth.

The Initial Page executes Actions twice, such as API calls, displaying Alert Dialogs, page redirects.

It is very simple to simulate, create a Firebase Authentication and configure an Initial Page that displays an Alert Dialog in Page Load, you will see that it is displayed twice.

[hariprasadms]

Duplicate with #1289

Dev note - Please check this issue while fixing the bug - #1279

[caseyharlin]

Same issue... pageload fires twice after authentication. Fires once upon re-entry. This makes alerts and bottom sheets unusable post-auth which I suspect would be a prevalent use case... let alone efficiency issues.

As far as I can tell here is the janky work around...

1. Create a blank page... e.g. auth_router
2. After the user authentication action, navigate to auth_router
3. Option 1: Use the pageload actions in auth_router to do your processing, throw out alerts or bottom sheets, etc. After completion, navigate to your post-auth home and (if needed) pass any data along as parameters. Note that these actions will only run when the user authenticates and will not run when the user returns already authenticated.
4. Option 2: Define a boolean parameter in your post-auth home page with a default value of FALSE (e.g. isPostAuth). Now, redirect your users from auth_router to your post-auth page with this parameter set to TRUE. In your post-auth home page, check this parameter on page load... if you move all your actions to the FALSE node you'll then you'll ignore the duplicate pageload run. The risk is if/when Flutterflow resolves the issue all pageload actions will get ignored after authentication.

[glamourhammer]

@agreaves @organicnz @guillemgotes

May we please get an update on this issue? The most recent dev comment was back in May - that's 3.5 months ago.

Kindly reference the recent comments here as well as on the sister issue #1279, this is a critical show-stopper for wide range of use cases and it is concerning that there has been no movement or communication on the issue.

I realize the FF team has been busy with the developer conference, but at a minimum we should be able to get an update on this. Has this been forgotten? Is this being addressed? Is there an estimate on when in might be resolved?

Thanks for your understanding.

[agreaves]

I'm going to copy paste what I wrote in #1279 since I believe these to be the same issue

Hi @guillemgotes @livingmydesign @nicmohr25 @alexsanderp @caseyharlin @glamourhammer, I'm very sorry about the delay in addressing this issue, it definitely slipped between the cracks. At first because it's not strictly speaking a bug and we weren't sure what a good solution was for it. Regardless, it's definitely quite confusing and I apologize that we haven't at least explained what's happening in these cases. Our documentation is clearly very lacking on this topic.

Despite the similarities, some of you are facing this issue for slightly different reasons. I'll do my best to explain each case, but if you want the quick answer you can simply play with the settings in the three images I've provided and ignore the technical details:

Case 1

By default, the root page of the application is always loaded, even if you go to a specific page. So for example, if your current page route is /profilePage, the application builds the / root page and the profilePage. This is common, and useful for example, if you want to display a back <- button on the profile page to go back to your home page (e.g. the page with the nav bar) with it already loaded.

However, the downside is that this means any On Page Load actions on the entry page could be triggered even when the page is inactive. That's what is causing the majority of issues for folks here I'm guessing. To fix this, you can go to the routing settings and disable this functionality:

The root page will no longer be loaded in the background in this case.

Case 2

The other case I saw in one of the above examples is where the user signs in, and the app manually handles navigation, navigating from the root / login page to the home page, but allowing back navigation:

Similar to Case 1, that means the root page will still be loaded in the background. However in this case, when the user logs in, the user is authenticated so the root page becomes the "logged in" page. Since it's still living in the background, that means any On Page Load actions present in the logged in page will trigger.

Currently, the only fix for this scenario is to disallow back navigation after authentication (or other auth actions).

General Fix

Despite this, because of this confusion, I've added an option to ignore On Page Load actions when a page is loaded in the background. So on the next release, you'll have this option:

This will fix the issue regardless of whether your are in Case 1 or Case 2 (and hopefully any other cases I've missed).

Anyhow, I hope the explanation was helpful, but I apologize again for being so slow to respond on this one. Thank you very much for your patience!

I'll leave this issue open for a few days since it's a blocking issue for some and it's been open for a long time.

[caseyharlin]

@agreaves thanks for following up. I guess I'm still a little confused... Let's say your 'Logged In Page' is set to the page named 'Home' and this page has a route of '/home'. Now let's say we have two incoming users:

User 1: Returning user, already authenticated. User 1 returns to the app. Deep linking or no, 'Home' loads one time. User 2: New user, not authenticated. User 2 creates an account. And although we're not explicitly navigating to 'Home' in the action flow (we're letting the defaults in FlutterFlow manage this for us), 'Home' loads twice.

For both users, I'm expecting 'Home' to load but only the once. If I apply your General Fix, would this kill 'Home' loading in the background for deep/dynamic links?

[amurgesu-leevit]

@agreaves Thank you for your feedback! However, I still have a use case for which the proposed workaround and upcoming fix will not work. In my situation, I have a page that is neither the homepage nor the "loggedIn page." Instead, it is a page to which a user is redirected as a result of a dynamic link. When the page loads, all actions within its "On Page" load event are executed twice. In this scenario, I do not perform a manual navigation (thus, I cannot disable the "back navigation"), and the setting "Pages are subroutes" is set to false.

This poses a blocking issue for me as well since the redirect is part of an OAuth2 flow. The authorization code is returned, and I need to utilize it to retrieve the access token. However, since the call to fetch the access token is performed twice in succession, the authorization code becomes invalid during the second call (as it can only be used once), causing the authentication flow to stall.

I hope this use case is clear and that a fix can be provided for this scenario as well.

[Sahilbhayani]

In my case i enable Page Are Subroutes of Root Page in AppDetails section, so when app run root page load using this feature and second time using signin auth. When i turn off this App run very well.

[andreyd22]

The thing is that the initialPage is always called when we log in or when the app was unloaded from memory and is reopened. Regardless of which page we navigate to via push notification, FlutterFlow will open the Logged in page:

“This is the page that will load on app start if a user is already logged in. It’s also where we automatically navigate to on a successful sign in.”

How to fix this?

1.  On the Logged in page, mark Skip On Page Load when inactive.  
    •   This will prevent onPageLoad actions from executing when the page is loaded in the background.
2.  In Advanced Route Settings, uncheck Pages Are Subroutes of Root Page.
3.  Use AppState to control page loading:
    1)  Create an AppState variable called changePageOnLoad, with a default value of true and set persisted to false. This variable indicates that by default, we execute the loading.
    2)  On the target page (on Page Load action), update the variable changePageOnLoad = false. For example, this could be the page opened via a push notification.
    3)  On the Logged in page, add a conditional action: if changePageOnLoad = false, then set it to true (so that everything works correctly the next time) and then terminate the execution with Terminate.

[mnls0115]

In my case i enable Page Are Subroutes of Root Page in AppDetails section, so when app run root page load using this feature and second time using signin auth. When i turn off this App run very well.

Thank you so much, @Sahilbhayani! Disabling the 'Pages Are Subroutes of Root Page' setting was the perfect solution, and it solved the issue seamlessly. I genuinely appreciate you sharing this tip—it saved me a lot of time and effort. Truly grateful for your help!