2021年6月20日日曜日

oauth2-proxy で、静的サイトに後付けでアクセス制限をかけたい

既存の静的サイトに、後付けで以下のようなアクセス制限をかけたい。

site/
    +- index.html       : インデックスページ。誰でも表示できる
    +- user1/           : user1 用ディレクトリ。この中のファイルは user1 しか表示できない
    |   +- profile.html
    +- user2/           : user2 用ディレクトリ。この中のファイルは user2 しか表示できない
        +- profile.html

Keycloak と oauth2-proxy/oauth2-proxy を組み合わせることで、そういったことができそうなので試した。

現状の oauth2-proxy では、パスごとのアクセス権限設定できず、 アップストリーム単位でのアクセス制限しかないようだ。

前述の目的は達成できないが、とりあえず使い方だけ記録しておく。

前提

構築イメージ

+----------+        +-------+
| Keycloak |        | NGINX |
+----------+        +-------+
 ↑ localhost:8080    ^ localhost:8000
+--------------+      |
| OAuth2 Proxy |------+
+--------------+
 ↑ localhost:18080
+---------+
| Browser |
+---------+

Keycloak の準備

docker-compose.yaml の取得

Invoke-WebRequest -OutFile docker-compose.yaml -Uri https://raw.githubusercontent.com/keycloak/keycloak-containers/master/docker-compose-examples/keycloak-postgres.yml

とりあえず今回は管理者情報含めてこのまま使う。

Keycloak コンテナ起動

docker compose up

Realm 追加

  1. http://localhost:8080 へ接続
  2. ログイン
    • Username : admin
    • Password : Pa55w0rd
  3. 左上の Master にマウスオーバーしたときに表示される Add realm を押下
  4. Add realm ページが表示されるので、必要事項を記入して Create ボタン押下
    • Name : MyApp
    • Enabled : ON

OAuth クライアントの追加

  1. Clients -> Create ボタン押下
  2. Add Client ページが表示されるので、必要事項を記入して Save ボタン押下
    • Client ID : oauth2-proxy
    • Client Protocol : openid-connect
    • Root URL : http://localhost:18080
  3. Oauth2-proxy の設定ページが表示されるため、必要な項目を更新して Save ボタン押下
    • Access Type : confidential
  4. Mappers タブ -> Create ボタン押下、必要事項を記入して Save ボタン押下
    • Name: Group Membership
    • Mapper Type: Group Membership
    • Token Claim Name: groups
  5. Installation タブ -> Format Option を Keycloak OIDC JSON に変更 -> 値を控える

ロール・グループ・ユーザーの設定

ロール作成

  1. Roles -> Add Role ボタン押下
  2. Add Role ページが表示されるので、必要事項を記入して Save ボタンを押下
    • Role Name: authorized

グループ作成

  1. Groups -> New ボタン押下
  2. Create group ページが表示されるので、必要事項を記入して Save ボタン押下
    • Name: authorized
  3. Role Mapping タブを開く
    1. Available Roles を選択し、 add selected> ボタン押下。 Assigned Roles に authorized が追加されたことを確認

ユーザー作成

  1. Users -> Add user ボタン押下
  2. Add user ページが表示されるので、必要事項を記入して Save ボタン押下
    • username: mikoto
    • Email: mikoto2000@gmail.com
  3. Credentials タブを開き、パスワード設定を行い Set Password ボタンを押下
    • Password, Password Confirmation を入力
    • Temporary: OFF へ変更
  4. Groups タブを開き、グループ設定を行う
    • Available Groups から authorized を選択し、 join ボタンを押下

NGINX 起動

docker run --name nginx --rm -v "$(pwd)/site:/usr/share/nginx/html" -p "8000:80" nginx

OAuth2 Proxy の準備

実行バイナリのダウンロード

oauth2-proxy V7.1.3 のリリースページ から、 oauth2-proxy-v7.1.3.windows-amd64.tar.gz をダウンロードし、展開する。

展開した oauth2-proxy を oauth2-proxy.exe にリネーム。

$COOKIE_SECRET=$(docker run ruby ruby -rsecurerandom -e'puts SecureRandom.base64(16)')

oauth2-proxy 実行

$CLIENT_SECRET="f2c7ef6b-e955-4ed2-8843-72f0975956f5"
$KEYCLOAK_BASE_URL="http://localhost:8080/auth/realms/MyApp/protocol/openid-connect"
$OAUTH2_PROXY_ADDRESS="http://localhost:18080"
$NGINX_ADDRESS="http://localhost:8000"

./oauth2-proxy --provider="keycloak" `
--client-id="oauth2-proxy" `
--client-secret=${CLIENT_SECRET} `
--login-url="${KEYCLOAK_BASE_URL}/auth" `
--redeem-url="${KEYCLOAK_BASE_URL}/token" `
--profile-url="${KEYCLOAK_BASE_URL}/userinfo" `
--validate-url="${KEYCLOAK_BASE_URL}/userinfo" `
--http-address=${OAUTH2_PROXY_ADDRESS} `
--upstream=${NGINX_ADDRESS} `
--scope="openid" `
--redirect-url="http://localhost:18080/oauth2/callback" `
--email-domain="*" `
--cookie-secret=${COOKIE_SECRET} `
--allowed-group="/authorized"

動作確認

http://localhost:18080/index.html へアクセスすると、 Keycloak のログイン画面が表示される。

ログインすると、 http://localhost:18080/index.html で、 NGINX に配置した index.html が表示される。

以上。

参考資料

Posted by at
Labels: ,

0 件のコメント:

コメントを投稿

登録: コメントの投稿 (Atom)