在独立的 Android 应用程序上使用 expo-auth-session 进行 Google 登录，浏览器关闭但没有任何反应

Posted 2023-02-23

技术标签:

【中文标题】在独立的 Android 应用程序上使用 expo-auth-session 进行 Google 登录，浏览器关闭但没有任何反应【英文标题】：Google Signin with expo-auth-session on standalone Android app, browser closes but nothing happens 【发布时间】：2021-01-30 14:08:08 【问题描述】：

我正在尝试使用 expo-auth-session 并遵循 guide here 来实施 Google 登录。在我的 GenyMotion 模拟器中的 Expo Client 中一切正常。我为 android 独立应用程序进行了配置，并构建了一个 apk 以在实际设备上进行测试。在我的手机上，按下登录按钮后，会启动一个浏览器，让我选择我想使用的 Google 帐户。但在那之后，浏览器关闭，返回到应用程序，没有其他任何事情发生。修复将受到热烈欢迎。这是我编写的第二个示例代码，用于测试一个全新的项目：

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>
    );

这里是 expo 诊断输出：

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

提前致谢。

【问题讨论】：

我遇到了同样的问题，似乎在博览会响应之后，来自钩子的响应没有改变，也没有触发 useEffect.. 但我不确定是什么在这里发生或者我该如何解决它你终于找到解决办法了吗？ @GabrielRohden 的补丁有效吗？ 【参考方案1】：

我在使用 expo-auth-session 时遇到了同样的问题。参考AuthSession文档，该方案应与app.json中的android.package相同，如here所述：“您的应用程序需要符合与您的android.package匹配的URI方案（例如com.myname。 mycoolapp:/)”。现在更改后一切正常。

【讨论】：

我不认为这是同一个问题，因为当方案错误时你不会得到任何重定向，你也会从谷歌得到一个“uri不匹配”错误。【参考方案2】：

所以，看起来这是 expo-auth-session 包的错误，我不知道为什么，但这里的 this condition 可能会导致此问题：