Google Oauth guide changed completely?

Expo Application Services (EAS)
,
1

Hi, I already posted on Github Discussions, but just saw the announcement telling people to use this forum instead.

I was surprised when I headed over to the docs and the google OAuth guide completely changed overnight. It seems to have shifted entirely to use @react-native-google-signin/google-signin instead of expo-auth-session/providers/google. Took me a while to realize the change, it would be nice to have a ‘last updated’ in the top of the doc’s page for sanity check. Apparently there was a merged pull request 2 days ago that completely changed the docs regarding google auth in expo apps.

I just implemented Google authentication in my React Native app last week, so do I need to change everything right away? Is the old way now deprecated? I feel like the guide got more complicated tbh.

3

Hi @salesp07

I think it’s because of this:

4

We are also having same issue. It works in test environment but not in production. We have used expo-auth-session/providers/google package. Still now getting an error “type:dismiss” in production

Can you please help as soon as ?

We are using bare workflow.

Do we need to eject the project to use this [@react-native-google-signin/google-signin] library? or is there any other way to use google sign in with Expo?

Thanks & Regards,
Hetal

5

try this , it worked on our production . Hope it helps to you too.

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",](https://www.googleapis.com/userinfo/v2/me%22,)
{
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;
6

@pintubetech I have been driving myself and one of the expo team members (@amanhimself ) crazy trying to figure this out for a few weeks and @salesp07 saved me with this:

had the same issue a while ago. What solved it for me was:

Making my package name lowercase, and exactly the same on Firebase / Google Cloud and    
my expo app

Making slug all lowercase

Make scheme the same as slug

Make new eas credentials after changing the slug and update Firebase/Google Cloud with      
the newly generated SHA1 accordingly

Hope it helps!

Long story short google/android is SUPER fussy about the slug,scheme and package name and it doesn’t like ANY of these your going to get {type: dismiss}

Good Luck!

1 Like
7

Hey @salesp07,

Yes, we changed the guide due to some reported issues with third-party providers and yes, they are now deprecated and will be removed in a future SDK. These third-party libraries wraps native SDKs so there is less chance of that changing in future.

The complexity you’re mentioning is there for the configuration part because there are different elements associated that are not in our control. Google or any other third-party providers require some steps to follow.

If it feels too complex, I’d suggest going this path: Use Google authentication - Expo Documentation to generate credentials as it only requires creating a project in Firebase.

it would be nice to have a ‘last updated’ in the top of the doc’s page for sanity check

Thank you for your feedback. It is duly noted and we’ll try to improve docs with a similar mechanism in the future.

2 Likes