SKILLOfficialsecurity

auth0-react

プラグイン: auth0
ライセンス: Apache-2.0
ソース: GitHub で見る ↗

説明

次のような場合に使用: React製のシングルページアプリケーション（ひとつのページで動作するウェブアプリ）に、Auth0（クラウド認証サービス）を使用したログイン・ログアウト機能、保護されたページ、またはユーザーセッション（利用状態の保持）を追加する場合。 @auth0/auth0-react というライブラリと統合します。ユーザーが「Reactアプリにログイン機能を追加してほしい」や「Reactのページを保護してほしい」と言った場合でも、具体的なSDK（開発キット）の名前を挙げていなければこのスキルを使用してください。

原文を表示

Use when adding Auth0 login, logout, protected routes, or user sessions to a React SPA. Integrates @auth0/auth0-react — use even if the user says "add login to my React app" or "protect my React routes" without naming the SDK.

ユースケース

Reactアプリにログイン機能を追加する
Auth0を使用した認証を実装する
保護されたページを設定する
ユーザーセッションを保持する
ログアウト機能を追加する

本文（日本語訳）

Auth0 React インテグレーション

@auth0/auth0-react を使用して、React シングルページアプリケーションに認証機能を追加します。

前提条件

React 16.11 以上のアプリケーション（Vite または Create React App）— React 16、17、18、19 に対応
Auth0 アカウントおよびアプリケーションの設定が完了していること
Auth0 をまだセットアップしていない場合は、先に auth0-quickstart スキルを使用してください

使用しない場合

Next.js アプリケーション — App Router・Pages Router のどちらにも auth0-nextjs スキルを使用してください
React Native モバイルアプリ — iOS/Android には auth0-react-native スキルを使用してください
サーバーサイドレンダリングの React — フレームワーク固有の SDK（Next.js、Remix 等）を使用してください
埋め込みログイン — この SDK は Auth0 Universal Login（リダイレクト方式）を使用します
バックエンド API の認証 — 代わりに express-openid-connect または JWT バリデーションを使用してください

クイックスタート手順

1. SDK のインストール

npm install @auth0/auth0-react

2. 環境設定

Auth0 CLI を使った自動セットアップの場合は、完全なスクリプトについてセットアップガイドを参照してください。

手動セットアップの場合：

.env ファイルを作成します：

Vite の場合：

VITE_AUTH0_DOMAIN=your-tenant.auth0.com
VITE_AUTH0_CLIENT_ID=your-client-id

Create React App の場合：

REACT_APP_AUTH0_DOMAIN=your-tenant.auth0.com
REACT_APP_AUTH0_CLIENT_ID=your-client-id

3. Auth0Provider でアプリをラップする

src/main.tsx（Vite）または src/index.tsx（CRA）を更新します：

import React from 'react';
import ReactDOM from 'react-dom/client';
import { Auth0Provider } from '@auth0/auth0-react';
import App from './App';

ReactDOM.createRoot(document.getElementById('root')!).render(
  <React.StrictMode>
    <Auth0Provider
      domain={import.meta.env.VITE_AUTH0_DOMAIN} // または process.env.REACT_APP_AUTH0_DOMAIN
      clientId={import.meta.env.VITE_AUTH0_CLIENT_ID}
      authorizationParams={{
        redirect_uri: window.location.origin
      }}
    >
      <App />
    </Auth0Provider>
  </React.StrictMode>
);

4. 認証 UI の追加

import { useAuth0 } from '@auth0/auth0-react';

export function LoginButton() {
  const { loginWithRedirect, logout, isAuthenticated, user, isLoading } = useAuth0();

  if (isLoading) return <div>Loading...</div>;

  if (isAuthenticated) {
    return (
      <div>
        <span>Welcome, {user?.name}</span>
        <button onClick={() => logout({ logoutParams: { returnTo: window.location.origin } })}>
          Logout
        </button>
      </div>
    );
  }

  return <button onClick={() => loginWithRedirect()}>Login</button>;
}

5. 認証のテスト

開発サーバーを起動し、ログインフローをテストします：

npm run dev  # Vite
# または
npm start    # CRA

詳細ドキュメント

セットアップガイド — 自動セットアップスクリプト（Bash/PowerShell）、CLI コマンド、手動設定
インテグレーションガイド — 保護されたルート、API 呼び出し、エラーハンドリング、応用パターン
API リファレンス — SDK の完全な API、設定オプション、hooks リファレンス、テスト戦略

よくある間違い

間違い	対処法
Auth0 Dashboard へのリダイレクト URI の追加を忘れた	Auth0 Dashboard の Allowed Callback URLs にアプリケーションの URL（例：`http://localhost:3000`、`https://app.example.com`）を追加してください
環境変数のプレフィックスが間違っている	Vite は `VITE_` プレフィックス、Create React App は `REACT_APP_` プレフィックスを使用します
ローディング状態を処理していない	認証に依存する UI をレンダリングする前に、必ず `isLoading` を確認してください
トークンを localStorage に保存している	トークンを手動で保存しないでください — SDK が自動的にセキュアなストレージを管理します
Auth0Provider のラップが漏れている	アプリ全体を `<Auth0Provider>` でラップする必要があります
Provider がルートレベルに配置されていない	Auth0Provider は、auth hooks を使用するすべてのコンポーネントをラップしなければなりません
環境変数のインポートパスが間違っている	Vite は `import.meta.env.VITE_`、CRA は `process.env.REACT_APP_` を使用します
アプリ内 MFA に `acr_values` リダイレクトを使用している	アプリ内の enrollment/challenge/verify フローには `useAuth0().mfa` API を使用してください
`MfaRequiredError` をキャッチしていない	`getAccessTokenSilently` を try/catch でラップし、`instanceof MfaRequiredError` を確認してください
MFA エンドポイントに直接 HTTP リクエストを送っている	`useAuth0()` の `mfa` プロパティを使用してください — トークン管理を自動的に処理します
ステップアップ MFA でリフレッシュトークンを忘れた	`interactiveErrorHandler="popup"` を使用する場合は、Auth0Provider に `useRefreshTokens={true}` を設定してください

クイックリファレンス

主要な Hooks：

useAuth0() — メインの認証 hook
isAuthenticated — ユーザーがログイン済みかどうかを確認
user — ユーザープロフィール情報
loginWithRedirect() — ログインを開始
logout() — ユーザーをログアウト
getAccessTokenSilently() — API 呼び出し用のアクセストークンを取得
mfa — enrollment・challenge・verification 用の MFA API クライアント
- mfa.getAuthenticators(mfaToken) — 登録済み authenticator の一覧を取得
- mfa.getEnrollmentFactors(mfaToken) — 利用可能な enrollment ファクターを取得
- mfa.enroll(params) — 新しい authenticator を登録（OTP、SMS、Email、Voice、Push）
- mfa.challenge(params) — MFA チャレンジを開始
- mfa.verify(params) — MFA チャレンジを検証し、認証を完了

MFA エラータイプ（@auth0/auth0-react からインポート）：

MfaRequiredError — MFA が必要な場合に getAccessTokenSilently がスロー（mfa_token と mfa_requirements を持つ）
MfaEnrollmentError、MfaChallengeError、MfaVerifyError — それぞれ対応する mfa.* メソッドがスロー

主なユースケース：

ログイン/ログアウトボタン → 上記ステップ 4 を参照
保護されたルート → インテグレーションガイド
トークンを使った API 呼び出し → インテグレーションガイド
エラーハンドリング → インテグレーションガイド
MFA の処理 → インテグレーションガイド

参考リンク

原文（English）を表示

Auth0 React Integration

Add authentication to React single-page applications using @auth0/auth0-react.

Prerequisites

React 16.11+ application (Vite or Create React App) - supports React 16, 17, 18, and 19
Auth0 account and application configured
If you don't have Auth0 set up yet, use the auth0-quickstart skill first

When NOT to Use

Next.js applications - Use auth0-nextjs skill for both App Router and Pages Router
React Native mobile apps - Use auth0-react-native skill for iOS/Android
Server-side rendered React - Use framework-specific SDK (Next.js, Remix, etc.)
Embedded login - This SDK uses Auth0 Universal Login (redirect-based)
Backend API authentication - Use express-openid-connect or JWT validation instead

Quick Start Workflow

1. Install SDK

npm install @auth0/auth0-react

2. Configure Environment

For automated setup with Auth0 CLI, see Setup Guide for complete scripts.

For manual setup:

Create .env file:

Vite:

VITE_AUTH0_DOMAIN=your-tenant.auth0.com
VITE_AUTH0_CLIENT_ID=your-client-id

Create React App:

REACT_APP_AUTH0_DOMAIN=your-tenant.auth0.com
REACT_APP_AUTH0_CLIENT_ID=your-client-id

3. Wrap App with Auth0Provider

Update src/main.tsx (Vite) or src/index.tsx (CRA):

import React from 'react';
import ReactDOM from 'react-dom/client';
import { Auth0Provider } from '@auth0/auth0-react';
import App from './App';

ReactDOM.createRoot(document.getElementById('root')!).render(
  <React.StrictMode>
    <Auth0Provider
      domain={import.meta.env.VITE_AUTH0_DOMAIN} // or process.env.REACT_APP_AUTH0_DOMAIN
      clientId={import.meta.env.VITE_AUTH0_CLIENT_ID}
      authorizationParams={{
        redirect_uri: window.location.origin
      }}
    >
      <App />
    </Auth0Provider>
  </React.StrictMode>
);

4. Add Authentication UI

import { useAuth0 } from '@auth0/auth0-react';

export function LoginButton() {
  const { loginWithRedirect, logout, isAuthenticated, user, isLoading } = useAuth0();

  if (isLoading) return <div>Loading...</div>;

  if (isAuthenticated) {
    return (
      <div>
        <span>Welcome, {user?.name}</span>
        <button onClick={() => logout({ logoutParams: { returnTo: window.location.origin } })}>
          Logout
        </button>
      </div>
    );
  }

  return <button onClick={() => loginWithRedirect()}>Login</button>;
}

5. Test Authentication

Start your dev server and test the login flow:

npm run dev  # Vite
# or
npm start    # CRA

Detailed Documentation

Setup Guide - Automated setup scripts (Bash/PowerShell), CLI commands, manual configuration
Integration Guide - Protected routes, API calls, error handling, advanced patterns
API Reference - Complete SDK API, configuration options, hooks reference, testing strategies

Common Mistakes

Mistake	Fix
Forgot to add redirect URI in Auth0 Dashboard	Add your application URL (e.g., `http://localhost:3000`, `https://app.example.com`) to Allowed Callback URLs in Auth0 Dashboard
Using wrong env var prefix	Vite uses `VITE_` prefix, Create React App uses `REACT_APP_`
Not handling loading state	Always check `isLoading` before rendering auth-dependent UI
Storing tokens in localStorage	Never manually store tokens - SDK handles secure storage automatically
Missing Auth0Provider wrapper	Entire app must be wrapped in `<Auth0Provider>`
Provider not at root level	Auth0Provider must wrap all components that use auth hooks
Wrong import path for env vars	Vite uses `import.meta.env.VITE_`, CRA uses `process.env.REACT_APP_`
Using `acr_values` redirect for in-app MFA	Use `useAuth0().mfa` API for in-app enrollment/challenge/verify flows
Not catching `MfaRequiredError`	Wrap `getAccessTokenSilently` in try/catch and check `instanceof MfaRequiredError`
Making direct HTTP calls to MFA endpoints	Use the `mfa` property from `useAuth0()` — it handles token management automatically
Forgetting refresh tokens for step-up MFA	Set `useRefreshTokens={true}` on Auth0Provider when using `interactiveErrorHandler="popup"`

Related Skills

auth0-quickstart - Basic Auth0 setup
auth0-migration - Migrate from another auth provider
auth0-mfa - Add Multi-Factor Authentication
auth0-cli - Manage Auth0 resources from the terminal

Quick Reference

Core Hooks:

useAuth0() - Main authentication hook
isAuthenticated - Check if user is logged in
user - User profile information
loginWithRedirect() - Initiate login
logout() - Log out user
getAccessTokenSilently() - Get access token for API calls
mfa - MFA API client for enrollment, challenge, and verification
- mfa.getAuthenticators(mfaToken) - List enrolled authenticators
- mfa.getEnrollmentFactors(mfaToken) - Get available enrollment factors
- mfa.enroll(params) - Enroll new authenticator (OTP, SMS, Email, Voice, Push)
- mfa.challenge(params) - Initiate MFA challenge
- mfa.verify(params) - Verify MFA challenge and complete authentication

MFA Error Types (import from @auth0/auth0-react):

MfaRequiredError - Thrown by getAccessTokenSilently when MFA is needed (has mfa_token and mfa_requirements)
MfaEnrollmentError, MfaChallengeError, MfaVerifyError - Thrown by respective mfa.* methods

Common Use Cases:

Login/Logout buttons → See Step 4 above
Protected routes → Integration Guide
API calls with tokens → Integration Guide
Error handling → Integration Guide
MFA handling → Integration Guide

References

原文・著作権は Anthropic および各プラグイン作者に帰属します。日本語訳は Claude API による自動翻訳です。

SKILLOfficialsecurity

auth0-react

プラグイン: auth0
ライセンス: Apache-2.0
ソース: GitHub で見る ↗

説明

原文を表示

ユースケース

Reactアプリにログイン機能を追加する
Auth0を使用した認証を実装する
保護されたページを設定する
ユーザーセッションを保持する
ログアウト機能を追加する

本文（日本語訳）

Auth0 React インテグレーション

@auth0/auth0-react を使用して、React シングルページアプリケーションに認証機能を追加します。

前提条件

React 16.11 以上のアプリケーション（Vite または Create React App）— React 16、17、18、19 に対応
Auth0 アカウントおよびアプリケーションの設定が完了していること
Auth0 をまだセットアップしていない場合は、先に auth0-quickstart スキルを使用してください

使用しない場合

Next.js アプリケーション — App Router・Pages Router のどちらにも auth0-nextjs スキルを使用してください
React Native モバイルアプリ — iOS/Android には auth0-react-native スキルを使用してください
サーバーサイドレンダリングの React — フレームワーク固有の SDK（Next.js、Remix 等）を使用してください
埋め込みログイン — この SDK は Auth0 Universal Login（リダイレクト方式）を使用します
バックエンド API の認証 — 代わりに express-openid-connect または JWT バリデーションを使用してください

クイックスタート手順

1. SDK のインストール

npm install @auth0/auth0-react

2. 環境設定

Auth0 CLI を使った自動セットアップの場合は、完全なスクリプトについてセットアップガイドを参照してください。

手動セットアップの場合：

.env ファイルを作成します：

Vite の場合：

VITE_AUTH0_DOMAIN=your-tenant.auth0.com
VITE_AUTH0_CLIENT_ID=your-client-id

Create React App の場合：

REACT_APP_AUTH0_DOMAIN=your-tenant.auth0.com
REACT_APP_AUTH0_CLIENT_ID=your-client-id

3. Auth0Provider でアプリをラップする

src/main.tsx（Vite）または src/index.tsx（CRA）を更新します：

import React from 'react';
import ReactDOM from 'react-dom/client';
import { Auth0Provider } from '@auth0/auth0-react';
import App from './App';

ReactDOM.createRoot(document.getElementById('root')!).render(
  <React.StrictMode>
    <Auth0Provider
      domain={import.meta.env.VITE_AUTH0_DOMAIN} // または process.env.REACT_APP_AUTH0_DOMAIN
      clientId={import.meta.env.VITE_AUTH0_CLIENT_ID}
      authorizationParams={{
        redirect_uri: window.location.origin
      }}
    >
      <App />
    </Auth0Provider>
  </React.StrictMode>
);

4. 認証 UI の追加

import { useAuth0 } from '@auth0/auth0-react';

export function LoginButton() {
  const { loginWithRedirect, logout, isAuthenticated, user, isLoading } = useAuth0();

  if (isLoading) return <div>Loading...</div>;

  if (isAuthenticated) {
    return (
      <div>
        <span>Welcome, {user?.name}</span>
        <button onClick={() => logout({ logoutParams: { returnTo: window.location.origin } })}>
          Logout
        </button>
      </div>
    );
  }

  return <button onClick={() => loginWithRedirect()}>Login</button>;
}

5. 認証のテスト

開発サーバーを起動し、ログインフローをテストします：

npm run dev  # Vite
# または
npm start    # CRA

詳細ドキュメント

セットアップガイド — 自動セットアップスクリプト（Bash/PowerShell）、CLI コマンド、手動設定
インテグレーションガイド — 保護されたルート、API 呼び出し、エラーハンドリング、応用パターン
API リファレンス — SDK の完全な API、設定オプション、hooks リファレンス、テスト戦略

よくある間違い

間違い	対処法
Auth0 Dashboard へのリダイレクト URI の追加を忘れた	Auth0 Dashboard の Allowed Callback URLs にアプリケーションの URL（例：`http://localhost:3000`、`https://app.example.com`）を追加してください
環境変数のプレフィックスが間違っている	Vite は `VITE_` プレフィックス、Create React App は `REACT_APP_` プレフィックスを使用します
ローディング状態を処理していない	認証に依存する UI をレンダリングする前に、必ず `isLoading` を確認してください
トークンを localStorage に保存している	トークンを手動で保存しないでください — SDK が自動的にセキュアなストレージを管理します
Auth0Provider のラップが漏れている	アプリ全体を `<Auth0Provider>` でラップする必要があります
Provider がルートレベルに配置されていない	Auth0Provider は、auth hooks を使用するすべてのコンポーネントをラップしなければなりません
環境変数のインポートパスが間違っている	Vite は `import.meta.env.VITE_`、CRA は `process.env.REACT_APP_` を使用します
アプリ内 MFA に `acr_values` リダイレクトを使用している	アプリ内の enrollment/challenge/verify フローには `useAuth0().mfa` API を使用してください
`MfaRequiredError` をキャッチしていない	`getAccessTokenSilently` を try/catch でラップし、`instanceof MfaRequiredError` を確認してください
MFA エンドポイントに直接 HTTP リクエストを送っている	`useAuth0()` の `mfa` プロパティを使用してください — トークン管理を自動的に処理します
ステップアップ MFA でリフレッシュトークンを忘れた	`interactiveErrorHandler="popup"` を使用する場合は、Auth0Provider に `useRefreshTokens={true}` を設定してください

クイックリファレンス

主要な Hooks：

useAuth0() — メインの認証 hook
isAuthenticated — ユーザーがログイン済みかどうかを確認
user — ユーザープロフィール情報
loginWithRedirect() — ログインを開始
logout() — ユーザーをログアウト
getAccessTokenSilently() — API 呼び出し用のアクセストークンを取得
mfa — enrollment・challenge・verification 用の MFA API クライアント
- mfa.getAuthenticators(mfaToken) — 登録済み authenticator の一覧を取得
- mfa.getEnrollmentFactors(mfaToken) — 利用可能な enrollment ファクターを取得
- mfa.enroll(params) — 新しい authenticator を登録（OTP、SMS、Email、Voice、Push）
- mfa.challenge(params) — MFA チャレンジを開始
- mfa.verify(params) — MFA チャレンジを検証し、認証を完了

MFA エラータイプ（@auth0/auth0-react からインポート）：

MfaRequiredError — MFA が必要な場合に getAccessTokenSilently がスロー（mfa_token と mfa_requirements を持つ）
MfaEnrollmentError、MfaChallengeError、MfaVerifyError — それぞれ対応する mfa.* メソッドがスロー

主なユースケース：

ログイン/ログアウトボタン → 上記ステップ 4 を参照
保護されたルート → インテグレーションガイド
トークンを使った API 呼び出し → インテグレーションガイド
エラーハンドリング → インテグレーションガイド
MFA の処理 → インテグレーションガイド

参考リンク

原文（English）を表示

Auth0 React Integration

Add authentication to React single-page applications using @auth0/auth0-react.

Prerequisites

React 16.11+ application (Vite or Create React App) - supports React 16, 17, 18, and 19
Auth0 account and application configured
If you don't have Auth0 set up yet, use the auth0-quickstart skill first

When NOT to Use

Next.js applications - Use auth0-nextjs skill for both App Router and Pages Router
React Native mobile apps - Use auth0-react-native skill for iOS/Android
Server-side rendered React - Use framework-specific SDK (Next.js, Remix, etc.)
Embedded login - This SDK uses Auth0 Universal Login (redirect-based)
Backend API authentication - Use express-openid-connect or JWT validation instead

Quick Start Workflow

1. Install SDK

npm install @auth0/auth0-react

2. Configure Environment

For automated setup with Auth0 CLI, see Setup Guide for complete scripts.

For manual setup:

Create .env file:

Vite:

VITE_AUTH0_DOMAIN=your-tenant.auth0.com
VITE_AUTH0_CLIENT_ID=your-client-id

Create React App:

REACT_APP_AUTH0_DOMAIN=your-tenant.auth0.com
REACT_APP_AUTH0_CLIENT_ID=your-client-id

3. Wrap App with Auth0Provider

Update src/main.tsx (Vite) or src/index.tsx (CRA):

import React from 'react';
import ReactDOM from 'react-dom/client';
import { Auth0Provider } from '@auth0/auth0-react';
import App from './App';

ReactDOM.createRoot(document.getElementById('root')!).render(
  <React.StrictMode>
    <Auth0Provider
      domain={import.meta.env.VITE_AUTH0_DOMAIN} // or process.env.REACT_APP_AUTH0_DOMAIN
      clientId={import.meta.env.VITE_AUTH0_CLIENT_ID}
      authorizationParams={{
        redirect_uri: window.location.origin
      }}
    >
      <App />
    </Auth0Provider>
  </React.StrictMode>
);

4. Add Authentication UI

import { useAuth0 } from '@auth0/auth0-react';

export function LoginButton() {
  const { loginWithRedirect, logout, isAuthenticated, user, isLoading } = useAuth0();

  if (isLoading) return <div>Loading...</div>;

  if (isAuthenticated) {
    return (
      <div>
        <span>Welcome, {user?.name}</span>
        <button onClick={() => logout({ logoutParams: { returnTo: window.location.origin } })}>
          Logout
        </button>
      </div>
    );
  }

  return <button onClick={() => loginWithRedirect()}>Login</button>;
}

5. Test Authentication

Start your dev server and test the login flow:

npm run dev  # Vite
# or
npm start    # CRA

Detailed Documentation

Setup Guide - Automated setup scripts (Bash/PowerShell), CLI commands, manual configuration
Integration Guide - Protected routes, API calls, error handling, advanced patterns
API Reference - Complete SDK API, configuration options, hooks reference, testing strategies

Common Mistakes

Mistake	Fix
Forgot to add redirect URI in Auth0 Dashboard	Add your application URL (e.g., `http://localhost:3000`, `https://app.example.com`) to Allowed Callback URLs in Auth0 Dashboard
Using wrong env var prefix	Vite uses `VITE_` prefix, Create React App uses `REACT_APP_`
Not handling loading state	Always check `isLoading` before rendering auth-dependent UI
Storing tokens in localStorage	Never manually store tokens - SDK handles secure storage automatically
Missing Auth0Provider wrapper	Entire app must be wrapped in `<Auth0Provider>`
Provider not at root level	Auth0Provider must wrap all components that use auth hooks
Wrong import path for env vars	Vite uses `import.meta.env.VITE_`, CRA uses `process.env.REACT_APP_`
Using `acr_values` redirect for in-app MFA	Use `useAuth0().mfa` API for in-app enrollment/challenge/verify flows
Not catching `MfaRequiredError`	Wrap `getAccessTokenSilently` in try/catch and check `instanceof MfaRequiredError`
Making direct HTTP calls to MFA endpoints	Use the `mfa` property from `useAuth0()` — it handles token management automatically
Forgetting refresh tokens for step-up MFA	Set `useRefreshTokens={true}` on Auth0Provider when using `interactiveErrorHandler="popup"`

Related Skills

auth0-quickstart - Basic Auth0 setup
auth0-migration - Migrate from another auth provider
auth0-mfa - Add Multi-Factor Authentication
auth0-cli - Manage Auth0 resources from the terminal

Quick Reference

Core Hooks:

useAuth0() - Main authentication hook
isAuthenticated - Check if user is logged in
user - User profile information
loginWithRedirect() - Initiate login
logout() - Log out user
getAccessTokenSilently() - Get access token for API calls
mfa - MFA API client for enrollment, challenge, and verification
- mfa.getAuthenticators(mfaToken) - List enrolled authenticators
- mfa.getEnrollmentFactors(mfaToken) - Get available enrollment factors
- mfa.enroll(params) - Enroll new authenticator (OTP, SMS, Email, Voice, Push)
- mfa.challenge(params) - Initiate MFA challenge
- mfa.verify(params) - Verify MFA challenge and complete authentication

MFA Error Types (import from @auth0/auth0-react):

MfaRequiredError - Thrown by getAccessTokenSilently when MFA is needed (has mfa_token and mfa_requirements)
MfaEnrollmentError, MfaChallengeError, MfaVerifyError - Thrown by respective mfa.* methods

Common Use Cases:

Login/Logout buttons → See Step 4 above
Protected routes → Integration Guide
API calls with tokens → Integration Guide
Error handling → Integration Guide
MFA handling → Integration Guide

References

原文・著作権は Anthropic および各プラグイン作者に帰属します。日本語訳は Claude API による自動翻訳です。

auth0-react

Auth0 React インテグレーション

前提条件

使用しない場合

クイックスタート手順

1. SDK のインストール

2. 環境設定

3. Auth0Provider でアプリをラップする

4. 認証 UI の追加

5. 認証のテスト

詳細ドキュメント

よくある間違い

関連スキル

クイックリファレンス

参考リンク

Auth0 React Integration

Prerequisites

When NOT to Use

Quick Start Workflow

1. Install SDK

2. Configure Environment

3. Wrap App with Auth0Provider

4. Add Authentication UI

5. Test Authentication

Detailed Documentation

Common Mistakes

Related Skills

Quick Reference

References

auth0-react

Auth0 React インテグレーション

前提条件

使用しない場合

クイックスタート手順

1. SDK のインストール

2. 環境設定

3. Auth0Provider でアプリをラップする

4. 認証 UI の追加

5. 認証のテスト

詳細ドキュメント

よくある間違い

関連スキル

クイックリファレンス

参考リンク

Auth0 React Integration

Prerequisites

When NOT to Use

Quick Start Workflow

1. Install SDK

2. Configure Environment

3. Wrap App with Auth0Provider

4. Add Authentication UI

5. Test Authentication

Detailed Documentation

Common Mistakes

Related Skills

Quick Reference

References