[Auth0] Auth0でシンプルに始めるOIDC & OAuth 2.0入門

[Auth0] Auth0でシンプルに始めるOIDC & OAuth 2.0入門

Clock Icon2025.05.10

こんにちは。

ゲームソリューション部/業務効率化ソリューション部の西川です。

今回は、認証認可の基礎に立ち返り、Auth0を使ったOIDCとOAuth 2.0の実装についてご紹介します。

はじめに

Webアプリケーションやモバイルアプリの開発で、ユーザー認証と認可は避けて通れない課題です。
私自身、OIDC(OpenID Connect)やOAuth 2.0の仕様を理解するのに苦労した経験があります。

「認可フローって、本当に理解できているのかな?」と不安を抱えることもあるかと思います。
そんな経験から、今回はOIDCとOAuth 2.0の基本的な仕組みと、Auth0を使った簡単な実装方法について解説していきます。

OIDCとOAuth 2.0の基本

OAuth 2.0の仕組み

OAuth 2.0は、ユーザーがアプリに対して、APIなどのリソースへのアクセス権を安全に委任するための仕組みです。例えば、Googleカレンダーにアクセスするアプリを作る場合、ユーザーはGoogleアカウントのパスワードを直接アプリに教える必要はありません。

認可の流れは以下のような流れです。

  1. アプリがクライアントIDとリダイレクトURIを使って認可をリクエスト
  2. ユーザーが同意すると認可コードが発行される
  3. アプリは認可コードを使ってアクセストークンを取得

OpenID Connect(OIDC)とは

OIDCはOAuth 2.0の拡張で、ユーザーの認証情報を安全にやり取りできるようにしたものです。アクセストークンに加えてIDトークンが発行され、ユーザーの情報を確認できます。

認証・認可フローの種類

実際の開発でよく使われるフローを紹介します。
どのフローをどういうユースケースで使い分けるのか考える必要があるも難しいポイントかと思います。

Authorization Code Flow(基本形)

Authorization Code Flowは、OAuth 2.0で最も一般的に使用されるフローです。
ユーザーがアプリにアクセスすると、認可サーバー(Auth0)にリダイレクトされ、ログインと認可の同意を行います。
認可コードを受け取ったアプリは、それをアクセストークンと交換します。

このフローは以下のような特徴があります。

  • セキュアなトークンの受け渡し
  • リフレッシュトークンの利用が可能
  • サーバーサイドでの実装が推奨

Authorization Code Flow with PKCE

PKCE(Proof Key for Code Exchange)は、モバイルアプリやSPAなど、クライアントシークレットを安全に保管できない環境での認証を強化する仕組みです。

通常のAuthorization Code Flowに加えて、以下のようなセキュリティ強化が行われます。

  1. アプリがランダムなcode_verifierを生成
  2. code_verifierからcode_challengeを生成
  3. 認可リクエスト時にcode_challengeを送信
  4. アクセストークン要求時にcode_verifierを送信して検証

この仕組みにより、以下のことが可能になります。

  • 認可コードの傍受攻撃を防止
  • クライアントの真正性を確認
  • より安全な認証フローを実現

Client Credentials Flow

マシン間の認証に使用されるフローです。
ユーザーを介さず、アプリケーション同士が直接認証を行います。

主な特徴は以下の通りです。

  • バックエンドサービス間の連携に適している
  • ユーザー認証が不要なAPIアクセスに使用
  • クライアントシークレットによる認証

Auth0でこれらのフローを実装する場合

上記認可フローを自力で実装するのはなかなかの手間がかかってしまうかと思います。
では、Auth0ではどのように実装されるのか見てみます。

サンプルアプリの導入

下記でサンプルアプリのダウンロードから起動の方法などを紹介しています。
https://dev.classmethod.jp/articles/auth0-react-tutorial/

また、アプリケーションを作る際にアプリケーションの種別を選択することで、それぞれに適したフローが自動的に適用されるようになっています。

スクリーンショット 2025-04-22 22.40.45

SPAアプリケーションで試してみた

SPA(Single Page Application)は、ブラウザ上で動作するシングルページのアプリケーションです。
Auth0では、デフォルトでPKCE対応のAuthorization Code Flowを使用して実装します。

主な特徴:

  • クライアントシークレットを安全に保管できない環境での認証
  • フロントエンドでのトークン管理
  • リフレッシュトークンの利用が制限される

上記記事を参考にサンプルアプリを起動して、ログイン時のネットワークを見てみました。
以下の通り、PKCEを利用したAuthorization Code Flowのフローを実現していることがわかると思います。

スクリーンショット 2025-04-22 15.41.20

このように、サンプルアプリレベルであれば、数分もあれば最適なOIDC/OAuthフローを簡単に導入することが可能です。

Auth0を使うメリット

Auth0を導入する際の主なメリットを紹介します。

  1. 複雑なOIDC/OAuthフローをラップしてくれる

    • セキュリティ面での考慮が不要
    • 実装がシンプルになる
  2. セキュリティベストプラクティスに対応

    • PKCE
    • CORS
    • トークン失効
      など、最新のセキュリティ対策が組み込まれている
  3. 管理が簡単

    • ダッシュボードで設定変更が可能
    • ユーザー管理も一元化できる
  4. 比較的カスタマイズ性が高い

    • RulesやActionsで独自のロジックを追加可能
    • 様々な認証プロバイダーと連携できる

さいごに

「認証・認可は今のままで問題ない」と思っている方も、一度立ち止まって見直してみることをお勧めします。
セキュリティやユーザー体験の観点から、改善の余地があるかもしれません。

OIDCやOAuth 2.0は確かに複雑ですが、Auth0を使えば驚くほど簡単に実装できます。

さらに詳しく知りたい方は、以下のリソースなども参考にしてください。

https://auth0.com/docs
https://auth0.com/docs/get-started/authentication-and-authorization-flow/authorization-code-flow

また、私たちは毎月Auth0に関する導入実践ウェビナーを開催しています。
Auth0の仕組みや使い方など学びたい方は、ぜひご参加ください。

https://classmethod.jp/partner/auth0

認証・認可の導入に迷っている方は、まずはAuth0で体験してみてください。

Share this article

facebook logohatena logotwitter logo

© Classmethod, Inc. All rights reserved.