はじめに

以前は各プロジェクトのコンテナの構成に jwilder/nginx-proxy を使用して開発中のコンテナにアクセスしていましたが、開発で動作させるコンテナも増えてきたのでもっと簡単にリバースプロキシが構築できないかと色々探していました。

調べる中でNginx Proxy Managerが GUI で管理できて使いやすそうだったので、使い方の記録も兼ねて記事にしました。

環境

• OS：Ubuntu 24.04
• Docker：27.5.1
• Docker Compose：2.32.4

Nginx Proxy Manager（NPM）の機能

基本的な機能です。

• SSL/TLS 証明書の自動取得・更新（Let’s Encrypt と連携）
• カスタム SSL 証明書のアップロード・管理（自己証明書も可能）
• カスタム Nginx 設定の追加
• アクセス制限（IP 制限、Basic 認証）
• リダイレクト設定
• ストリーム（TCP/UDP）プロキシ
• WebSocket プロキシ対応

その他の高度な設定は公式ドキュメントを参照して下さい。

使い方

クイックセットアップを参照すればかなり簡単に動作させることができます。

今回は公式ドキュメントのベスト・プラクティスを参考にしつつ、設定を加えて構築しました。

# 外部ネットワークの定義
networks:
  nginx-proxy-manager-network:
    # 既存の外部ネットワークを使用
    external: true

# サービス定義
services:
  nginx-proxy-manager:
    image: 'jc21/nginx-proxy-manager:2.12.6' # 公式のNginx Proxy Managerイメージ
    container_name: nginx-proxy-manager-prod # コンテナ名
    ports:
      - '80:80' # 公開HTTPポート - 外部からのHTTPリクエストを受信
      - '443:443' # 公開HTTPSポート - 外部からのHTTPSリクエストを受信
      - '${ADMIN_PORT:-81}:81' # 管理Webポート - 管理画面へのアクセス用
    env_file:
      - .env # 環境変数ファイルの読み込み
    environment:
      - TZ=Asia/Tokyo
    volumes:
      - ./nginx-proxy-manager-data:/data # アプリケーションデータをホストにマウント
      - ./nginx-proxy-manager-ssl:/etc/letsencrypt # SSL証明書をホストにマウント
    networks:
      - nginx-proxy-manager-network # 指定されたネットワークに接続

設定の内容を解説します。

ネットワークの設定

networks:
  nginx-proxy-manager-network:
    external: true

Best Practice: Use a Docker networkにも記述されていますが、NPM で使用するプライベートなネットワークを指定します。

コンテナを起動する前に、以下のコマンドでネットワークを作成します。

docker network create nginx-proxy-manager-network

NPM で管理したいコンテナのdocker-compose.ymlにはこのネットワークに所属するように設定します。

そして、external: trueとすることで、新しいネットワークを作成するのではなく、すでに存在している同名のネットワーク（この場合は nginx-proxy-manager-network）を探して利用するように指示します。

特に何も指定しないと通常はプロジェクト名_defaultを自動で作成し、そこにコンテナを接続してしまいます。

またserviceにもネットワークの設定を記述します。

networks:
  - nginx-proxy-manager-network

使用するイメージ

image: 'jc21/nginx-proxy-manager:2.12.6'

現在のLatestも2.12.6ですがバージョンを指定しておきます。

その他の使用できるバージョンはDocker Hubなども参照して下さい。

公開ポート

外部から受け付ける通信のポートを設定します。

管理画面にアクセスする際のポートは、デフォルトだと81です。必要に応じて.envファイルで指定するようにします。

今回は.envファイルを使用します。docker-compose.ymlファイルと同階層に.envファイルを配置します。

ports:
  - '80:80'
  - '443:443'
  - '${ADMIN_PORT:-81}:81'
env_file:
  - .env

# Nginx Proxy Manager 環境変数設定
# ポート設定
ADMIN_PORT=xxx

ボリューム

設定やユーザー情報、SSL 証明書のファイルなどをホスト側に保存します。

volumes:
  - ./nginx-proxy-manager-data:/data
  - ./nginx-proxy-manager-ssl:/etc/letsencrypt

保存先のフォルダも作成します。

mkdir nginx-proxy-manager-ssl nginx-proxy-manager-data

空のディレクトリを git で追跡したい場合は以下のように空ファイルを配置して.gitignoreで管理します。

touch nginx-proxy-manager-data/.gitkeep
touch nginx-proxy-manager-ssl/.gitkeep

# .gitignoreファイル
nginx-proxy-manager-data/**
!nginx-proxy-manager-data/.gitkeep

nginx-proxy-manager-ssl/**
!nginx-proxy-manager-ssl/.gitkeep

準備ができたらコンテナを起動します。

docker compose up -d

初回起動時

正常に起動したことが確認できたら、ブラウザから管理画面にアクセスします（http://localhost:81もしくはhttp://サーバのIP:81）

初回起動時は以下のアカウントでログインして新しくユーザー情報を設定します。

Email: admin@example.com
Password: changeme

アカウント設定後、ダッシュボード画面に遷移します。

転送先のホストの設定

ここではローカルドメインでアクセスした際に、どのコンテナに転送するのか設定します。

設定を実施する前にhostsファイルにローカルドメインを記述しておきます。

# hostsファイルの場所
# Windows: C:\\Windows\System32\drivers\etc\hosts
# MacOS: /etc/hosts

127.0.0.1 hn-pgtech.local
# サーバーIP(例 192.168.10.10) hn-pgtech.local

今回はこのブログを開発するための Docker コンテナにアクセスできるように設定します。

プロキシホストの追加

ダッシュボードの “Proxy Hosts” → “Add Proxy Host” をクリック

今回は以下のように設定しました。

Domain Namesには先程hostsファイルに指定したローカルドメインを指定します。

Schemeは http と https が選択できますが、通常 http で OK です。これは外部からアクセスする際の通信が https になるわけではなく、プロキシ → バックエンド間の通信プロトコルを設定する内容です。（参考）

Forward Hostname/IPではコンテナ名を指定します。

Forward Portは今回はgatsby developで開発サーバが起動した際のデフォルトポートを指定しています。通常の Web サーバであれば 80 番を指定してください。

その他のオプションの内容です。開発環境では特に設定しなくても動作します。

ここまでの設定で、開発サーバを起動してhttp://hn-pgtech.local/にアクセスすればページが表示されるようになります。

自己証明書の適用

NPM では Let’s Encrypt を簡単に適用することができますが、ローカル開発環境では自己証明書を適用して HTTPS でアクセスすることができます。

Windows であればGitBashをインストールして以下のコマンドを実行して自己証明書を作成します。ファイルはC:\Users\[user]フォルダ直下に作成されます。

openssl req -x509 -nodes -days 365 -newkey rsa:2048 \
  -keyout hn-pgtech.key \
  -out hn-pgtech.crt \
  -subj "//C=JP\ST=Tokyo\L=Tokyo\O=Development\CN=hn-pgtech.local" \
  -addext "subjectAltName=DNS:hn-pgtech.local,DNS:*.hn-pgtech.local,DNS:localhost"

作成した証明書を管理画面より適用します。

Name には管理しやすい名前を指定します。その他のファイルは先程のコマンドで出力されたファイルを指定します。

登録した証明書を選択します。

Force SSLは HTTP でアクセスしてきたユーザーを自動的に HTTPS へリダイレクト（301/302）する設定です。

HTTP/2 Supportは HTTP/2 プロトコルを有効化する設定です。今回はこの設定も ON にしました。

このままではブラウザで https でアクセスした際に警告が表示されるので、証明書を PC にインポートします。

インポート方法はこちらの記事を参考にしてください。

証明書を PC にインポートしたら一旦再起動を実施してください。

その後、https://hn-pgtech.local/でアクセスして警告が消えているはずです。

参考記事

• 【Nginx Proxy Manager】まだ Nginx や Let’s Encrypt の設定を CUI で頑張ってるの？
• Nginx Proxy Manager を使って、リバースプロキシを GUI 管理
• SSL 自己署名証明書の警告(保護されていない通信,セキュリティ保護なし)を非表示化する