next.config.ts
const nextConfig: NextConfig = {
// デプロイ先を 変更する場合は設定します
distDir: '.next__deploy',
// standaloneモードにする
output:'standalone',
};
nginxの設定ファイルディレクトリへ移動します
cd /etc/opt/kusanagi/nginx/conf.d
ファイル <ホスト名>.lamp.inc に設定を追加します。
vi <ホスト名>.lamp.inc
http://localhost:3098 に接続する場合の設定
### for Next.js ↓
location @nextserver {
proxy_pass http://localhost:3098;
proxy_http_version 1.1;
# WebSocket対応
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection 'upgrade';
proxy_cache_bypass $http_upgrade;
# ホスト情報
proxy_set_header Host $host;
# クライアント情報
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
# プロトコル情報
proxy_set_header X-Forwarded-Proto $scheme;
# タイムアウト設定(オプション)
proxy_connect_timeout 60s;
proxy_send_timeout 60s;
proxy_read_timeout 60s;
}
# 1 . favicon専用の設定
location ~ ^/favicon\.ico {
proxy_pass http://localhost:3099;
proxy_http_version 1.1;
proxy_set_header Host $host;
}
# 2 . SVGアイコン用の設定
location ~ ^/icon\.svg {
proxy_pass http://localhost:3099;
proxy_http_version 1.1;
proxy_set_header Host $host;
}
# 3 . Apple Touch Icon用の設定
location ~ ^/apple-icon\.png {
proxy_pass http://localhost:3099;
proxy_http_version 1.1;
proxy_set_header Host $host;
}
# Let's Encrypt ACME Challenge用
location ^~ /.well-known/acme-challenge/ {
root /var/www/html; # または /usr/share/nginx/html
try_files $uri =404;
allow all;
}
# Next.jsの_nextファイル(ビルド済み静的ファイル含む)
location ^~ /_next {
try_files $uri @nextserver;
expires 365d;
add_header Cache-Control 'public';
}
# publicディレクトリの静的ファイル(画像、フォント、その他のアセット)
location ~* ^/(.*\.(png|jpg|jpeg|gif|ico|svg|webp|woff|woff2|ttf|eot|pdf|zip|css|js))$ {
# publicディレクトリから直接配信を試行
try_files /public/$1 $uri @nextserver;
expires 1y;
add_header Cache-Control 'public, immutable';
}
location / {
try_files $uri $uri.html /index.html @nextserver;
}
### for Next.js ↑
nginxのリスタート
nginx -t
nginx -s reload
Cloudflareのダッシュボードで以下を実行してください:
Caching → Configuration → Purge Everything