Solution for "Developer Error" In React Native Google Authentication

-

 




"Developer Error" In React Native Google Authentication


So in this post, I am gonna show you how you will figure out the developer error in react native google authentication like this is a common error while you start learning about google authentication so make sure anything you are doing of installing any type of dependencies must follow the whole documentation properly because this is the major issue while start learning new technology or something other you are doing is your project so let's start about this topic.


Dependencies

For RN >= 0.60 please use version installed from @react-native-google-signin/google-signin

yarn add @react-native-google-signin/google-signin

For RN <= 0.59 use version 2 installed from react-native-google-signin

yarn add react-native-google-signin

Make sure you properly installed this dependency in your project follow this documentation link below


So this error is shown to you because you haven't configured the SHA-1 keys in your firebase or it may be deleted from you from the google cloud console so no need to worry about that you just delete your SHA-1 keys and again copy the right SHA-1 keys for debugging as well as for the release also 
So in react native firebase authentication you must have the included three types of SHA-1 keys to your project

1. for debugging app debug SHA-1 signing key 
2. for release app release SHA-1 signing key
3. while uploading to play store need play store SHA-1 app signing key

these three types of SHA-1 keys allow the google authentication for your application for debugging, release type of application.

all these types of SHA-1 keys you can find using gradlew or using keytool command also and paste it to your firebase project

or also you can use keytool where you installed java

in Linux => /opt/android-studio/jre

type the command for debug Keystore

keytool -list -v -keystore ~/.android/debug.keystore -alias androiddebugkey -storepass android -keypass android

type the command for release Keystore

$ keytool -genkeypair -v -keystore my-upload-key.keystore -alias my-key-alias -keyalg RSA -keysize 2048 -validity 10000





    









after pasting the SHA-1 keys firebase automatically create web-client id and android client id in google cloud console so make sure the latest client id's of both android as well as web must using in your code
and in firebase.























Copy both SHA-1 keys and paste in the firebase project fingerprints and download the latest google-servies.json file put it in android/app/ directory and again rebuild the application using npx react-native run-android make sure you have both debug.keystore and my-upload-key.keystore in your android/app/
























Conclusion

So after following the above steps you will be able to figure out the developer error in react native google authentication make sure you follow all steps and keep follow each instruction while doing any such type of setups. I hope this article helps you to figure out the developer error.









Comments

Post a Comment

Popular posts from this blog

Factorial of the "N" natural numbers using recursion and iterative method in CPP language

-
Image
In this post, I am gonna show you how to find factorial of N numbers using recursion and as well as iterative approach, Here is the video clip of recursion that will visualize that how the recursion work.    Here's the code below in this code I have used input.txt and outout.txt for input-output purpose. and you can also use the code below and visualize using the recursion visualizer tool using this link https://recursion.now.sh/ Recursive approach It will take one integer value to find out the factorial and in this, we will take the first base condition, where the recursion will stop and we will get our final answer, and second which will create the stack size of the given number. Iterative Approach For the iterating approach, we just have to iterate the one variable "i" until we got the last number "n". and parallelly multiplying it with the "fact" variable which we have declared as "1" before.
Read more

No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs,

-
Image
Just got a solution to an error which I was facing for the last 2 days, It was really a bit mistake which I was doing but now resolved,  I was trying to send a SMS from Twilio API  // const app = express();  const express = require('express');  app.use(cors()); <<<<< // if you just comment on this above line you get the same error mentioned below, I have set upped react server/website on 3000 port and express server on 4000 port. so the website sends a post request running on 3000 port to the server on port 4000 mechanisms called cross-origin request. // Access to fetch at 'http://localhost:4000/api/send-sms' from origin 'http://localhost:3000' has been  blocked by CORS policy: Response to preflight request doesn't pass access control check:  No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CO...
Read more