How to use a post-login event

Help
,
1

I would like to trigger a programmatic event on my React application,
I saw on the doc it is possible to use a post-login event, which is exactly what I am looking for.
My question: is it implemented out-of-the-box by the library auth0 for react?
As of today I’m using the last version 2.0.1
Here is a code sample that could add some context:

import React, { ReactNode } from "react";
import { useNavigate } from "react-router-dom";
import { Auth0Provider, AppState } from "@auth0/auth0-react";
interface Props {
  children: ReactNode;
}
function Auth0ProviderWithHistory({ children }: Props) {
  const domain = process.env.REACT_APP_AUTH0_DOMAIN;
  const clientId = process.env.REACT_APP_AUTH0_CLIENT_ID;
  const audience = process.env.REACT_APP_API_AUDIENCE;
  const navigate = useNavigate();
  const onRedirectCallback = (appState?: AppState) => {
    navigate(
      appState?.returnTo || window.location.pathname + window.location.search
    );
  };
  return (
    <Auth0Provider
      domain={domain}
      clientId={clientId}
      onRedirectCallback={onRedirectCallback}
      authorizationParams={{
        redirect_uri: window.location.origin,
        audience: audience
      }}
     // postLoginTriggerEvent={(event) => {triggerAnalytics(event)}} Is what I am looking for
    >
      {children}
    </Auth0Provider>
  );
}
export default Auth0ProviderWithHistory;

The function onRedirectCallback is not good enough because triggered not only after a user log in but also when he is already logged in and reload the application.

3

Hi @karen2, Post-Login Action events occur as part of the authorization flow on the Auth0 backend when a user logs in to any application in an Auth0 tenant.

In other words, you do not have to pass in any parameter in Auth0Provider to initiate the Post-Login Action, it will automatically trigger when users logs into your application.

The function onRedirectCallback is not good enough because triggered not only after a user log in but also when he is already logged in and reload the application.

I want to note that Post-Login Actions occur not only for logins, but also for silent authentication + refresh_token rotation requests (which sounds like the issue you are mentioning).

You can ignore these types of silent auth + refresh_token rotation requests in the Auth0 Action by doing something like below in the following code snippet:

exports.onExecutePostLogin = async (event, api) => {

  // refresh token rotation or a silent auth request
  const is_silent_auth = event.transaction?.protocol === 'oauth2-refresh-token' ||
                         event.request.query?.prompt === 'none';
  if (is_silent_auth) return;

  // continue your code here
}
3 Likes