Google Sign in Issue - AuthSession returns dismiss result even before the browser is opened on standalone app

Expo SDK
5

It solved using below code -

import React, { useState, useEffect } from “react”;

import { StyleSheet, Button, View, Text, Image } from “react-native”;
import { CustomButton } from “./CustomButton”;

import { useNavigation } from “@react-navigation/native”;
import { CommonCSS, StylesCSS } from “…/_constants”;
import { useDispatch } from “react-redux”;
import { isLogin, saveUserData } from “…/redux/actions/app-action”;

import * as WebBrowser from “expo-web-browser”;
import * as AuthSession from “expo-auth-session”;

import * as Google from “expo-auth-session/providers/google”;

WebBrowser.maybeCompleteAuthSession();

export const SocialSignInButtons = () => {
const [userInfo, setUserInfo] = useState();
const [errorMSG, setErrorMSG] = useState(“”);

const navigation = useNavigation();
const dispatch = useDispatch();

const activeAccount = () => {
setErrorMSG(“”);

};

const [request, response, promptAsync] = Google.useAuthRequest({
androidClientId:
“Your ANDROID_CLIENT_ID”,
iosClientId:
“Your IOS_CLIENT_ID”,
expoClientId:
" Your WEB_APPLICATION_ID",
});

useEffect(() => {
if (response?.type === “success”) {
setErrorMSG(“”);
getUserData(response.authentication.accessToken);
}
}, [response]);

const getUserData = async (token) => {
let userInfoResponse = await fetch(
"https://www.googleapis.com/userinfo/v2/me",
{
headers: { Authorization: Bearer ${token} },
}
);

userInfoResponse.json().then((data) => {
//setUserInfo(data);
});
};

return (
<>

<Image
style={[styles.socialIcon]}
source={require(“…/assets/google-icon1.png”)}
/>


<CustomButton
text="Sign In with Google"
onPress={() => promptAsync()}
type="SOCIAL"
/>


  </View>
  {errorMSG != "" && (
    <>
      <View style={[CommonCSS.errorMSG]}>
        <Text style={[CommonCSS.isInValid]}>{errorMSG}</Text>
      </View>
    </>
  )}
</>

);
};

const styles = StyleSheet.create({
signInBtnBlock: { borderWidth: 1, borderColor: “#dadce0”, borderRadius: 50 },
socialIcon: { width: 25, height: 25, position: “absolute”, left: 12, top: 6 },
});

//export default SocialSignInButtons;

1 Like