@xid-kit/react-native

Hosted Auth リダイレクト、PKCE S256、ディープリンクコールバック、セキュアトークンストレージアダプター用の React Native プロバイダーとフック。

状態

Registry 状態: UNPUBLISHED。この SDK はリポジトリのソース checkout からのみインストールし、外部 package registry は使用しないでください。

パッケージのステータスは 現行パッケージ です。ネイティブ token-session contract として、PKCE S256 を使用する Hosted Auth redirect、deep-link callback での state と nonce の検証、検証済み ID token claims、authorization code exchange、注入された storage adapter を介した安全なセッション永続化を実装しています。

本番インフラでの実際の IdP ラウンドトリップはまだ手動検証待ちです。このページは実装済みの動作を記録したものであり、準備完了の主張ではありません。

プロバイダーの設定

TokenCache（プラットフォームセキュアストレージ）と BrowserInterface（アプリ内ブラウザ）を XidProvider に注入します。SDK はネイティブモジュールをハードバインドしません。Expo アプリは @xid-kit/expo の既製アダプターを使用できます。

import { XidProvider } from '@xid-kit/react-native'
import type { BrowserInterface, TokenCache } from '@xid-kit/react-native'
import * as Keychain from 'react-native-keychain'

const tokenCache: TokenCache = {
  async getToken(key) {
    const result = await Keychain.getGenericPassword({ service: key })
    return result ? result.password : null
  },
  async saveToken(key, value) {
    await Keychain.setGenericPassword('xid', value, { service: key })
  },
  async deleteToken(key) {
    await Keychain.resetGenericPassword({ service: key })
  },
}

const browser: BrowserInterface = {
  async openAuthSession(url, redirectUri) {
    // Open url with your in-app browser library, wait for the redirectUri
    // deep link, then return { type: 'success', url } or { type: 'cancel' }.
    throw new Error('Implement with your preferred in-app browser library.')
  },
}

export function App() {
  return (
    <XidProvider
      issuer="https://xid.dev"
      clientId="your_client_id"
      redirectUri="myapp://auth/callback"
      tokenCache={tokenCache}
      browser={browser}
    >
      <RootNavigator />
    </XidProvider>
  )
}

サインイン

signIn() は PKCE S256 認可 URL を生成し、verifier、OAuth state、nonce を token cache に保存して browser adapter を開き、返された code を検証済みのネイティブセッションと交換します。ブラウザーの失敗、state の不一致、ID token の検証エラー、token exchange のエラーは signInState.status === 'error' として通知されます。

import { useSignIn } from '@xid-kit/react-native'

function SignInScreen() {
  const { signIn, signInState } = useSignIn()

  return (
    <Button
      title={signInState.status === 'pending' ? 'Signing in...' : 'Sign in'}
      onPress={() => void signIn()}
    />
  )
}

ディープリンクコールバック

browser adapter 自体で redirect を捕捉できない場合は、アプリの manifest に redirect URI scheme を登録し、deep link を handleRedirect(url) に転送してください。このメソッドは OAuth state、verifier、nonce を検証して消費し、code を交換し、ID token を検証して、ネイティブセッションを保存します。

import { useSignIn } from '@xid-kit/react-native'
import { useEffect } from 'react'
import { Linking } from 'react-native'

function DeepLinkHandler() {
  const { handleRedirect } = useSignIn()

  useEffect(() => {
    const sub = Linking.addEventListener('url', ({ url }) => {
      if (url.startsWith('myapp://auth/callback')) {
        void handleRedirect(url)
      }
    })
    return () => sub.remove()
  }, [handleRedirect])

  return null
}

エクスポートされた API

エクスポート	種別	目的
`XidProvider`	コンポーネント	tokenCache、browser、issuer、clientId、redirectUri、scopes、任意の fetcher を使用するネイティブ token-session context を提供します
`useSignIn`	フック	signIn(options?) はリダイレクトフロー全体を実行します。handleRedirect(url) はディープリンクコールバックを処理し、signInState は idle、pending、complete、cancelled、error を返します
`useSignOut`	フック	signOut() はローカルセッションとレガシー credentials を消去します。signOutState は進行状況または storage の失敗を通知します。revoke request は送信されません
`useXidRnContext`	フック	生のアダプターコンテキスト（高度な使用およびテスト向け）
`exchangeCodeForTokens`	function	grant_type authorization_code と PKCE ベリファイアーを使ったトークンエンドポイントへの低レベル POST。TokenSet を返します
`saveTokenSet / clearTokenSet`	関数	TokenCache アダプターでトークンセットを永続化または削除します
`TOKEN_KEYS`	as const オブジェクト	現在の session envelope、および保留中の PKCE、state、nonce records に使用する TokenCache key names。レガシー token keys はクリーンアップ専用です
`createPkceVerifier / createPkceChallenge`	関数	PKCE S256 ユーティリティは @xid-kit/protocol（Web Crypto）に委譲
`createRandomString / base64UrlEncode`	関数	OAuth state 用の URL セーフなランダム文字列。base64url エンコーディングヘルパー

ネイティブの hooks と controls

@xid-kit/react とは異なり、このパッケージは独自のネイティブ token context を使用します。useAuth、useUser、useSession、useSignIn、useSignOut、useXidRnContext、SignedIn、SignedOut、XidLoaded、XidLoading、exchangeCodeForTokens、saveTokenSet、readTokenSet、clearTokenSet をエクスポートします。React web SDK の import または re-export は行いません。

型

種別	説明
`XidProviderProps`	ネイティブ provider props: children、tokenCache、browser、issuer、clientId、redirectUri、任意の scopes (既定値は openid、profile、email)、任意の fetcher
`TokenCache`	ストレージアダプターコントラクト：getToken、saveToken、deleteToken（すべて非同期）
`BrowserInterface`	BrowserResult に解決される openAuthSession(url, redirectUri)
`BrowserResult`	成功（コールバック URL 付き）、キャンセル、非表示のユニオン
`SignInOptions`	signIn の呼び出しごとのオーバーライド：redirectUri、scopes
`SignInState / SignOutState`	フックが返す判別ステータスユニオン
`UseSignInReturn / UseSignOutReturn`	フック戻り値の形状：アクションとステート
`TokenExchangeInput / TokenSet`	exchangeCodeForTokens の入力と結果: accessToken、idToken、expiresIn、検証済み ID token claims
`XidRnContextValue`	useXidRnContext が返すアダプターコンテキストの形状

既知の制限事項

SDK には DPoP sender binding がないため offline_access を拒否し、access token の有効期限が切れた後は新しい authorization flow を要求します。
useAuth().isSignedIn は ID token の検証後にのみ、ローカルに保存されたセッションを反映します。web cookie session は読み取りません。
組織コンテキストは保存済みトークンからまだ取得されていません。

セキュリティ

PKCE S256 のみの認可コード。Implicit グラントおよびパスワードグラントは使用できません。
パブリッククライアントはクライアントシークレットを保存しません。
PKCE ベリファイアーと OAuth state は注入されたセキュアストレージアダプターに保存され、コード交換後に削除されます。
signOut は refresh request や revoke request を送信せずに、ローカルセッションとレガシー credentials を消去します。storage の失敗は signOutState で通知されます。