> ## 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.

> ユーザーがログインした後にAuth0が保存したアップストリームのアクセストークンを使用して、Auth0アプリケーションからソーシャルまたはエンタープライズIDプロバイダーのAPIを呼び出します。

# IDプロバイダーのAPIを呼び出す

export const AuthCodeGroup = ({children, dropdown}) => {
  const [processedChildren, setProcessedChildren] = useState(children);
  useEffect(() => {
    let unsubscribe = null;
    function init() {
      unsubscribe = window.autorun(() => {
        const processChildren = node => {
          if (typeof node === "string") {
            let processedNode = node;
            for (const [key, value] of window.rootStore.variableStore.values.entries()) {
              const escapedKey = key.replaceAll(/[.*+?^${}()|[\]\\]/g, (String.raw)`\$&`);
              processedNode = processedNode.replaceAll(new RegExp(escapedKey, "g"), value);
            }
            return processedNode;
          } else if (Array.isArray(node)) {
            return node.map(processChildren);
          } else if (node && node.props && node.props.children) {
            return {
              ...node,
              props: {
                ...node.props,
                children: processChildren(node.props.children)
              }
            };
          }
          return node;
        };
        setProcessedChildren(processChildren(children));
      });
    }
    if (window.rootStore) {
      init();
    } else {
      window.addEventListener("adu:storeReady", init);
    }
    return () => {
      window.removeEventListener("adu:storeReady", init);
      unsubscribe?.();
    };
  }, [children]);
  return <CodeGroup dropdown={dropdown}>{processedChildren}</CodeGroup>;
};

export const AuthCodeBlock = ({filename, icon, language, highlight, children}) => {
  const [displayText, setDisplayText] = useState(children);
  const [copyText, setCopyText] = useState(children);
  const wrapperRef = React.useRef(null);
  useEffect(() => {
    let unsubscribe = null;
    function init() {
      if (!window.autorun || !window.rootStore) {
        return;
      }
      unsubscribe = window.autorun(() => {
        let processedChildrenForDisplay = children;
        let processedChildrenForCopy = children;
        for (const [key, value] of window.rootStore.variableStore.values.entries()) {
          const escapedKey = key.replaceAll(/[.*+?^${}()|[\]\\]/g, (String.raw)`\$&`);
          let displayValue = value;
          if (key === "{yourClientSecret}" && value !== "{yourClientSecret}") {
            displayValue = value.substring(0, 3) + "*****MASKED*****";
          }
          processedChildrenForDisplay = processedChildrenForDisplay.replaceAll(new RegExp(escapedKey, "g"), displayValue);
          processedChildrenForCopy = processedChildrenForCopy.replaceAll(new RegExp(escapedKey, "g"), value);
        }
        setDisplayText(processedChildrenForDisplay);
        setCopyText(processedChildrenForCopy);
      });
    }
    if (window.rootStore) {
      init();
    } else {
      window.addEventListener("adu:storeReady", init);
    }
    return () => {
      window.removeEventListener("adu:storeReady", init);
      unsubscribe?.();
    };
  }, [children]);
  useEffect(() => {
    if (!wrapperRef.current) return;
    const originalWriteText = navigator.clipboard.writeText.bind(navigator.clipboard);
    let isOverriding = false;
    const handleClick = e => {
      const button = e.target.closest('[data-testid="copy-code-button"]');
      if (!button || !wrapperRef.current.contains(button)) return;
      isOverriding = true;
      navigator.clipboard.writeText = text => {
        if (isOverriding) {
          isOverriding = false;
          navigator.clipboard.writeText = originalWriteText;
          return originalWriteText(copyText);
        }
        return originalWriteText(text);
      };
      setTimeout(() => {
        if (isOverriding) {
          isOverriding = false;
          navigator.clipboard.writeText = originalWriteText;
        }
      }, 100);
    };
    const wrapper = wrapperRef.current;
    wrapper.addEventListener('click', handleClick, true);
    return () => {
      wrapper.removeEventListener('click', handleClick, true);
      if (navigator.clipboard.writeText !== originalWriteText) {
        navigator.clipboard.writeText = originalWriteText;
      }
    };
  }, [copyText]);
  return <div ref={wrapperRef}>
      <CodeBlock filename={filename} icon={icon} language={language} lines highlight={highlight}>
        {displayText}
      </CodeBlock>
    </div>;
};

<Callout icon="file-lines" color="#0EA5E9" iconType="regular">
  接続で [Token Vault](/docs/ja-jp/secure/tokens/token-vault) が有効になっている場合、アクセストークンとリフレッシュトークンはユーザーの `identities` 配列には保存されなくなります。代わりに、Token Vault 内の安全なトークンセットに保存されます。Token Vault を有効にするには、[Configure Token Vault](/docs/ja-jp/secure/tokens/token-vault/configure-token-vault) を参照してください。
</Callout>

Facebook や GitHub などの外部 <Tooltip tip="Identity Provider (IdP): Service that stores and manages digital identities." cta="用語集を表示" href="/docs/ja-jp/glossary?term=Identity+Provider">IDプロバイダー</Tooltip> (IdP) でユーザーの認証に成功すると、IdP は Auth0 に返すユーザープロファイルに <Tooltip tip="Access Token: Authorization credential, in the form of an opaque string or JWT, used to access an API." cta="用語集を表示" href="/docs/ja-jp/glossary?term=access+token">アクセストークン</Tooltip> を含めることがよくあります。

このトークンを取得して、IdP の API を呼び出すことができます。

<Callout icon="file-lines" color="#0EA5E9" iconType="regular">
  この記事では、選択した IdP との接続がすでに設定済みであることを前提としています。まだの場合は、[Identity Providers Supported by Auth0](/docs/ja-jp/authenticate/identity-providers/social-identity-providers) に移動し、使用する IdP を選択して設定手順に従ってください。
</Callout>

実行する手順は、コードがバックエンドで動作するか、フロントエンドで動作するかによって異なります。

* コードがバックエンドで動作する場合は、サーバーがシークレットを安全に保存できる信頼された環境であるとみなせます (後述するように、バックエンドのシナリオではシークレットを使用します) 。その場合は、この記事の[バックエンドのセクション](#from-the-backend)に進んでください。
* コードがフロントエンドで動作する場合 (たとえば SPA、Native デスクトップアプリ、モバイルアプリなど) は、アプリで資格情報を安全に保持できないため、別の方法に従う必要があります。この場合は、この記事の[フロントエンドのセクション](#from-the-frontend)に進んでください。

<div id="from-the-backend">
  ## バックエンドから
</div>

ユーザーを認証すると、IdP は Auth0 に返すユーザープロファイルにアクセストークンを含めていることがよくあります。

セキュリティおよびコンプライアンス上の理由から、Auth0 はこのトークンをユーザープロファイルの一部としてアプリに送信しません。これを取得するには、Auth0 の <Tooltip tip="Management API: お客様が管理タスクを実行するための製品です。" cta="用語集を見る" href="/docs/ja-jp/glossary?term=Management+API">Management API</Tooltip> にアクセスし、ユーザーの完全なプロファイルを取得する必要があります。

1. [Auth0 Management API](https://auth0.com/docs/api/management/v2) を呼び出すためのアクセストークンを取得します。
2. 手順 1 で取得したアクセストークンを使用して、Auth0 Management API の [Get Users by ID endpoint](https://auth0.com/docs/api/management/v2#!/Users/get_users_by_id) を呼び出します。このエンドポイントは、IdP のアクセストークンを含むユーザーの完全なプロファイルを返します。
3. レスポンスから IdP のアクセストークンを取り出し、それを使って IdP の API を呼び出します。

<div id="step-1-get-a-token">
  ### ステップ 1: トークンを取得する
</div>

[Management API](https://auth0.com/docs/api/management/v2) を呼び出すには、アクセストークンが必要です。

<div id="create-a-test-application-for-the-management-api">
  #### Management API 用のテストアプリケーションを作成する
</div>

[Management APIv2 Token](https://auth0.com/docs/api/management/v2/tokens) をリクエストするのが初めての場合は、Management API を呼び出すために使用するアプリケーションを作成して設定する必要があります。

1. [Auth0 Dashboard > アプリケーション > APIs](https://manage.auth0.com/#/apis) に移動し、[Auth0 Management API](https://manage.auth0.com/#/apis/management/authorized-clients) を選択します。
2. **API Explorer** ビューを選択し、**Create & Authorize a Test Application** をクリックします。

これにより新しいアプリケーションが作成され、Management API のすべてのスコープが付与されます。つまり、このアプリケーション用に生成されたトークンで、Management API のすべてのエンドポイントにアクセスできるようになります。

<Card title="ボタンが表示されませんか？">
  このボタンが表示されない場合は、Management API 用に認可されたアプリケーションがすでに少なくとも 1 つあることを意味します。この場合は、既存のアプリケーションのスコープを更新してそれを使用するか、以下の手順で新しいアプリケーションを作成できます。

  1. [Auth0 Dashboard > アプリケーション > アプリケーション](https://manage.auth0.com/#/applications) に移動し、**Create Application** を選択します。
  2. **Machine to Machine アプリケーション** を選択し、続けて **Create** を選択します。
  3. **Select an API** ドロップダウンから、`Auth0 Management API` を選択します。
  4. 必要なスコープを有効にし、**Authorize** を選択します。
  5. **APIs** ビューを選択し、**Auth0 Management API** のトグルを有効にします。
</Card>

<Warning>
  セキュリティ上の理由から、使用するアプリケーションには必要なスコープだけを割り当てることをお勧めします。このケースで必要なスコープは `read:users`、`read:user_idp_tokens` です。必要なスコープは、各エンドポイントごとに [Management API Explorer](https://auth0.com/docs/api/management/v2) に記載されています。
</Warning>

[登録済みの Auth0 Management API](https://manage.auth0.com/#/apis/management/authorized-clients) にスコープを付与または削除するには、[**Machine to Machine アプリケーション** ビュー](https://manage.auth0.com/#/apis/management/authorized-clients) を選択します。

<Frame>
  <img src="https://mintcdn.com/translations/6GE5Z24GDCZehiJ9/docs/images/cdy7uua7fh8z/6nuMjQMrTWhoVqtRwJBQz7/28a0f7c89c696426e273f43bd849b5e5/2025-02-25_11-11-36.png?fit=max&auto=format&n=6GE5Z24GDCZehiJ9&q=85&s=5a948f2961c567c0aa434569c9fabe68" alt="アプリケーションに付与されたスコープを編集する" width="899" height="770" data-path="docs/images/cdy7uua7fh8z/6nuMjQMrTWhoVqtRwJBQz7/28a0f7c89c696426e273f43bd849b5e5/2025-02-25_11-11-36.png" />
</Frame>

<div id="get-the-management-api-token">
  #### Management API トークンを取得する
</div>

これで設定は完了し、Management API トークンを取得する準備が整いました。

1. [登録済みの Auth0 Management API](https://manage.auth0.com/#/apis/management/authorized-clients) で、[**Test** ビュー](https://manage.auth0.com/#/apis/management/test)を選択します。
2. **Application** ドロップダウンからアプリケーションを選択すると、すぐに使えるスニペットにカスタマイズ済みの変数が自動入力されます。
3. スニペットで使用する言語を選択し、それをコピーして実行します。
4. レスポンスから `access_token` プロパティを取得します。これを使用して Management API にアクセスします。

<Card title="スニペットでは何をしていますか？">
  このスニペットは、**OAuth 2.0 クライアントクレデンシャルグラント**を使用して、[Auth0 Authentication API の `/oauth/token` エンドポイント](https://auth0.com/docs/api/authentication#client-credentials) に `POST` リクエストを送信します。これは、machine-to-machine プロセスが API にアクセスするために使用するグラントです。フローの詳細については、[クライアント認証情報フロー](/docs/ja-jp/get-started/authentication-and-authorization-flow/client-credentials-flow)を参照してください。
</Card>

<div id="token-expiration">
  #### トークンの有効期限
</div>

デフォルトでは、取得したトークンは 24 時間 (86,400 秒) で失効します。これを変更するには、次の手順に従います。

1. [Auth0 Dashboard > アプリケーション > APIs](https://manage.auth0.com/#/apis) に移動し、[Auth0 Management API](https://manage.auth0.com/#/apis/management/authorized-clients) を選択します。
2. **設定**ビューを選択し、**Token Expiration (Seconds)** フィールドで新しい値を入力して、**Save** をクリックします。設定できる最大値は 2,592,000 秒 (30 日) ですが、デフォルト値のままにしておくことをお勧めします。

次回生成するトークンには、更新後の有効期限が適用されます。

<Warning>
  これらのトークンは**取り消せません**。リスクを最小限に抑えるため、短期間で失効するトークンを発行し、各アプリケーションには必要なスコープのみを付与することをお勧めします。本番環境では、古いトークンの有効期限が切れた際に新しいトークンを取得するシンプルな CLI を構成できます。
</Warning>

<div id="step-2-get-the-full-user-profile">
  ### ステップ 2: 完全なユーザープロファイルを取得する
</div>

ユーザーのプロファイルを取得するには、前のセクションで抽出した アクセストークン を使って、Management API の [Get a User endpoint](https://auth0.com/docs/api/management/v2#!/Users/get_users_by_id) を呼び出します。

<AuthCodeGroup>
  ```bash cURL theme={null}
  curl --request GET \
    --url 'https://{yourDomain}/api/v2/users/%7BuserId%7D' \
    --header 'authorization: Bearer {yourAccessToken}'
  ```

  ```csharp C# theme={null}
  var client = new RestClient("https://{yourDomain}/api/v2/users/%7BuserId%7D");
  var request = new RestRequest(Method.GET);
  request.AddHeader("authorization", "Bearer {yourAccessToken}");
  IRestResponse response = client.Execute(request);
  ```

  ```go Go theme={null}
  package main

  import (
  	"fmt"
  	"net/http"
  	"io/ioutil"
  )

  func main() {

  	url := "https://{yourDomain}/api/v2/users/%7BuserId%7D"

  	req, _ := http.NewRequest("GET", url, nil)

  	req.Header.Add("authorization", "Bearer {yourAccessToken}")

  	res, _ := http.DefaultClient.Do(req)

  	defer res.Body.Close()
  	body, _ := ioutil.ReadAll(res.Body)

  	fmt.Println(res)
  	fmt.Println(string(body))

  }
  ```

  ```java Java theme={null}
  HttpResponse<String> response = Unirest.get("https://{yourDomain}/api/v2/users/%7BuserId%7D")
    .header("authorization", "Bearer {yourAccessToken}")
    .asString();
  ```

  ```javascript Node.JS theme={null}
  var axios = require("axios").default;

  var options = {
    method: 'GET',
    url: 'https://{yourDomain}/api/v2/users/%7BuserId%7D',
    headers: {authorization: 'Bearer {yourAccessToken}'}
  };

  axios.request(options).then(function (response) {
    console.log(response.data);
  }).catch(function (error) {
    console.error(error);
  });
  ```

  ```php PHP theme={null}
  $curl = curl_init();

  curl_setopt_array($curl, [
    CURLOPT_URL => "https://{yourDomain}/api/v2/users/%7BuserId%7D",
    CURLOPT_RETURNTRANSFER => true,
    CURLOPT_ENCODING => "",
    CURLOPT_MAXREDIRS => 10,
    CURLOPT_TIMEOUT => 30,
    CURLOPT_HTTP_VERSION => CURL_HTTP_VERSION_1_1,
    CURLOPT_CUSTOMREQUEST => "GET",
    CURLOPT_HTTPHEADER => [
      "authorization: Bearer {yourAccessToken}"
    ],
  ]);

  $response = curl_exec($curl);
  $err = curl_error($curl);

  curl_close($curl);

  if ($err) {
    echo "cURL Error #:" . $err;
  } else {
    echo $response;
  }
  ```

  ```python Python theme={null}
  import http.client

  conn = http.client.HTTPSConnection("")

  headers = { 'authorization': "Bearer {yourAccessToken}" }

  conn.request("GET", "/{yourDomain}/api/v2/users/%7BuserId%7D", headers=headers)

  res = conn.getresponse()
  data = res.read()

  print(data.decode("utf-8"))
  ```

  ```ruby Ruby theme={null}
  require 'uri'
  require 'net/http'
  require 'openssl'

  url = URI("https://{yourDomain}/api/v2/users/%7BuserId%7D")

  http = Net::HTTP.new(url.host, url.port)
  http.use_ssl = true
  http.verify_mode = OpenSSL::SSL::VERIFY_PEER

  request = Net::HTTP::Get.new(url)
  request["authorization"] = 'Bearer {yourAccessToken}'

  response = http.request(request)
  puts response.read_body
  ```
</AuthCodeGroup>

以下の値を置き換えてください。

* `{userId}`: IdP の API を呼び出す対象ユーザーの ID。
* `{yourAccessToken}`: 前のセクションで抽出した アクセストークン。

<Card title="ユーザー ID はどこで確認できますか？">
  - テスト目的であれば、[Auth0 Dashboard > User Management > Users](https://manage.auth0.com/#/users) でユーザー ID を確認できます。対象のユーザーを見つけて、**user\_id** フィールドの値をコピーしてください。

  - 実装では、[ID トークン](/docs/ja-jp/secure/tokens/id-tokens) の `sub` claim からユーザー ID を抽出するか、Authentication API の [/userinfo endpoint](https://auth0.com/docs/api/authentication#get-user-info) を呼び出して、レスポンスの `user_id` プロパティから抽出できます。
</Card>

<div id="step-3-extract-the-idp-access-token">
  ### ステップ 3: IdP のアクセストークンを抽出する
</div>

IdP の API 呼び出しに使用されるアクセストークンは、ユーザーの `identities` 配列内にある `user.identities[0].access_token` で確認できます。

<Callout icon="file-lines" color="#0EA5E9" iconType="regular">
  一部の IDプロバイダー では、Auth0 はリフレッシュトークンも保存します。これを使用すると、IdP 用の新しいアクセストークンを取得できます。これは、BitBucket、Google (OAuth 2.0)、OAuth 2.0、SharePoint、Azure AD で利用できます。詳しくは、[IDプロバイダーのアクセストークン](/docs/ja-jp/secure/tokens/access-tokens/identity-provider-access-tokens) を参照してください。
</Callout>

ほとんどの場合、ユーザーが持つアイデンティティは 1 つだけですが、異なる複数の接続を通じて複数回サインインしており、[アカウントリンク](/docs/ja-jp/manage-users/user-accounts/user-account-linking/link-user-accounts) を使用している場合は、複数あることがあります。

このサンプルレスポンスでは、ユーザーのアイデンティティは `google-oauth2` の 1 つだけであることがわかります。

```json lines expandable theme={null}
{
  "email": "john.doe@test.com",
  "email_verified": true,
  "name": "John Doe",
  "given_name": "John",
  "family_name": "Doe",
  "picture": "https://myavatar/photo.jpg",
  "gender": "male",
  "locale": "en",
  "updated_at": "2017-03-15T07:14:32.451Z",
  "user_id": "google-oauth2|111199914890750704174",
  "nickname": "john.doe",
  "identities": [
    {
      "provider": "google-oauth2",
      "access_token": "ya29.GlsPBCS6ahokDlgCYnVLnDKNE71HBXPEzNhAPoKJLAGKDSe1De3_xclahNcdZXoU-26hCpa8h6240TV86dtaEQ4ZWoeeZduHDq_yeu9QyQqUr--S9B2CR9YJrLTD",
      "expires_in": 3599,
      "user_id": "111199914890750704174",
      "connection": "google-oauth2",
      "isSocial": true
    }
  ],
  "created_at": "2017-03-15T07:13:41.134Z",
  "last_ip": "127.0.0.1",
  "last_login": "2017-03-15T07:14:32.451Z",
  "logins_count": 99
}
```

これで、IdP の API を呼び出す準備が整いました。具体的な手順については、IdP のドキュメントを参照してください。

<Warning>
  IdP のトークンをクライアントサイドのアプリケーションに公開しないでください。アプリケーションがパブリックな場合は、この記事の[フロントエンドのセクション](#from-the-frontend)を参照してください。
</Warning>

<Callout icon="file-lines" color="#0EA5E9" iconType="regular">
  アイデンティティプロバイダーのアクセストークンに対して特定のスコープ/権限をリクエストする方法について詳しくは、[Identity Provider の API を呼び出すためにスコープ/権限を追加する](/docs/ja-jp/authenticate/identity-providers/adding-scopes-for-an-external-idp)を参照してください。
</Callout>

<div id="from-the-frontend">
  ## フロントエンドから
</div>

パブリックアプリケーション (SPA、Nativeデスクトップアプリ、またはモバイルアプリ) を扱っている場合は、こちらを参照してください。

フロントエンドアプリで IdP API を呼び出す場合、その手順はバックエンドの場合とは異なります。フロントエンドアプリは、**資格情報を安全に保持できない**パブリックアプリケーションだからです。SPA のコードは閲覧や改変が可能で、Native アプリやモバイルアプリは逆コンパイルや解析ができるため、シークレットキーやパスワードのような機密情報を安全に保持できるものとして信頼することはできません。

具体的には、バックエンドの手順の最初のステップで `/oauth/token` を呼び出す際に使用する Machine to Machine Application の **<Tooltip tip="Client Secret: クライアント（アプリケーション）が認可サーバーで認証するために使用するSecret。これはクライアントと認可サーバーだけが知っているべきものであり、推測できないよう十分にランダムでなければなりません。" cta="用語集を見る" href="/docs/ja-jp/glossary?term=Client+Secret">Client Secret</Tooltip>** を、安全に保持できません。

その代わり、バックエンド用のプロキシを構築し、それを API としてアプリケーションに公開する必要があります。

<div id="build-a-proxy">
  ### プロキシを構築する
</div>

まず、この記事の[バックエンドのセクション](#from-the-backend)に記載されている手順を実装するプロセスをバックエンドに構築し、それを API としてアプリケーションに公開します。

同じバックエンドプロセスから IdP の API を呼び出すため、アクセストークンがパブリックアプリケーションに公開されることはありません。

次に、パブリックアプリケーションから [Proof Key for Code Exchange (PKCE) を使用した認可コードフロー](/docs/ja-jp/get-started/authentication-and-authorization-flow/authorization-code-flow-with-pkce)を使って、プロキシ API を呼び出します。

<Card title="方法を見る">
  まだこれを実装したことがない場合は、[API を使用するシングルページアプリケーション (SPA) ](/docs/ja-jp/get-started/architecture-scenarios/spa-api)のアーキテクチャシナリオが参考になるかもしれません。扱っているのは別のシナリオですが、Auth0 の設定方法、SPA から API を呼び出す方法、API のバリデーションを実装する方法を説明しています。[Angular 2](https://github.com/auth0-samples/auth0-pnp-exampleco-timesheets/tree/master/timesheets-spa/angular) と [Node.js](https://github.com/auth0-samples/auth0-pnp-exampleco-timesheets/tree/master/timesheets-api/node) を使用したサンプルも含まれています。

  また、[API を使用するモバイルアプリケーション](/docs/ja-jp/get-started/architecture-scenarios/mobile-api)のバリエーションも提供しています (サンプルでは [Android](https://github.com/auth0-samples/auth0-pnp-exampleco-timesheets/tree/master/timesheets-mobile/android) と [Node.js](https://github.com/auth0-samples/auth0-pnp-exampleco-timesheets/tree/master/timesheets-api/node) を使用しています) 。
</Card>