RegisterLogin
DocsPricing
RegisterLogin
  • Getting Started
  • Introduction
  • Quick Start
  • SDKs
  • React
  • TypeScript
  • Next.js
  • Express
  • NestJS
  • Python
  • API Reference
  • Support and Resources
  • FAQ
  • Contact

useAuthCallback

The useAuthCallback hook handles the OAuth callback after a user is redirected back from the authorization server.


Basic Usage

import { useAuthCallback } from 'authsafe-react';

function CallbackPage() {
  const { isLoading, error, isSuccess } = useAuthCallback();

  if (isLoading) return <div>Processing login...</div>;
  if (error) return <div>Login failed: {error.message}</div>;
  if (isSuccess) return <div>Login successful! Redirecting...</div>;

  return null;
}

Return Values

PropertyTypeDescription
isLoadingbooleanWhether the callback is being processed
errorError | nullError object if callback processing failed
isSuccessbooleanWhether the callback was handled successfully

Route Setup

Set up a callback route in your application:

// App.tsx
import { BrowserRouter, Route, Routes } from 'react-router-dom';

function App() {
  return (
    <AuthProvider config={config}>
      <BrowserRouter>
        <Routes>
          <Route path="/" element={<Home />} />
          <Route path="/callback" element={<CallbackPage />} />
        </Routes>
      </BrowserRouter>
    </AuthProvider>
  );
}

Type Definition

interface IUseAuthCallback {
  isLoading: boolean;
  error: Error | null;
  isSuccess: boolean;
}

Authentication Flow
  1. User clicks login button
  2. Browser redirects to AuthSafe authorization server
  3. User authenticates and grants consent
  4. AuthSafe redirects back to your callback URL with authorization code
  5. useAuthCallback exchanges code for tokens (PKCE-secured)
  6. User session is established and app redirects to destination
Best Practices
  • Always show a loading indicator during callback processing
  • Handle errors gracefully with clear user messaging
  • Set up redirect after success to navigate users to their intended page
  • Register the callback URL in your AuthSafe application settings
  • Use HTTPS for the callback URL in production

AuthSafe

Product

HighlightFeatureIntegrationPricingFAQ

Company

AboutBlogContact

Developer

DashboardDocumentation

Legal

Terms & ConditionsPrivacyComplianceShippingCancellationAI

© 2026 AuthSafe. All rights reserved.

Valoramos su privacidad

Este sitio web utiliza cookies para análisis anónimos que nos ayudan a mejorar su experiencia. No se almacena ni comparte información personal. Puede permitir o rechazar el seguimiento analítico en cualquier momento. Consulte nuestra Política de Privacidad.

Usamos cookies para análisis anónimos. No se almacena información personal. Consulte nuestra Política de Privacidad.