How can I use firebase's language code (myFirebase.auth().languageCode) in my action link URL in Firebase Authentication email template?

Question

So, my website, which is built using ReactJS, provides multi-language support and my routes are formatted in this manner:

http://localhost:3000/<alpha-2-country-code>/<action>

I am trying to use Firebase Authentication to verify the email address that is provided by the user during sign up. This is the verify email link that I got from Firebase Authentication:

http://localhost:3000/new-account?mode=verifyEmail&oobCode=XXX&apiKey=XXX&lang=fr

My current React Project setup is that I am going to redirect users to an Error Page 404 when the alpha-2-country-code is not specified before the action.

My question is, is there a way to extract the fr from the myFirebase.auth().languageCode so that I can append it to my action link URL in Firebase Authentication email template? I couldn't find anything related to this in the official documentation.

The action link URL that i expect Firebase to produce is

http://localhost:3000/fr/new-account?mode=verifyEmail&oobCode=XXX&apiKey=XXX&lang=fr

Thanks in advance!

(Edited on 31st of Jan 2020)

Frankly, I already have the email action handler set up because I am using myFirebase.auth().applyActionCode(actionCode) to verify the user's email.

So, my current implementation requires me to set the action link URL to http://localhost:3000/en/new-account?mode=<action>&oobCode=<code>&lang=fr by default and it is going to get redirected to http://localhost:3000/fr/new-account?mode=<action>&oobCode=<code>&lang=fr because the lang is equal to fr and not the default en.

I am just wondering if there is a better way of doing this because this link https://.../en/auth/...&lang=fr seems a bit counterintuitive as it is showing 2 conflicting languages.

It would be great if Firebase can expose more "firebase-defined" variables in the "customize action link URL" other than appending action, oobcode, and lang behind automatically because not all developers like the idea of having everything crammed in the query string.

I don't see why this leeway would jeopardize security.

bojeil bojeil · Accepted Answer · 2020-01-31T07:19:58

Firebase Auth should already append the language code to your verification email link. This is documented here.

firebase.auth().languageCode = 'fr';
firebase.auth().currentUser.sendEmailVerification()
  .then(() => {
    // Email verification should be sent and the link will have &lang=fr
    // appended.
  })
  .catch((error) => {
    // Error occurred.
  });

How can I use firebase's language code (myFirebase.auth().languageCode) in my action link URL in Firebase Authentication email template?

2 Answers