How to Authenticate with Google for Expo React Native Apps using Google-Signin Config Plugin LATEST
HTML-код
- Опубликовано: 6 окт 2024
- Hi everyone!
Today I'm showing you how to add Google authentication to your expo react native apps using the google-signin config plugin. I will be doing this via Google directly, without Firebase. I will likely show a Firebase example in the future so let me know if you're interested. This is the latest method for authenticating with Google, if you're interested in past methods you can view my prior videos on Google auth for Expo react native apps.
My code for this is available on GitHub:
github.com/che...
And you can find full documentation here:
docs.expo.dev/...
You’ve clearly come here to learn and a free audible trial allows you to increase your learning potential in situations where you may be hands free like at the gym or on your commute. It allows you to spend more time on theory when you aren’t able to watch a screen, so that you can maximise your screen time to pick up technical skills. Try it for free today:
amzn.to/49NX6Xe
// ABOUT ME
My name is Chelsea and I started studying software engineering in 2010. I have been working commercially full time since 2014 and have been in various positions from graduate developer to tech lead to solution architect.
I'm a full stack developer with a lot of experience in C# and Javascript but my passion is for mobile development; specifically native iOS development and cross platform using React Native.
I always have many things on the go and am always trying out a new side hustle and failing at it; perhaps you can learn from my mistakes!
Please like and subscribe if you enjoyed this video and want to see more like it!
Have any suggestions on topics you would like to learn more about? Please suggest them in the comments... I would love to help you out while doing a bit of learning myself!
// PRODUCTS USED
I use the following products in the creation of my videos:
Boya MM1 Microphone - amzn.to/3uupmOB
A reasonable quality and reasonably sturdy but cost effective microphone that can be used by both DSLR cameras, mobile phones and laptops
Canon 18-55mm Lens - amzn.to/3QYYdLk
A kit lens but a decent quality lens for beginners getting used to a DSLR
Canon EOS Rebel T7 with 18-55mm Lens - amzn.to/3GdRPuq
This is the kit I started with it includes the lens linked above and is a great starter camera.
I love Apple devices... These are the ones I use for my channel content creation:
Apple iPhone 13 - amzn.to/3G8pHcl
A good all round phone, good for Apple development and recording videos with enough high quality features but at a cheaper price point than the pro versions.
Apple MacBook Pro - amzn.to/3MUuPV8
A nice portable computer for working from anywhere and perfect for iOS development
Apple iPad Air - amzn.to/49LvYrY
Really easy to use for graphic design if required for logos as part of my app development or editing the videos on the go.
DISCLAIMER: Links included in this description might be affiliate links. If you purchase a product or service with the links that I provide I may receive a small commission. There is no additional charge to you! Thank you for supporting my channel so I can continue to provide you with free content each week!
//CONTACT:
Please contact me at: hello@tripwiretech.com
//CRAVING MORE:
You can find links to all my different sites and social media over on Linktree: linktr.ee/miss...
![How To Integrate Google Login in React! [Easy] | Add Auth To Your React Project](http://i.ytimg.com/vi/UUJfTsn6S_Y/mqdefault.jpg)
![How To Integrate Google Login in React! [Easy] | Add Auth To Your React Project](/img/tr.png)
![Chicken P - People's Favorite (Remix) [Feat. 42 Dugg] (Official Video)](http://i.ytimg.com/vi/a6Bn8FEtxmY/mqdefault.jpg)
Seeing a lot of comments requesting firebase! Video now live: How to Authenticate with Firebase and Google for Expo React Native Apps using Google-Signin plugin
ruclips.net/video/HY3O_wrvDsI/видео.html
this is needed cuz this method without firebase doesnt work on android REAL app because google will change your SHA so you have to use firebase :/
Thank you. There is one issue though that applies to both videos, the `@react-native-google-signin/google-signin` library won't work on the Expo web app.
I get the error "RNGoogleSignIn: you are calling a not-implemented method on web platform."
How do you implement Google Sign-in on Expo's web app?
Thank you this worked! Sucks how they keep changing these tools and causing older versions to constantly break down, glad I had this recent tutorial
to make it work in real app (Android only) you need few more steps (took me some time to figure it out), why ? cuz google change your SHA-1 with its own ...
1. go to google play console
2. select your app
3. find Settings -> Login settings
4. copy first SHA you see
5. go to google cloud console
6. find Credentials
7. create Credentials -> OAuth Client ID
8 select "Android" paste your copied SHA-1 key
9. IMPORTANT Click Verify
10. Save
Your tutorials are a life-saver. Thanks a bunch !
Great! Nice video.
It’s sad how Google became so complicated
I was finally able to make it work following these steps. I used the EAS development build mode, made everything easier. Thank you!
How did you manage to run on android?
@@auto360LTyou only need sha1 key you don’t have to put the androidIdClient anywhere follow steps with sha1
@@auto360LT Do not use Expo Go. You can build your app in development mode and install it on your device. It will work fine.
Hi @MissCoding, thank you so much for this video. I have to say, I am confused. Why did you in your past video use the "expo-auth-session/providers/google" and in this video you are using the "@react-native-google-signin/google-signin" package. The docs are very confusing about these two packages existing.
thx! works now..
Perfect! But I must check in the backend if the id is true... Would there be a tutorial on how to do this?
Hi and thanks for sharing those tutorials. I noticed you published a previous video on how to do it.
I am really novice in all expo domain but I am right saying that it's no longer possible to use expo go (on my personal phone directly) to run an app with google authentication ?
This is an excellent guide, thank you :)
Amazing - Thank you so much! Was trying to get this thing working for 4 days !
If you can help out on connecting Firebase, that would be super helpful as well!
Video was concise, to the point and super simple to follow! Thank you so much!!
Added a firebase video, and pinned it as a comment!
@@MissCoding Awesome! Thank you so much! will try it out this weekend! You should definitely put out more videos on react native stuff - its better than lot of stuff out there!
Thank you so much I was stuck with that since 1 week, finally it worked.
Can you show how to fetch youtube data, after logging in with google?
I am trying, but I am getting authentication error😢
Thanks!
it is so useful.
THANK YOU
Hi, you asked if we're interested in the Firebase version... please chalk one up next to my name - I'm eagerly awaiting that one, but thank you for this one =)
Nice video
But will the approach work for both development and production?
thanks!
Hi @MissCoding, Please how would I get access to google calendar?
thanks for the video. Can you make a video: how to implement google play integrity on expo?. I have use react-native-firebase with appCheck but is not working.
Hi! Thanks for the video, but I can't make it work. It crashes on ios when I click in sign in. I already set the reversedClientId in the schemes in app.json and my clientIds in App.js. Any ideas?
I’m having the exact same issue. I’m low key glad is not just me. I’ll reach out if I make it work.
@@yolxanderjacagonzalez5177 Any luck? I am having the same issue
I am having a lot of trouble wit the eas build -p ios --profile development as Some pods require a higher minimum deployment target. anyone else get this?
how did you get this to work? i am facing same issue now
Hi I will try and looking at this in a bit. Off top of my head I noncresed pods i from 13 to 14 or higher
hi, in your app.json, have you set deploment target to 13? I increased this to 14, and t worked@@1coolguy647
@@edoris9021 Did you manage to fix it at the end?
YeahI changed my app.json, i changed the deployment target in my app.json from 13 to 14@@Igor-vi5hq
Hi dear. I'm stuck with the react navigation auth flow when signing up with google , can you please help me?
error 400: invalid request in expo go
it seems to work for me.. however I cannot get it to open on expo go. I am not sure whether it is android that sucks or something else as the build seems to work fine
Because it uses native code, you will have to use a development build
btw for "@react-native-google-signin/google-signin", expo 49 use v10 and expo 50 use v11 cuz u get errors like "Error: Some pods require a higher minimum deployment target."
Hello! thank you for your video! When I try to build ios file using eas, I got error while building it. I assume it's because we add "@react-native-google-signin/google-signin" in plugins in app.json. How did you overcome that?
google sign in authentication not working on realease apk
the token that is returned in the userInfo expires in one hour and it doesn't return a refresh token, how could I keep the user logged without login in every one hour?
Firebase would be super helpful!
Yeah with Firebase auth 🙏🙏 would be amazing. I subscribed!
Firebase video added and pinned 🎉
Is its neccesary to add both SHA1 keys (debug/release) as separate OAuth client id's in the google console? Im wondering if thats why yours was crashing?
Hi, great tutorial. Does it work for web as well?
It didn't work for me
did not works , so I made a new version of the web with other package , leveraging .web.js and .native.js feature
My app.json file can't file the @react-native-google-signin/google-signin plugin, is it ok and how to fix this
7:00 tomorow
Awesome video but the androidClientId is not meant to be put there, I cant make it work with Android. It works with IOS. any updates on that?
Just follow the steps on the video, get your Android and web clientId, don't forget to generate your credentials (sha1)
@@brenolins9908 the androidClientId is not used. Only the SHA1, I made it work with sha1 only. Thank you!
Is it still possible to run your app on Expo Go after this? I get that the google sign-in will only work in a build but if i want to keep testing my app with Expo Go what can I do?
You can't, Expo Go doesn't accept native libraries like Google Sign-in, so you can only run it in a build app.
Hi,
I am getting error "DEVELOPER ERROR". I did the same thing that you explain in video. Still no Luck.
Same error, you can fix this?
Me too... I've already watched other videos, but I can't seem to figure it out... Have you found any fixes?
@@necrotikS I managed to solve this problem last night, I did the procedure in the video with title:
ATUALIZADO 2023] Implementando Autenticação social com Google | React Native
(I didn't send the link because RUclips doesn't allow it). And I added Google Cloud to allow the reading of schemes that are disabled (it is below the SHA1 option). Take the video tutorial with the title above and see if it solves it, it worked for me.
double check that your client id's are correct for web and ios. in my case my web client id was wrong and was getting developer error 10
i love you
thanks so much!!you are the best