【OSSでWiki構築】第4回（Google OAuth編）Outline認証設定

1. はじめに

この記事は、Docker Composeで構築したローカルのOutline環境に、Googleアカウントを利用したログイン機能（OAuth 2.0）を実装するまでの一連の手順をまとめたものです。

前提条件:

• ローカルHTTPS環境が構築済みであること。

第2回、第3回の環境構築編はこちら。
【OSSでWiki構築】第2回：(環境構築編)Docker ComposeでOutlineとDBを連携させる
【OSSでWiki構築】第3回：環境構築編 トラブルシューティング

ステップ1: Google Cloud Platformでの認証情報作成

まず、Google APIを利用して、私たちのOutlineアプリ専用の「クライアントID」と「クライアントシークレット」を発行します。

1-1. プロジェクトの作成

1. GoogleアカウントでGoogle Cloud Platformコンソールにログインします。
2. 新しいプロジェクトを作成します。（例：Outline Wiki Project）

1-2. OAuth同意画面の設定

1. 左側のメニューから「APIとサービス」 > 「OAuth同意画面」を選択します。
2. 以下の情報を入力します。
   • アプリ名: Outline Wiki
   • ユーザーサポートメール: あなたのメールアドレス
   • 対象: 「外部」を選択
   • デベロッパーの連絡先情報: あなたのメールアドレス
3. 「保存して次へ」をクリックし、「スコープ」「テストユーザー」の画面は何もせず次に進みます。
4. 「テストユーザー」の画面で、+ ADD USERS をクリックし、このOutlineにログインを許可したいGoogleアカウントのメールアドレス（まずは自分自身のアカウント）を追加します。

1-3. OAuthクライアントIDの発行

1. 左側のメニューから「APIとサービス」 > 「認証情報」を選択します。

2. 「+ 認証情報を作成」をクリックし、「OAuthクライアントID」を選択します。

3. 以下の通り設定します。

   • アプリケーションの種類: ウェブ アプリケーション

   • 名前: Outline Web Client

   • 承認済みのリダイレクトURI: + URIを追加 をクリックし、以下のURIを入力します。

     https://localhost/auth/oidc.callback
     

4. 「作成」ボタンをクリックします。

5. 表示された**「JSONをダウンロード」**ボタンから設定ファイルをダウンロードし、ファイルを開きます。

6. ファイルの中から"client_id"と"client_secret"の値をコピーして、安全な場所に保管しておきます。

ステップ2: Docker Composeの設定更新

次に、取得した認証情報をdocker-compose.ymlに設定し、OutlineにGoogle認証を有効化させます。

2-1. docker-compose.ymlの編集

outlineサービスのenvironmentセクションに、OIDC_で始まるGoogle認証用の設定を追記します。

# ... (caddy, db, redisサービスは変更なし) ...

  outline:
    image: outlinewiki/outline:latest
    restart: unless-stopped
    depends_on:
      - db
      - redis
    environment:
      # --- 既存の設定 ---
      SECRET_KEY: 'あなたが生成したキー'
      UTILS_SECRET: 'あなたが生成したもう一つのキー'
      URL: 'https://localhost'
      DATABASE_URL: 'postgres://outline:StrongPassword@db:5432/outline'
      REDIS_URL: 'redis://redis:6379'
      PGSSLMODE: 'disable'

      # ----- ここから下がGoogle認証用の設定 -----
      # Google Cloudから取得した「クライアントID」をここに貼り付け
      OIDC_CLIENT_ID: 'ここにクライアントIDを貼り付け'
      # Google Cloudから取得した「クライアントシークレット」をここに貼り付け
      OIDC_CLIENT_SECRET: 'ここにクライアントシークレットを貼り付け'

      # Google認証のエンドポイント（このまま変更しない）
      OIDC_AUTH_URI: 'https://accounts.google.com/o/oauth2/v2/auth'
      OIDC_TOKEN_URI: 'https://oauth2.googleapis.com/token'
      OIDC_USERINFO_URI: 'https://openidconnect.googleapis.com/v1/userinfo'

      # ログイン画面に表示されるボタンの名前
      OIDC_DISPLAY_NAME: 'Google'

2-2. コンテナの再起動

設定ファイルを保存したら、ターミナルで以下のコマンドを実行し、設定を反映させます。

docker compose down
docker compose up -d

ステップ3: 動作確認

最後に、実際にGoogleアカウントでログインできるかを確認します。

1. Webブラウザで https://localhost にアクセスします。
2. 「保護されていない通信」などの警告が表示されたら、「詳細設定」などをクリックし、アクセスを許可します。
3. Outlineのログイン画面に「Continue with Google」というボタンが表示されていることを確認します。
4. ボタンをクリックし、「テストユーザー」として登録したGoogleアカウントでログインします。
5. Outlineのワークスペース作成画面、またはメイン画面が表示されれば、設定は成功です！

まとめ

以上の手順で、ローカルのOutline環境に、Googleを利用した安全な認証基盤を確立することができました。redirect_uriの設定など、OAuth認証の基本的な流れを学ぶことができました。

---

J.B.Goode Inc.に所属しています。良ければフォローお願いします！

J.B.Goode Inc.のウェブサイトでは、技術記事の他にも技術ナレッジや日々の気づき等を配信しています。
https://www.jbgoode.jp/

カジュアル面談も実施中です。お気軽にお問い合わせください。
https://www.jbgoode.jp/recruit/