Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Google Signin with expo-auth-session on standalone Android app, browser closes but nothing happens

I'm trying to implement Google Signin using expo-auth-session and following the guide here. Everything works fine in Expo Client in my GenyMotion emulator. I made the configuration for Android standalone app and built an apk to test on an actual device. On my phone, after I press the Sign In button, a browser is launched and let me pick the Google account I want to use. But after that, the browser closes, returns to the app and nothing else happen. A fix would be warmly welcomed. Here is the second example code I wrote to test with a fresh new project:

import { StatusBar } from 'expo-status-bar';
import React, { useState, useEffect } from 'react';
import { StyleSheet, Text, View, Button } from 'react-native';
import axios from 'axios';
import * as WebBrowser from 'expo-web-browser';
import * as Google from 'expo-auth-session/providers/google';

WebBrowser.maybeCompleteAuthSession();

export default function App() {

    const [gUser, setGUser] = useState(null);
    const [reqError, setReqError] = useState('');

    const [request, response, promptAsync] = Google.useAuthRequest({
        expoClientId: 'xxxxxxxxxxxx.apps.googleusercontent.com',
        androidClientId: 'xxxxxxxxxxx.apps.googleusercontent.com',
        // iosClientId: 'GOOGLE_GUID.apps.googleusercontent.com',
        // webClientId: 'GOOGLE_GUID.apps.googleusercontent.com',
    });
    
    useEffect(() => {
        if (response?.type === 'success') {
            const { authentication } = response;

            getGoogleUser(authentication.accessToken)
        }
    }, [response]);

    const getGoogleUser = async (accessToken) => {
        try{
            let gUserReq = await axios.get('https://www.googleapis.com/oauth2/v2/userinfo',
                {
                    headers: {
                        Authorization: `Bearer ${accessToken}`
                    }
                }
            );
            
            console.log(gUserReq.data);
            setGUser(gUserReq.data);
        }
        catch(error){
            console.log('GoogleUserReq error: ', error);
            setReqError(error);
        }
    }

    return (
        <View style={styles.container}>
            {
                reqError !== '' &&
                <View>
                    <Text>There was an error</Text>
                    <Text>{JSON.stringify(reqError, 'reqEr', 4)}</Text>
                </View>
            }

            <Text style={{
                fontWeight: 'bold'
            }}>Signed user</Text>

            {
                gUser === null && 
                <Text>No user</Text>
            }

            {
                gUser !== null && 
                <Text>{JSON.stringify(gUser, null, 4)}</Text>
            }

            <Button
                disabled={!request}
                title="Sign in"
                onPress={() => promptAsync()}               
            />

            <StatusBar style="auto" />
        </View>
    );
}

And here comes the expo diagnostics output:

Expo CLI 3.27.13 environment info:
    System:
      OS: Linux 5.4 Ubuntu 20.04.1 LTS (Focal Fossa)
      Shell: 5.0.17 - /bin/bash
    Binaries:
      Node: 10.19.0 - /usr/bin/node
      npm: 6.14.4 - /usr/bin/npm
    npmPackages:
      expo: ^38.0.0 => 38.0.10 
      react: 16.13.1 => 16.13.1 
      react-dom: 16.13.1 => 16.13.1 
      react-native: https://github.com/expo/react-native/archive/sdk-38.0.2.tar.gz => 0.62.2 
      react-native-web: ~0.13.12 => 0.13.18 
    npmGlobalPackages:
      expo-cli: 3.27.13
    Expo Workflow: managed

Thanks in advance.

like image 922
sunviwo Avatar asked Nov 06 '22 04:11

sunviwo


1 Answers

So, looks like this is a bug with the expo-auth-session package, I'm not sure why, but this condition here may cause this issue:

setFullResult(fullResult ?? result);

changing it to:

setFullResult(result);

Seems to fix it for me. You can use patch-package if that fix works for you

I've also opened an issue about this because I believe that this is a bug https://github.com/expo/expo/issues/11714

Edit:

you also need to add the result as a dependency of the effect that contains the setFullResult

like image 87
Gabriel Rohden Avatar answered Nov 15 '22 11:11

Gabriel Rohden