> ## Documentation Index
> Fetch the complete documentation index at: https://translations.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# iOS で My Account API を使用してセルフサービスのアカウントセキュリティ UI を構築する

> iOS で Auth0 の My Account API と Universal Components を使用して、セルフサービスのアカウントセキュリティ UI を構築する方法を説明します。

export const ReleaseStageNotice = ({feature, stage, plans, contact, terms}) => {
  const stageTextMap = {
    "beta": "Beta",
    "ea": "早期アクセス"
  };
  const stageText = stageTextMap[stage] || "製品リリース段階";
  const prsLink = "/docs/troubleshoot/product-lifecycle/product-release-stages";
  const linkify = (text, url) => {
    return <a href={url} target="_blank" rel="noreferrer" class="link">{text}</a>;
  };
  const includeDetails = (plans, contact, terms) => {
    const hasDetails = terms || plans || contact;
    if (!hasDetails) return null;
    return <span data-as="p">
            {plans && <>この機能は{linkify(`${plans}プラン`, "https://auth0.com/pricing")}でご利用いただけます。 </>}
            {contact && "参加をご希望の場合は、" + contact + "までお問い合わせください。 "}
            {terms && <>この機能を使用することにより、Oktaの該当する無料トライアル規約および{linkify("Master Subscription Agreement", "https://www.okta.com/legal")}に同意したものとみなされます。</>}
        </span>;
  };
  return <Warning>
            <span data-as="p">
                <strong>{feature}機能は現在、{linkify(stageText, prsLink)}です。</strong>
            </span>

            {includeDetails(plans, contact, terms)}
        </Warning>;
};

<ReleaseStageNotice feature="Auth0 Universal Components" stage="beta" terms="true" contact="Auth0 Support" />

iOS 向け Auth0 Universal Components を使用すると、[ネイティブ iOS アプリケーション](/docs/ja-jp/get-started/auth0-overview/create-applications#create-application-in-auth0)内に、セルフサービスで利用できるアカウントセキュリティ UI を構築できます。

`MyAccountAuthMethodsView` コンポーネントを使用すると、ユーザーはウェブブラウザーを開いたりサポートに問い合わせたりすることなく、ネイティブアプリケーション内で多要素認証 (MFA) の認証要素、パスキー、復旧コードなどの認証方法を直接管理できます。

<div id="how-it-works">
  ## 仕組み
</div>

`MyAccountAuthMethodsView` コンポーネントは、Auth0 の[My Account API の認証方法](/docs/ja-jp/manage-users/my-account-api#manage-authentication-methods)を使用して、アプリケーション内に認証方法管理用の UI をレンダリングします。

<Callout icon="file-lines" color="#0EA5E9" iconType="regular">
  My Account API では現在、特に Free ティアのテナントに対して低いレート制限が設定されています。そのため、これらのコンポーネントの使用中にエラーが発生する場合があります。
</Callout>

認証済みのユーザーがアカウント設定画面を開くと、[Auth0.swift](https://github.com/auth0/Auth0.swift) SDK は、My Account API の audience を対象とするスコープが設定された[アクセストークン](/docs/ja-jp/secure/tokens/access-tokens)を取得します。

`MyAccountAuthMethodsView` コンポーネントはアクセストークンを使用して、ログイン中のユーザーとして My Account API の [`/me/v1/authentication-methods`](/docs/ja-jp/api/myaccount/authentication-methods/get-authentication-methods) エンドポイントを呼び出します。そのため、各ユーザーは自身の認証方法のみを変更できます。

<Callout icon="file-lines" color="#0EA5E9" iconType="regular">
  * `MyAccountAuthMethodsView` コンポーネントは、**エンドユーザー向けのセルフサービス**インターフェースを作成します。エンドユーザーは、アカウントに登録されているすべての認証方法 (Email OTP、SMS OTP、TOTP (認証器アプリ) 、Auth0 Guardian 経由のプッシュ、パスキー、復旧コード) を登録、一覧表示、削除できます。

  * ユーザーが Auth0 Organization を管理するための**委任管理者**インターフェースについては、[Build a Delegated Admin Interface](/docs/ja-jp/get-started/universal-components/web/components/build-delegated-admin) を参照してください。
</Callout>

<div id="prerequisites">
  ## 前提条件
</div>

<div id="enable-auth0-my-account-api">
  ### Auth0 My Account API を有効にする
</div>

1. [Dashboard > Applications > APIs](https://manage.auth0.com/#/apis) に移動します。
2. **Activate My Account API** を選択して、テナントで有効化します。

<div id="create-the-application-and-configure-my-account-api-permissions">
  ### アプリケーションを作成し、My Account API の権限を設定する
</div>

1. [Dashboard > Applications](https://manage.auth0.com/#/applications) に移動します。

2. **Create Application** を選択します。

3. **Native** を選択します。

4. **Settings** タブを選択し、**Allowed Callback URLs** に以下のコールバック URL を追加します。

   ```text theme={null}
   https://YOUR_AUTH0_DOMAIN/ios/YOUR_BUNDLE_ID/callback, YOUR_BUNDLE_ID://YOUR_AUTH0_DOMAIN/ios/YOUR_BUNDLE_ID/callback
   ```

5. **Allowed Logout URLs** にも同じ URL を追加します。

   ```text theme={null}
   https://YOUR_AUTH0_DOMAIN/ios/YOUR_BUNDLE_ID/callback, YOUR_BUNDLE_ID://YOUR_AUTH0_DOMAIN/ios/YOUR_BUNDLE_ID/callback
   ```

6. **API Access** タブを選択します。

7. **Auth0 My Account API** の **Edit** を選択し、以下の **User-delegated Access** 権限を追加します。

   `create:me:authentication_methods`
   `read:me:authentication_methods`
   `update:me:authentication_methods`
   `delete:me:authentication_methods`

8. **Save** を選択して、権限を保存します。

<Callout icon="file-lines" color="#0EA5E9" iconType="regular">
  * ユーザーのアクセス トークンには、ログイン時に付与された権限のみが含まれます。
  * ユーザーが認証方法を登録、確認、削除できるよう、4 つすべてのスコープをリクエストします。
</Callout>

<div id="install-the-sdk">
  ### SDK をインストールする
</div>

Swift Package Manager または Carthage を使用して、`Auth0UniversalComponents` パッケージをインストールします。

インストールの詳細と要件については、[iOS 向け Auth0 Universal Components](/docs/ja-jp/get-started/universal-components/ios/ios-overview)をお読みください。

<div id="initialize-the-sdk">
  ### SDK を初期化する
</div>

SDK を初期化するには、通常、アプリケーションの起動時にアプリケーション構造体の `init` 内で `Auth0UniversalComponentsSDKInitializer.initialize(...)` メソッドを一度呼び出します。

すでに `Auth0.plist` を使用して Auth0.swift を設定している場合は、`ClientId`、`Domain`、`Audience` キーを追加し、次のように呼び出します。

```swift App.swift wrap lines theme={null}
import SwiftUI
import Auth0
import Auth0UniversalComponents

@main
struct MyApp: App {
    init() {
        Auth0UniversalComponentsSDKInitializer.initialize(
            tokenProvider: CredentialsManager(authentication: Auth0.authentication())
        )
    }

    var body: some Scene {
        WindowGroup { ContentView() }
    }
}
```

または、コード内で値を直接渡します。

```swift App.swift wrap lines theme={null}
Auth0UniversalComponentsSDKInitializer.initialize(
    domain: "YOUR_AUTH0_DOMAIN",
    clientId: "YOUR_CLIENT_ID",
    audience: "https://YOUR_AUTH0_DOMAIN/me/",
    tokenProvider: CredentialsManager(authentication: Auth0.authentication())
)
```

<div id="configure-the-token-provider">
  ### トークンプロバイダーを設定する
</div>

[`Auth0.swift`](https://github.com/auth0/Auth0.swift) の `CredentialsManager` をラップする `TokenProvider` を使用して、アプリケーションから資格情報をリクエストします。

<Callout icon="file-lines" color="#0EA5E9" iconType="regular">
  本番環境での連携には、Auth0.swift の `CredentialsManager` を使用することを Auth0 は推奨しています。ストレージ要件を満たせない場合にのみ、カスタムの `TokenProvider` を実装してください。
</Callout>

Auth0.iOS SDK の `CredentialsManager` を使用せずに資格情報を管理するには、インターフェイスを直接実装します。

```swift wrap lines theme={null}
struct AppTokenProvider: TokenProvider {
    func fetchCredentials() async throws -> Credentials {
        // ユーザーのログイン資格情報を返します。
    }
    func storeCredentials(credentials: Credentials) {
        // 新規または更新された資格情報を永続化します。
    }
    func store(apiCredentials: APICredentials, for audience: String) {
        // audienceをキーとしてMy Account APIの資格情報を永続化します。
    }
    func fetchAPICredentials(audience: String, scope: String) async throws -> APICredentials {
        // キャッシュされたMy Account APIの資格情報を返します。期限切れの場合は更新します。
    }
}
```

<Check>
  コンポーネントをレンダリングする前に、ユーザーが認証されている必要があります。SDKを初期化し、`TokenProvider`プロトコルを接続したら、設定画面に[`MyAccountAuthMethodsView`](/docs/ja-jp/get-started/universal-components/ios/components/auth-methods-management)コンポーネントを追加して、ユーザーがMFA、パスキー、復旧コードをセルフサービスで管理できるようにします。
</Check>

<div id="learn-more">
  ## 詳細情報
</div>

<CardGroup cols={2}>
  <Card title="認証方法の管理" icon="shield" href="/docs/ja-jp/get-started/universal-components/ios/components/auth-methods-management">
    `MyAccountAuthMethodsView` コンポーネントのリファレンス、サポート対象の認証要素、埋め込みナビゲーションの例をご覧ください。
  </Card>

  <Card title="スタイルとテーマのカスタマイズ" icon="palette" href="/docs/ja-jp/get-started/universal-components/ios/ios-theming">
    Auth0のデザイントークンシステムを使用して、色、タイポグラフィ、余白、角丸、サイズのトークンをオーバーライドします。
  </Card>
</CardGroup>