1. ホーム /
  2. Blog /
  3. Server /
  4. [nginx]docker-compose でnginxのコンテナを立ち上げる（静的ページ)
Server

[nginx]docker-compose でnginxのコンテナを立ち上げる（静的ページ)

  • 2024.09.29
  • by ShinyaTomozumi
  • 0

今回は企業様の紹介サイトを作成しました。
WordPressは使わず1ページ内にコンテンツを乗せるシンプルなものでしたので、Astroを使って作成しました。
そのページを公開するためにnginxを使ってコンテナを立ち上げます。

0. 環境

  • Docker 27.2.0
  • Docker Compose v2.29.2-desktop.2
  • nginx 1.27.1

1. ディレクトリ構成

/
├── .docker/
│   ├── logs/ # ログファイルを見えるようにする
│   │   └── example.com # ドメインごとにログファイルを設定
│   ├── nginx/
│   │   ├── conf.d/ # サーバ名とルートディレクトリを設定
│   │   │   └── example.com.conf
│   │   ├── Dockerfile
│   │   └── nginx.conf
└── docker-compose.yml

2. Dockerfile の記述

Dockerfile には単純にnginxのコンテナを立ち上げて日本語の時間に設定しています。

  • Dockerfile
FROM nginx:latest

# コンテナの時間を日本時間に設定
RUN apt-get install -y tzdata && \
    ln -sf /usr/share/zoneinfo/Asia/Tokyo /etc/localtime
RUN service nginx start

3. nginx.conf の記述

nginx.conf の設定は以下となります。
一旦は基本的に動作するような感じです。

  • nginx.conf
pid        /var/run/nginx.pid;
worker_processes  auto;

events {
    worker_connections  2048;
}

http {
    include       /etc/nginx/mime.types;
    default_type  application/octet-stream;

    keepalive_timeout  65;
    sendfile        on;

    # UTF-8を使用する
    charset UTF-8;

    # サーバ名を非表示にする
    server_tokens off;

    # アップロード可能なファイルサイズの上限を設定
    client_body_buffer_size 10M;
    client_max_body_size 10M;

    # バッファサイズの設定
    proxy_buffer_size 64k;
    proxy_buffers 100 64k;
    proxy_busy_buffers_size 128k;

    # gzip圧縮の設定
    gzip                on;
    gzip_http_version   1.0;
    gzip_types          text/plain text/css text/javascript application/javascript application/x-javascript application/x-httpd-php application/json application/font-sfnt application/font-woff image/x-icon;
    
    # ログファイルの設定
    log_format  main  '$remote_addr - $remote_user [$time_local] "$request" ' 
                      '$status $body_bytes_sent "$http_referer" ' 
                      '"$http_user_agent" "$http_x_forwarded_for"'; 
    access_log /var/log/nginx/access.log main;
    error_log  /var/log/nginx/error.log info;

    # include
    include /etc/nginx/conf.d/*.conf;
}

詳細な設定は調整するとして「worker_connections」は以下のコマンドで確認しながら設定していきます。

ulimit -n

「worker_processes」は一旦は「auto」にしておいていいですが、調整する場合は以下のコマンドで確認しながら設定していきます。

grep processor /proc/cpuinfo | wc -l

4. example.com.conf の記述

example.com.conf にはサーバ名とルートディレクトリを設定します。
サブドメインなどを使う場合を想定して各ドメインごとにファイルを作成していくことになります。

  • example.com.conf
server {
    listen 80;
    server_name example.com;

    root /var/www/html;
    index index.html;
}

5. docker-compose.yml の記述

docker-compose.yml にはnginxのコンテナを立ち上げるための設定を記述します。
ここでもログファイルをサブドメインごとに設定してわかるようにしております。

  • docker-compose.yml
services:
  web:
    container_name: web
    build:
        context: .
        dockerfile: .docker/nginx/Dockerfile
    ports:
      - "8080:80"
    volumes:
      - ./src/html:/usr/share/nginx/html
      - ./.docker/nginx/conf.d:/etc/nginx/conf.d
      - ./.docker/nginx/nginx.conf:/etc/nginx/nginx.conf
      - ./.docker/logs/example.co.jp:/var/log/nginx

6. コンテナの立ち上げ

docker-compose.yml があるディレクトリで以下のコマンドを実行します。

docker-compose up -d

7. ブラウザで確認

ブラウザで http://localhost:8080 にアクセスして確認します。
今回は静的ページのみの公開となりますが、PHPを使用する場合等についてはまた別途記載します。