Help with auth flow

#1

Hello dear Expo friends

I have a weird but, that I cant figure it out. I have a home screen with a button, that generate a token and goes to another view.

When I start the app, I check for the token right away, and if I don’t have one, I will redirect you to the home.

I created a new apk and install it to my phone and when I start the app, it will go on an infinite loop checking, and it will not do anything.

This is my app.js

const BoardStack = createStackNavigator({ Board: ViewBulletinBoard, Link: LinkViewScreen});
const AuthStack = createStackNavigator({ GoogleAuth: GoogleLoginScreen });

const Nav = createSwitchNavigator(
    {
        AuthLoading: AuthLoadingScreen,
        App: BoardStack,
        Auth: AuthStack,
    },
    {
        initialRouteName: 'AuthLoading',
    }
);

export default class App extends Component {


    componentDidMount() {
        Expo.ScreenOrientation.allow(Expo.ScreenOrientation.Orientation.ALL);
    }

    render() {
        return (
            <Nav/>
        );
    }
}

and this is my Loading

export default class AuthLoadingScreen extends React.Component {

    componentDidMount() {
        this.fetchToken()
    }

    // Fetch the token from storage then navigate to our appropriate place
    fetchToken() {
        Expo.SecureStore.getItemAsync('token').then(
            (value) => {
                if (value === null) {
                    this.props.navigation.navigate('GoogleAuth');
                } else {
                    this.props.navigation.navigate('Board')
                }
            })
    };


// Render any loading content that you like here
    render() {
        return (
            <View style={loadingStyle.loadingContainer}>
                <ActivityIndicator size="large" color="#0000ff" />
                <StatusBar barStyle="default"/>
            </View>
        );
    }
}```


and this is the result


![3983519866186075203|281x500](upload://uanR1Bef4rt8GNohrK8bgy30T62.png)
#2

Does it only go into the “infinite loop” (e.g., stay at the “AuthLoading” screen) when you build and run the APK, or even when you run it in the Expo Client?

If you were able to reduce this to an Expo Snack (and I think you could), it’d be easy for any of us to try and see if we can offer any insight.

Off the top of my head, I wonder if something is up with your navigation. I’m not sure you can directly navigate to the inner routes of the other stacks from your loading screen. You may need to navigate to “App” or “Auth”. Try stripping out the token check and make sure your navigation works, then add the token check back. In theory, your approach of using the switch nav at the top level and dividing the app into pre-and-post-auth stacks is a good one, and one I use in my apps.

#3

I fix it thanks, it was a very weird bug, I had to do this

const token = SecureStore.getItemAsync('token');

        if (((typeof token) === "object") || (token == null)) {
            this.props.navigation.navigate('GoogleAuth');
        }
        else {
            this.props.navigation.navigate('Board');
        }
1 Like
closed #4

This topic was automatically closed 28 days after the last reply. New replies are no longer allowed.