Google 登录在 React Native 中无法在 Android 上运行

Question

简介：

我在 React Native 项目中遇到了 Google 登录问题。最近，Google 登录功能已停止在 Android 设备上运行。以前，它运行正常，但现在当用户尝试使用 Google 登录时，会出现一个弹出窗口，要求选择 Google 帐户，但选择帐户后没有任何反应。值得注意的是，Google 登录在 iOS 设备上继续按预期工作。

下面，我提供了 GoogleLogin.js 文件中的相关代码片段以及项目详细信息。任何解决此问题的帮助将不胜感激。

包含重现问题的代码的存储库 我在 React Native 项目中遇到了 Android 上的 Google 登录问题。下面是我的 GoogleLogin.js 文件中的代码片段。

// GoogleLogin.js
import { StyleSheet, Text, View, Image, TouchableOpacity, ActivityIndicator, Platform } from "react-native";
import React from "react";
import { COLORS } from "../../theme";
import {
  GoogleSignin,
  statusCodes,
} from '@react-native-google-signin/google-signin';
import { setAccessToken } from "../../store/slices/generalSlice";
import { useDispatch } from "react-redux";
import { useNavigation } from "@react-navigation/native";
import axios from "axios";
import { API_URL } from "../../config/constants";
import { useLoginUserMutation, useSignUpUserMutation } from "../../store/api/api";
import { useToast } from "react-native-toast-notifications";

export default function GoogleLogin() {
  const toast = useToast();

  const [gSignIn, setGSignIn] = React.useState()
  const dispatch = useDispatch()
  const navigation = useNavigation()

  const [signUpUser, { isLoading }] = useSignUpUserMutation()
  const [loginUser, { isLoading: loginLoading }] = useLoginUserMutation();

   const handleLogin = async (body) => {
    try {
      const res = await loginUser(body)
      if (res?.error) {
        toast.show("Identifiants de connexion invalides", {
          type: "warning",
          placement: "bottom",
          duration: 4000,
          offset: 30,
          animationType: "slide-in",
        });
      }
      if (res.data?.access_token) {
        dispatch(setAccessToken(res.data?.access_token))
        navigation.popToTop()
      }
    } catch (e) {
      // Handle error
    }
  };

  const handleSignUp = async (body, loginSeq) => {
    try {
      const res = await signUpUser(body)
      if (res?.error) {
        // Handle error
      }
      // Handle success cases
    } catch (e) {
      // Handle error
    }
  }

  const checkSocialUser = async (props) => {
    const response = await axios.get(`${API_URL}verifySocialUserId`, { params: props })
    return response.data
  }

  const SignIn = async () => {
    try {
      GoogleSignin.configure({
        webClientId: "xxx.apps.googleusercontent.com",
        androidClientId: "xxx-xxx.apps.googleusercontent.com",
        iosClientId: "xxx-xxx.apps.googleusercontent.com"
      })
      await GoogleSignin.hasPlayServices();
      const userInfo = await GoogleSignin.signIn();
      setGSignIn(userInfo);
      if (userInfo.user) {
        const isGoogleUser = await checkSocialUser({ google_user_id: userInfo.user.id })
        if (isGoogleUser && !isGoogleUser.status) {
          handleSignUp({ email: userInfo.user.email, first_name: userInfo.user.givenName, last_name: userInfo.user.familyName, password: userInfo.user.familyName+userInfo.user.id, google_user_id: userInfo.user.id, register_medium: 'google' }, ()=>handleLogin({ email: userInfo.user.email, password: userInfo.user.familyName+userInfo.user.id }))
        } else if (isGoogleUser.status) {
          handleLogin({ email: userInfo.user.email, password: userInfo.user.familyName+userInfo.user.id })
        } else {
          alert("Some error occurred");
        }
      }
    } catch (error) {
      // Handle error
    }
  };

  return (
    <View>
      {(isLoading || loginLoading) ? <ActivityIndicator size={"large"} color={COLORS.primary}/> : <TouchableOpacity style={styles.socialLogin} onPress={() => { SignIn() }}>
        <Image
          source={require("../../assets/icons/google-logo.png")}
          style={styles.socialicon}
        />
        <Text style={styles.socialTxt}>Connecter avec Google</Text>
      </TouchableOpacity>}
    </View>
  );
}

const styles = StyleSheet.create({
  ...
  },
});

预期行为 我希望 Google 登录能够在 Android 和 iOS 设备上顺利运行。

实际行为 Google 登录不适用于 Android 设备。当用户点击“使用 Google 登录”时，会出现一个弹出窗口以选择 Google 帐户，但选择帐户后没有任何反应。

环境 反应本机版本：0.72.6 @react-native-google-signin/google-signin 版本：11.0.1 博览会版本：~49.0.6 如果您需要任何进一步的信息，请告诉我。谢谢！

Answer 1

我认为您在 catch 博客中收到错误日志。

您必须尝试登录您的 catch 块。

catch(error){
 console.log('error==' + error)
}