EPGStationを外から見たいのでnginx + oauth2-proxyでGoogleアカウント認証

はじめに

皆さんDTV ¹ ってやってますか？
昨年コロナで帰省もできず暇だったのTVTestの環境からMirakurun + EPGStation環境へと移行し非常に快適に使わせてもらってます。私の使い方としては業務終了後に運動（散歩）のお供に低ビットレートにした実質ラジオ代わりの垂れ流しです。
要するにLAN内からのアクセスではなくWANからアクセスさせてます。ただ両方ともリバースプロキシや認証機能は敢えて提供せずVPNやnginx等を利用者が用意することになっています。
そこでnginxをWANへと公開し認証としてGoogleアカウント認証させたという話です。
（現状ではBASIC認証してるんですが割とアカウントの手打ちが面倒…）

前提

以下の点は記載しません。
・nginx導入
　→DDNSにてドメイン設定済み、サーバー証明書発行済み
・GCP側のOAuth設定

また今回の構成はこんな感じです。

oauth2-proxyの設定

oauth2-proxyの導入と設定

今回はoauth2_proxyではなくoauth2-proxy²を利用します。
Raspberry PiなのでARM用バイナリになります。
解答時にエラー吐きますが問題無いらしいです。

oauth2-proxyの取得.

wget https://github.com/oauth2-proxy/oauth2-proxy/releases/download/v7.1.3/oauth2-proxy-v7.1.3.linux-armv6.tar.gz
tar xf oauth2-proxy-v7.1.3.linux-armv6.tar.gz
sudo cp oauth2-proxy-v7.1.3.linux-armv6/oauth2-proxy /usr/local/bin/

設定ファイルのサンプルというか項目はこちらです。
oauth2-proxy.cfg.example
その中からコメントアウトし実際に今回設定した内容です。

oauth2-proxy.cfg

sudo vi /usr/local/etc/oauth2-proxy.cfg

--中身--
http_address = "127.0.0.1:4180"

client_id = "hogehoge"
client_secret = "hogehoge"
provider = "google"
cookie_secret = "hogehoge"
authenticated_emails_file = "/usr/local/etc/emails"
------

sudo vi /usr/local/etc/emails
--中身--
[e-mail]
------

client_id, client_secretはIdP（googleやgithub）から取得して下さい。
cookie_secretは乱数生成や適当な文字列をセットすれば良いようです。無い場合はエラーとなりました。
また、authenticated_emails_fileで個別のメールアドレスを認証できます。
oauth2-proxy.cfgを確認したい場合、/usr/local/bin/oauth2-proxy --config=/usr/local/etc/oauth2-proxy.cfg としてsystemctlに設定前に起動確認しても良いです。

systemctlの設定

サービス化する設定です。これもサンプルがあります。
oauth2-proxy.service.example

oauth2_proxy.service

sudo vi /etc/systemd/system/oauth2_proxy.service

--中身--
[Unit]
Description=oauth2-proxy daemon service
After=syslog.target network.target

[Service]
# www-data group and user need to be created before using these lines
User=www-data
Group=www-data

ExecStart=/usr/local/sbin/oauth2-proxy --config=/usr/local/etc/oauth2-proxy.cfg
ExecReload=/bin/kill -HUP $MAINPID
KillMode=process
Restart=always
[Install]
WantedBy=multi-user.target
------

sudo systemctl enable oauth2_proxy
sudo systemctl restart oauth2_proxy

（oauth2_proxyとoauth2-proxy混じってますが動いてます。よく分かりません）
設定ファイルに不備がなければ起動しているはずです。
確認コマンドはss -atnで4180番ポートでサービス稼働を確認できます。
もし動いていない場合、sudo journalctl -f -u oauth2_proxyでsystemctlのログを確認できます。

nginxの設定

nginx設定

うちの環境だとsudo vi /etc/nginx/sites-enabled/defaultに設定ファイルがあります。

nginxの設定.

location /oauth2/ {
                proxy_pass http://localhost:4180;
                proxy_set_header Host $host;
                proxy_set_header X-Real-IP $remote_addr;
                proxy_set_header X-Scheme $scheme;
                proxy_set_header X-Auth-Request-Redirect $request_uri;
        }
        location = /oauth2/auth {
                proxy_pass http://localhost:4180;
                proxy_set_header Host $host;
                proxy_set_header X-Real-IP: $remote_addr;
                proxy_set_header X-Scheme $scheme;
                proxy_set_header Content-Length "";
                proxy_pass_request_body off;
        }

location / {
                auth_request /oauth2/auth;
                error_page 401 = /oauth2/sign_in;

                # pass information via X-User and X-Email headers to backend,
                # requires running with --set-xauthrequest flag
                auth_request_set $user   $upstream_http_x_auth_request_user;
                auth_request_set $email  $upstream_http_x_auth_request_email;
                proxy_set_header X-User  $user;
                proxy_set_header X-Email $email;

                # if you enabled --pass-access-token, this will pass the token to the backend
                auth_request_set $token  $upstream_http_x_auth_request_access_token;
                proxy_set_header X-Access-Token $token;

                # if you enabled --cookie-refresh, this is needed for it to work with auth_request
                auth_request_set $auth_cookie $upstream_http_set_cookie;
                add_header Set-Cookie $auth_cookie;

                # When using the --set-authorization-header flag, some provider's cookies can exceed the 4kb
                # limit and so the OAuth2 Proxy splits these into multiple parts.
                # Nginx normally only copies the first `Set-Cookie` header from the auth_request to the response,
                # so if your cookies are larger than 4kb, you will need to extract additional cookies manually.
                auth_request_set $auth_cookie_name_upstream_1 $upstream_cookie_auth_cookie_name_1;

                # Extract the Cookie attributes from the first Set-Cookie header and append them
                # to the second part ($upstream_cookie_* variables only contain the raw cookie content)
                if ($auth_cookie ~* "(; .*)") {
                        set $auth_cookie_name_0 $auth_cookie;
                        set $auth_cookie_name_1 "auth_cookie_name_1=$auth_cookie_name_upstream_1$1";
                }

                # Send both Set-Cookie headers now if there was a second part
                if ($auth_cookie_name_upstream_1) {
                        add_header Set-Cookie $auth_cookie_name_0;
                        add_header Set-Cookie $auth_cookie_name_1;
                }

                proxy_pass http://192.168.0.9:8888/;
                # or "root /path/to/site;" or "fastcgi_pass ..." etc
        }

proxy_passにて認証を掛けたいページを設定してあげます。
設定ファイルを再読み込み sudo systemctl reload nginx
これで認証側とリバースプロキシ両方の設定完了です。

動作確認

WAN側からアクセスします。LAN内からのアクセスでも認証ページは表示出来ますがOAuthの設定でリダイレクト先をドメインに設定しているのでLAN内だと多分ちゃんと動きません。
（プライベートなDNS立ててLAN内でもドメインでアクセス出来るようにすればいけそうですが…）
　
許可したアカウントでログインするとちゃんとEPGStationが表示されました。

不許可のGoogleアカウントでのログインテストです。

多分これで完成です。

まとめ

• EPGStationを外から見たいので認証機能を導入
• nginx+oauth2-proxyでGoogleアカウントによる認証を実現

参考文献

• NginxとOAuth2 ProxyでWebアプリに認証をつける ³
• oauth2_proxy と Auth0 を用いた Nginx のお手軽 OAuth 化 ⁴
• 認証機能のないアプリケーションでOAuth2認証を提供する - OAuth2 Proxy 編⁵

1. ここでは録画サーバーなどの意味で利用。TVTest, Mirakurun, EPGstationなど ↩

2. https://github.com/oauth2-proxy/oauth2-proxy ↩

3. https://ebith.hatenablog.jp/entry/2020/05/10/002345 ↩

4. https://mikan.github.io/2018/05/23/enable-oauth-to-your-nginx-by-oauth2-proxy-and-auth0/ ↩

5. https://tech-blog.yayoi-kk.co.jp/entry/2019/11/18/150000 ↩