select_account prompt for Google Auth Provider in Firebase JS v9 - javascript

In Firebase JavaScript v8, if you want to ask Google to show the account selection page every time you login, you can do:
var provider = new firebase.auth.GoogleAuthProvider();
provider.setCustomParameters({
prompt: 'select_account'
});
But with the more modular design of v9, the above syntax is not possible. How do you achieve the same result (ie., ask Google Signin to show an account selection page every time the user logs in) in this newer version of Firebase?

So, after some time I stumbled onto the same documentation that I had read before. Not sure whether they've added it recently or if my eyes were malfunctioning before, what I wrote as "not possible" in the original question is actually possible. From the documentation:
provider.setCustomParameters({
'login_hint': 'user#example.com'
});

How about writing the below code:
import { GoogleAuthProvider } from "firebase/auth";
const provider = new GoogleAuthProvider({
prompt: "select_account"
});

Related

Login Persistance in Firebase (V9)

I have been reading the user documentation for browser login Persistence at Google Documentation. However its not clear enough, on what I should be doing for v9. Briefly here's what I understood. There are three types of persistence's: Per Session, Per Browser, and None. So now what I wanted to do was set Persistence for "per Browser". I saw two functions being used, one is inMemoryPersistence which I assumed to be per Browser and the other to be browserSessionPersistence which i assumed to be "per Session". However even after trying with both of them, after closing the tab and reopening its sends me to the login page.
const auth = getAuth();
setPersistence(auth, browserSessionPersistence)
.then(() => {
// Existing and future Auth states are now persisted in the current
// session only. Closing the window would clear any existing state even
// if a user forgets to sign out.
// ...
// New sign-in will be persisted with session persistence.
return signInWithEmailAndPassword(auth, email, password);
})
.catch((error) => {
// Handle Errors here.
const errorCode = error.code;
const errorMessage = error.message;
});
My code is just the same as what's provided in the docs, with browserSessionPersistance being one of two parameters I tried.
So my question is:
Is my understanding of the 3 Types Correct?
If it is, then why isn't browser persistence working?
(Also I'm using Vanilla Javascript with Modular Import)
If you want to persist auth state and required explicit logout, use browserLocalPersistence.
Version V8 firebase.auth.Auth
Version V9
Description
Persistence.LOCAL
browserLocalPersistence
Explit logout required
Persistence.SESSION
browserSessionPersistence
current session or tab, cleared when closed
Persistence.NONE
inMemoryPersistence
in memory, not persisted, cleared when page is refreshed
Also checkout Persistence interface in the documentation.

Why Firebase (onAuthStateChanged) does not see a Google signup user (with signInWithCredential)?

So I followed this tutorial on how to sign in a user with rnfirebase and google signup. And it works fine. Here is the code:
const googleSignUp = async () => {
// Get the users ID token
const { idToken } = await GoogleSignin.signIn();
// Create a Google credential with the token
const googleCredential = auth.GoogleAuthProvider.credential(idToken);
// Sign-in the user with the credential
const user = auth().signInWithCredential(googleCredential);
return { idToken, user };
};
(Let me note here, that the app has already a sign in with email and password way, with Firebase).
Then I realized that the user cannot change his name, email or delete his account.
Looking deeper, I found out that the onAuthStateChanged(firebase.auth, async (user) => ... returns null for the user.
I've seen in some older answers that if you use Google sign up, you need to sign up the user with signInWithCredential, which I use, so this in not the issue.
Could it be a problem that for email/password sign in, I use code from Firebase web and not from rnfirebase? Although I already had a combination of those, using the push notifications from rnfirebase.
Can someone explain why I get this behavior, and how to fix it?
Thanks!
If I understand correctly, you use both the react-native-firebase library (which wraps the native iOS and Android SDKs) and the JavaScript Web SDK for Firebase in your app.
If that is the case, both indeed have a separate sign-in state, and signing into one won't fire onAuthStateChanged listeners on the other.
You'll have to pick one SDK to authenticate with Firebase, and then use that for both providers.

Javascript & Firebase: How to switch Google account

I'm using firebase.auth().signOut() to log a user out of his Google account. However, when I the user logs in again using firebase.auth().signInWithPopup(provider) (const provider = new firebase.auth.GoogleAuthProvider()), he immediately gets logged in to the Google account he was last logged in with. No password request, no UI, nothing. Just a short loading animation and the user is logged in again.
What do I have to do so the user can switch to a different Google account? At the moment it's simply not possible.
A little late response but hope it helps.
You can add a custom parameter to the auth provider to force picking an account each time.
const provider = new firebase.auth.GoogleAuthProvider();
provider.setCustomParameters({
prompt: 'select_account'
});
firebase.auth().signInWithPopup(provider)

Creating Firebase Auth observer using openUI5

I apologize if this is a newbie question, but I never worked with an observer, and I am finding hard to understand how to create it.
I have developed a webapp in Firebase which uses openUI5. So the app has the structure of that framework:
webapp folder
index.html
component.js
manifest.json
view folder
App.view.xml
controller folder
App.controller.js
That is the file structure, so you can have a quick snapshot.
I am already able to use federated authentication of Google with Firebase. I can log in and out.
But I wanted to use the firebase Auth observer in order to update a JSON Model of the app (with user DisplayName and stuff like that)
In essence, I understand that I should define the observer in the component.js file, but since I do not know how to make that work, instead I created the following in the index.html:
<script type="text/javascript">
firebase.auth().onAuthStateChanged(function(user) {
var oModel = this.getModel();
if (user) {
// User is signed in.
MessageToast.show(oModel.user.displayName);
oModel.user.displayName = user.displayName;
} else {
// No user is signed in.
}
});
</script>
But that definition is throwing me the following error: Uncaught ReferenceError: firebase is not defined
Can anyone let me know what I am doing wrong here?
Regards,
Martin
I found the issue: while defining the script, I do not need the type="text/javascript"
I took that away and could get going.

Firebase create user "manually"

I'm using the standard Email + Password auth-provider.
Through certain circumstances I have to create a firebase user manually. The flow would be something like calling a REST api with an defined email + generated password, and if succeeded sending a welcome email to the user with his password. Something like forward user registration.
I read through their docs and couldn't find much. (the new docs don't even offer a REST API section for user management.. well and just to be clear, the new "google" styled docs, pretty much suck anyway :) ).
Is there someone who has already done something similar and can help me out?
BTW: It would also be possible to create them client side through createUserWithEmailAndPassword(), but this function does automatically reauthenticate the new user, which must not happen in my scenario. Is it possible to use createUserWithEmailAndPassword() without automatically logging in the user?
You can create a new Firebase App context in your client and then call createUserWithEmailAndPassword() there:
var authApp = firebase.initializeApp({
// ...
}, 'authApp');
var detachedAuth = authApp.auth();
detachedAuth.createUserWithEmailAndPassword('foo#example.com', 'asuperrandompassword');
By adding a second argument to initializeApp you create a separate context that will not trigger re-authentication upon user creation.

Categories

Resources