You can log out users from your React application by logging them out of their Auth0 sessions using the logout()
method from the Auth0 React SDK.
Create a logout-button.js
file in the src/components/buttons folder
Create a logout button component with the following code
import { useAuth0 } from "@auth0/auth0-react";
import React from "react";
export const LogoutButton = () => {
const { logout } = useAuth0();
const handleLogout = () => {
logout({
logoutParams: {
returnTo: window.location.origin,
},
});
};
return (
<button className="button__logout" onClick={handleLogout}>
Log Out
</button>
);
};
The `logout() method from Auth0 React SDK clears the application session and redirects to the Auth0 /v2/logout endpoint to clear the Auth0 session.
You can pass an object argument to logout()
to customize the logout behavior of the React application. You can define a logoutParams
property on that object to define parameters for the /v2/logout call. This process is invisible to the user.
Pass the logoutParams.returnTo
option to specify the URL where Auth0 should redirect your users after they log out.
Setting logoutParams.returnTo
to window.location.origin
will ensure that Auth0 redirects your users to your production URL that you add to the "Allowed Logout URLs" list.
Hi, Will. Unfortunately, the application not working from this moment. Styles for buttons do not have correct names. In the original repo application not working. (Yes, I tried to build it from "Vecel" branch )