I am facing a problem with setting custom claims for Firebase Authentication service's token. I am using Cloud function to set the custom claims for Hasura. The cloud function executes upon new user create event to set the custom claims. Here's my code running in cloud function
const functions = require('firebase-functions');
const admin = require('firebase-admin');
admin.initializeApp();
exports.processSignup = functions.auth.user().onCreate(user => {
// create custom claims for hasura
const hasuraClaims = {
"x-hasura-default-role": "user",
"x-hasura-allowed-roles": ["user"],
"x-hasura-user-id": user.uid
}
// attach claims to user auth object
return admin.auth().setCustomUserClaims(user.uid, hasuraClaims)
.then(_ => {
functions.logger.info('SUCCESS: Custom claims attached');
})
.catch(err => {
console.log('ERROR: ', err);
})
})
In my frontend web page, I am running the following code to get the idToken
// subscribe to user state change
firebase.auth().onAuthStateChanged(async user => {
console.log('Firebase auth state changed');
if (user) {
// User is signed in.
window.User = user;
let idToken = await user.getIdTokenResult();
console.log('idToken: ', idToken);
}
})
I don't know what I'm doing wrong, but the token doesn't contain the custom claims that I've set in my Cloud function processSignup(). I know that the function executed without error because I can check my function logs and find the info entry SUCCESS: Custom claims attached.
Can anyone please help me solve this problem?
Updating claims does not trigger an onAuthStateChanged (the auth state of being logged in or not has not changed, but the users' claims have) and tokens are minted and then used for ~1h.
You are calling getIdTokenResult but not forcing a refresh, try:
let idToken = await user.getIdTokenResult(true);
which will force a new token to be fetched from the server and will (hopefully) include your custom claims.
Related
Details
If you use the function createCustomToken to sign in the user and setting his custom claim, updating the custom claims later using the function setCustomUserClaims will not update the claims even after forcing the idToken to refresh using the function firebase.auth().currentUser.getIdTokenResult(true)
How to reproduce?
Sign in the user on firebase using a custom token generated with the function createCustomToken including the custom claims
firebase.auth().createCustomToken(uid, {myClaim: "test"}).then((customToken) => console.log(customToken))
Sign in the user on the frontend using the custom token
// copy paste the customToken manually for testing
firebase.auth().signInWithCustomToken(customToken)
Update the claim on the backend using setCustomUserClaims
firebase.auth().setCustomUserClaims(uid, {myClaim: "updateTest"})
Refresh the idToken on the frontEnd and log the custom claims
firebase.auth().currentUser
.getIdTokenResult(/*force refresh*/ true)
.then((idTokenResult) => {
console.log(`custom claims`, idTokenResult.claims)
})
You should see that the claim is still { myClaim: "test" } instead of { myClaim: "updateTest" }
Edit: This is actually an intended behavior. The claims set with createCustomToken have a higher priority. The doc mentions it here https://firebase.google.com/docs/auth/admin/custom-claims#set_and_validate_custom_user_claims_via_the_admin_sdk
Setting the custom claims separately at sign in instead of using the function createCustomToken to set them will allow you to edit these claims later.
Working code:
firestore
.doc(`users/${uid}`)
.get()
.then((clientSnapshot) => {
// give user the claims he has
const { permissions = {} } = clientSnapshot.data()
// use setCustomUserClaims to set the claims
return auth.setCustomUserClaims(uid, { permissions })
})
// generate the custom token
// ⚠️ don't use createCustomToken to set permission as you won't be able to update them
.then(() => auth.createCustomToken(uid))
.then((customToken) => {
// send the custom token to the frontend to sign the user in
return res.status(200).json({ customToken })
})
I'm trying to create a web application, where you can log-in and register an account with a google account. I have managed to make it so they can log-in with the signInWithPopup(provider), but not sure how to Implement the sign-up. Any suggestions? or know of any functions in firebase i can use?
There aren't any separate methods to login and sign up when using Google Sign-In or any other provider. If a user with that credential exists then user will be logged in else a new user account will be created. You can then use additionalUserInfo.isNewUser property from the result received from signInWithPopUp method to check if the user is new.
firebase.auth().signInWithPopup(provider).then(function (result) {
const {additionalUserInfo: {isNewUser}} = result;
console.log(isNewUser ? "This user just registered" : "Existing User")
})
For the new Modular SDK (V9.0.0+), the same can be written as:
import { signInWithPopup, getAdditionalUserInfo } from "firebase/auth"
const result = await signInWithPopup(auth, googleProvider);
// Pass the UserCredential
const { isNewUser } = getAdditionalUserInfo(result)
So far, as I understood, you have two options to log in to your website: one is to make a local username/password account on your website, and the other option is to use your google account. I suppose the best way would be to check if the Google account is linked to any existing user using additionalUserInfo.isNewUser, and then linking up your google account with the account that is created via your website locally by following this article: https://firebase.google.com/docs/auth/web/account-linking?hl=lt
Once you have Firebase dependency inside your application. You can use createUserWithEmailAndPassword method to do that.
firebase
.auth()
.createUserWithEmailAndPassword("email#domain.com", "123123")
.then(data => {
data.user.updateProfile({
displayName: this.form.name
}).then(() => {});
})
.catch(err => {
this.error = err.message;
});
i am implementing user authentication with the help of firebase in my React project. So, I am confused over something.
I am verifying the user from firebase and then getting a token on frontend which is sent to backend via headers and verfied there once.
I read the docs and came to know that firebase token gets expired after 1 hr by default so we have to use "getIdToken" like
firebase.auth().onAuthStateChanged(async user => {
if (user) {
console.log(user, 'user123 inside firebaseAuth')
const token = await user.getIdToken()
Cookies.set('my_token', token, { domain: domain })
}
})
but how do i manage this function , do i have to call it everytime the component updates or everytime before hitting api or first time the component renders ?
The thing is i do not want this token to get expire until the user logs out himself / herself even if he is in a different component and sitting ideal for too long.
You can get the Firebase ID Token every time you are making an API call to your server:
async function callAPI() {
const user = firebase.auth().currentUser
if (user) {
const token = await user.getIdToken()
const res = await fetch("url", {
headers: {authorization: `Bearer ${token}`}
})
} else {
console.log("No user is logged in")
}
}
You could get the ID token once when the component mounts but then you'll have to deal with onIdTokenChanged to keep it updated in your state. Using the method above you'll get a valid token always.
I read all the answers I found about this but I still have some problems. Probably something with .ref(), but I can't see what I'm doing wrong. My cloud function is not triggered at all.
DB example:
business/{businessId}/reservations/{reservationId}
I want to trigger this function every time when a new reservation is created [a new document is created in reservation collection] (business/{businessId}/reservations/).
And then I want to sent a notification message, but that is another thing.
const functions = require('firebase-functions');
const admin = require('firebase-admin');
exports.sendAdminNotification = functions.database
.ref("business/{businessId}/reservations")
.onWrite((event: any) => {
// It never comes here...
console.log('Here');
const payload = {
notification: {
title: 'New registration',
body: 'You have new registration!',
},
};
// You can ignore this part
admin
.messaging()
.sendToDevice('SomeToken', payload)
.catch(function (error: any) {
console.log('Notification sent failed:', error);
});
});
The fact that you're using the terms "document" and "collection" suggests that your database is Firestore. But what you've written here is a Realtime Database trigger. Realtime Database is a completely different database. Instead, you will need to write a Firestore trigger instead. They begin with functions.firestore.
I'm working in an Angular6 app with angularfire2. I'm setting the roles as custom claims in user creation, but it doesn't seem to propagate.
When I'm creating the user I send the userid, businessid and role to a cloud function:
bid > businessid
urole > role
req.body.uid > userid
const customClaims = {
roles: { [bid]: urole }
}
admin.auth().setCustomUserClaims(req.body.uid, customClaims)
.then(result => {
res
.status(200)
.send()
})
The problem is when the call to cloud function finishes and I want to redirect the user to a route which requires the user to have the custom claim set, but it fails. After some debugging, I've found out that if run:
this.angularFireAuth.auth.currentUser.getIdTokenResult(true).then(result => {
return result.claims.roles
})
immediately after the call to the cloud function "result.claims.roles" is undefined, but if I refresh the page, "result.claims.roles" have the data I set before.
I've already tried the reload method, and getIdToken(true) but I'm getting the same problem.
Is there a way to avoid refreshing the page and get the custom claims?
Thank you!
When the user is signed in, they get an ID token that is valid for about an hour. If you set a custom claim, their (server-side) profile is updated immediately, but their ID token is not auto-updated. So you'll need to refresh their ID token to get the new custom claims.
As far as I know this ID token is only refreshed by calling getIdTokenResult if it has expired. If that's the cause, calling user.reload() and then getting the ID token should give you the updated claims.
For me it simply worked taking the advice from one of the comments:
// --------
// Frontend
// --------
// Triggering the cloud function
const url: string = 'url-to-your-cloud-function'
await this.http.post<unknown>(url, {}).toPromise();
// After cloud function was run and custom claim was set -> refresh the id token
// The 'currentUser' is a reference to the firebase user
await this.authService.currentUser.getIdToken(true);
// --------
// Cloud Function - createSubscription
// --------
const createSubscription = () => {
await admin.auth().setCustomUserClaims(userId, {
subscriber: true
})
}