I am new to firebase and I am trying to handle firebase user authentication in React.js. I did manage to create users with email and passwords. But, now I would like to send the user an Email link to reset their password.
My code currently look like this.
// This line of code belongs to the top
import { auth } from '../firebaseConfig'
//This part goes under the React component
<p onClick={async () => {
try{
await sendPasswordResetEmail(auth, // My Email Id)
alert('Password reset link has been sent to your email')
}
catch(err){
alert(err)
}
}}
>Forgot your Password ?</p>
However, I do not get any error messages and I do get the alert message that says "Password reset link has been sent to your email." Unfortunately, I didn’t receive any email. Note that I have given my own email id as the parameter for testing purposes.
2
Answers
firebaser here
Did you check your spam folder? We recently see a lot of the emails from Firebase Authentication ending up in the user’s spam folder or being marked as spam in a system along the way. This is being tracked in this status message on the Firebase dashboard and in public issue #253291461.
To reduce the chances of the messages getting marked as spam, consider taking more control of the email delivery yourself.
While these steps are more involved, they typically will drastically reduce the cases where the messages from Firebase Authentication are marked as spam.
Full Guide Based on Frank’s Answer
Firstly create a new email account you can use to relay the Firebase emails through the SMTP server with. I personally chose Gmail, but I tested with Outlook and it also works.
You can now find an SMTP server host that will work for your scenario. If you’re sending less than 1000 emails per month you can find free and reliable hosts. I chose
SMTP2GO
‘s free option.Now you’ve found the SMTP host, add the email address you’ve chosen as a
single sender email
(note that if you do own a domain, you can alternatively use that to send emails).Note that you will have to verify the email, usually by your host sending a link to the email’s inbox. Make sure to check spam.
Once verified, navigate to where you host allows you to add
SMTP Users
and add a new user. This will allocate an SMTPusername
andpassword
.Navigate to the Firebase console, and choose the
Authentication
option from the sidebar (within the Build product category).Go to
Templates
→SMTP Settings
and enter the details of your SMTP server. The username and password fields are to be filled with the SMTP user login you created in the step above.It is better to use
TLS
, but I believeSSL
should work too but it is untested.Click save, and you’re all set up – but there may still be steps to perform depending on your email provider.
Provider Specific Steps
If the emails are being sent to an account managed by Google you will have no issues with your emails being quarantined by anti-spam policies and it will work immediately.
If you are using Outlook, you will have a different problem on your hands. Outlook’s built in defender will most likely have auto-quarantined your email under multiple policies – that bit is important.
These policies are likely to be both spam and phish policies. If you unblock one of them, the other will catch it and re-quarantine.
Unblock both policies for the email address, and test. You can see the status of quarantined messages in Microsoft 365 Defender app under
Review
→Quarantine
. Please note that you will need to be an administrator to add global allow policies to your email accounts.If this still doesn’t work it is likely that your company has an additional external filter (as mine did), and you will have to add the IP’s manually to the
Tenant Allow/Block Lists
spoofed senders tab.