title: How can I create a custom Firebase new user e-mail verification flow into my Angular application?
body: <p>I am working on an Angular application hosted on Firebase and using Firebase Authentication service in order to handle user registration. When a user sign up in the application I send an e-mail for e-mail confirmation, I do this by this code:</p>
  <pre><code>userCreated.sendEmailVerification().then(function() {
      console.log(&quot;User verification e-mail sent to: &quot;, userCreated.email);
  }).catch(function(error) {
      console.log(&quot;ERROR SENDING USER VERIFICATION E-MAIL !!! THE USER E-MAIL HAVE TO BE VERIFIED MANUALLY BY THE ADMIN&quot;);
      alert(&quot;ERROR SENDING USER VERIFICATION E-MAIL !!! THE USER E-MAIL HAVE TO BE VERIFIED MANUALLY BY THE ADMIN&quot;);
  });
  </code></pre>
  <p>Ok the problem is that I have to implement some further extra logic to my user verification (what happens when the user click on the link inside the e-mail).</p>
  <p>I found this article about <strong>custom-email-handler</strong>: <a href="https://firebase.google.com/docs/auth/custom-email-handler" rel="nofollow noreferrer">https://firebase.google.com/docs/auth/custom-email-handler</a></p>
  <p>But I have some doubt about how exactly integrate it into my Angular project. From what I can undestand (but I am absolutly not sure of this so please give me some hints) it works in this way:</p>
  <ul>
  <li><p>I have to create a custom verification e-mail template containing a custom verification link (this time pointing to a specific Angular component related to the specific route into my Angular application)</p>
  </li>
  <li><p>In this component I can handle the <strong>verifyEmail</strong> mode implementing this method adding here my extra custom logic:</p>
  <p>function handleVerifyEmail(auth, actionCode, continueUrl, lang) {
  // Localize the UI to the selected language as determined by the lang
  // parameter.
  // Try to apply the email verification code.
  auth.applyActionCode(actionCode).then(function(resp) {
  // Email address has been verified.</p>
  <pre><code> // TODO: Display a confirmation message to the user.
   // You could also provide the user with a link back to the app.
  
   // TODO: If a continue URL is available, display a button which on
   // click redirects the user back to the app via continueUrl with
   // additional state determined from that URL's parameters.
  </code></pre>
  <p>}).catch(function(error) {
  // Code is invalid or expired. Ask the user to verify their email address
  // again.
  });
  }</p>
  </li>
  </ul>
  <p>I am not sure if I have to do inside a component of my Angular application or in a Firebase cloud function or where else.</p>
  <p>Can you give me some hints?</p>