Reputation: 529
At the moment I am creating a Firebase API on nodejs. I would like to handle all Firebase stuff (like authentication) with firebase-admin on nodejs. But what is the correct way to authenticate a user over nodejs in firebase-admin without the Javascript Firebase SDK on the client side? On the official documentation for admin I didn't find a function called signInWithEmailAndPassword (like as on the client side SDK) for nodejs. There is only a function called: "getUserByEmail", but this function doesn't check if the user has entered the correct password.
This is my form:
<form class="sign-box" action="/login" method="post">
<div class="form-group">
<input id="username" name="username" type="text" class="form-control" placeholder="E-Mail"/>
</div>
<div class="form-group">
<input id="password" name="password" type="password" class="form-control" placeholder="Password"/>
</div>
<button type="submit" class="btn btn-rounded">Sign in</button>
</form>
Once the form is submitted I pass the values to my API in nodejs:
app.post('/login', urlencodedParser, function (req, res) {
// getting the values
response = {
username: req.body.username,
password: req.body.password
};
// authenticate the user here, but how ?
});
My first idea was to use the Firebase SDK on the client side to sign in with signInWithEmailAndPassword and to get the uid. Once I had the UID I wanted to sent the UID to nodejs and call the function createCustomToken and to return the generated token (with some additional claims) back to the client. Once I get the token back I would use the function signWithCustomToken (on the client side) to authenticate the user. Is this way correct or is there a better way ?
Upvotes: 38
Views: 29013
Reputation: 8162
If your Firebase client app communicates with a custom backend server, you might need to identify the currently signed-in user on that server. To do so securely, after a successful sign-in, send the user's ID token to your server using HTTPS. Then, on the server, verify the integrity and authenticity of the ID token and retrieve the uid from it. You can use the uid transmitted in this way to securely identify the currently signed-in user on your server.
The workflow is:
firebase.auth().currentUser.getIdToken(/* forceRefresh */ true).then(function(idToken) {
// Send token to your backend via HTTPS
// ...
}).catch(function(error) {
// Handle error
});
// idToken comes from the client app
getAuth()
.verifyIdToken(idToken)
.then((decodedToken) => {
const uid = decodedToken.uid;
// ...
})
.catch((error) => {
// Handle error
});
Upvotes: 5
Reputation: 582
This is my solution, maybe it can help someone (Node/react). For some reason the client side method signInWithEmailAndPassword
seems to work both on the client AND server. Basically this lets you keep the default security rule ".read": "auth != null"
without having to use signInAnonymously()
hence avoid creating an infinite number of stale users.
server:
const { firebase } = require('../../firebase/frontend');
const { firebase: admin } = require('../../firebase/backend');
const email = process.env.READ_ONLY_EMAIL;
const password = process.env.READ_ONLY_PASSWORD;
export default async (req, res) => {
try {
const { user } = await firebase.auth().signInWithEmailAndPassword(email, password);
const customToken = await admin.auth().createCustomToken(user.uid);
return res.status(200).send(JSON.stringify(customToken));
} catch (error) {
return res.status(404).send(error);
}
};
client:
import fetch from 'isomorphic-unfetch';
import { useState, useEffect } from 'react';
import { firebase } from '../firebase/frontend';
const useUser = (props) => {
const [user, setUser] = useState(null);
const [loading, setLoading] = useState(true);
const [isAnonymous, setIsAnonymous] = useState(true);
const getCustomToken = async () => {
const response = await fetch('/api/auth', { method: 'POST' });
const json = await response.json();
return json;
};
useEffect(() => {
try {
const unsubscribe = firebase.auth().onAuthStateChanged(async (user) => {
// user exists
if (user && user.email !== '[email protected]') {
setUser(user);
setIsAnonymous(false);
// else sign in user "anonymously"
} else {
setIsAnonymous(true);
const token = await getCustomToken();
firebase.auth().signInWithCustomToken(token);
}
setLoading(false);
});
return () => unsubscribe();
} catch (error) {
console.log('Error signing in user', error);
}
}, []);
return {
user,
isAnonymous,
loading
// etc...
};
};
export default useUser;
Upvotes: 1
Reputation: 8518
For Any Server Side React Users I was brought here because I was attempting to authenticate users in firebase without the Javascript Firebase SDK on the client side as well. I am building a server side rendered react app. The client-side firebase.auth() does not work on a server-side node environment.
It turns out that you can run firebase.auth() commands inside of componentDidMount(), because that does not run on the server. This is where you can authenticate and get your user's token, and then send it to a cloud function for any server-side rendering that requires user authentication.
On the server side, you can then verify the token with the admin sdk.
You will also need to require firebase/app and firebase/auth, and initialize firebase in your browser-specific bundle.js, so that it is not included in your server's bundle.js
componentDidMount() {
firebase.auth().onAuthStateChanged(function(user) {
if (user) {
console.log("User signed in!");
} else {
console.log("User NOT signed in!");
}
});
}
Upvotes: 2
Reputation: 2947
Actually for authentication you will need to use the firebase regular api, no the admin.
First this will give you a refreshed firebase token, not a custom token. If you like you can do the same to obtain a custom token, if you need a custom token, I also have an example.
npm install firebase --save
const firebase = require("firebase");
const config = {
apiKey: "",
authDomain: "",
databaseURL: "",
projectId: "",
storageBucket: "",
messagingSenderId: ""
};
firebase.initializeApp(config);
I am posting my login firebase function but you will be able to change it to express easily.
exports.login = functions.https.onRequest((req, rsp)=>{
const email = req.body.email;
const password = req.body.password;
const key = req.body.key;
const _key = '_my_key_';
let token = '';
if(key === _key){
firebase.auth().signInWithEmailAndPassword(email,password).then((user)=>{
//The promise sends me a user object, now I get the token, and refresh it by sending true (obviously another promise)
user.getIdToken(true).then((token)=>{
rsp.writeHead(200, {"Content-Type": "application/json"});
rsp.end(JSON.stringify({token:token}));
}).catch((err)=>{
rsp.writeHead(500, {"Content-Type": "application/json"});
rsp.end(JSON.stringify({error:err}));
});
}).catch((err)=>{
rsp.writeHead(500, {"Content-Type": "application/json"});
rsp.end(JSON.stringify({error:err}));
});
} else {
rsp.writeHead(500, {"Content-Type": "application/json"});
rsp.end(JSON.stringify('error - no key'));
}
});
NOTE: I am using this login function to test my other functions with Postman, so that is why i am sending a key, so I can use this privately.
Now combining the ADMIN and FIREBASE node apy I am able to do a lot of very interesting stuff with HTTP functions on my firebase.
Hope it helps somehow.
Upvotes: 27