Nginx 設定 · 2 min read · Jan 23, 2026

Debian上のnginxでアップロード進行状況を表示する

Debian上のnginxでアップロード進行状況を表示する

このチュートリアルでは、nginxのアップロード進行状況モジュールを使用して、1つまたは複数のファイルをアップロードし、ユーザーにアップロード進行状況バーを表示する方法を示します。これは、たとえば、ユーザーが大きなファイルをアップロードする場合に、バックグラウンドで何かが進行中であることを知るために役立ちます。

私はこれがあなたにとって機能するという保証はしません!

1 nginx-extrasのインストール

nginxのアップロード進行状況モジュールはデフォルトでは有効になっていません。次のコマンドを実行して、これが有効になっているかどうかを確認できます。

nginx -V

有効になっている場合、出力に–add-module=/tmp/buildd/nginx-1.4.4/debian/modules/nginx-upload-progressのようなものが表示されるはずです。有効になっていない場合は、nginx-extrasパッケージをインストールします。

apt-get install nginx-extras

その後、再度実行します。

nginx -V

アップロード進行状況モジュールが出力に表示されるはずです:

root@server1:/var/www# nginx -V
nginx version: nginx/1.4.4
TLS SNI support enabled
configure arguments: –prefix=/usr/share/nginx –conf-path=/etc/nginx/nginx.conf –error-log-path=/var/log/nginx/error.log –http-client-body-temp-path=/var/lib/nginx/body –http-fastcgi-temp-path=/var/lib/nginx/fastcgi –http-log-path=/var/log/nginx/access.log –http-proxy-temp-path=/var/lib/nginx/proxy –http-scgi-temp-path=/var/lib/nginx/scgi –http-uwsgi-temp-path=/var/lib/nginx/uwsgi –lock-path=/var/lock/nginx.lock –pid-path=/run/nginx.pid –with-pcre-jit –with-debug –with-http_addition_module –with-http_dav_module –with-http_flv_module –with-http_geoip_module –with-http_gzip_static_module –with-http_image_filter_module –with-http_mp4_module –with-http_perl_module –with-http_random_index_module –with-http_realip_module –with-http_secure_link_module –with-http_spdy_module –with-http_stub_status_module –with-http_ssl_module –with-http_sub_module –with-http_xslt_module –with-ipv6 –with-mail –with-mail_ssl_module –add-module=/tmp/buildd/nginx-1.4.4/debian/modules/headers-more-nginx-module –add-module=/tmp/buildd/nginx-1.4.4/debian/modules/nginx-auth-pam –add-module=/tmp/buildd/nginx-1.4.4/debian/modules/nginx-cache-purge –add-module=/tmp/buildd/nginx-1.4.4/debian/modules/nginx-dav-ext-module –add-module=/tmp/buildd/nginx-1.4.4/debian/modules/nginx-development-kit –add-module=/tmp/buildd/nginx-1.4.4/debian/modules/nginx-echo –add-module=/tmp/buildd/nginx-1.4.4/debian/modules/ngx-fancyindex –add-module=/tmp/buildd/nginx-1.4.4/debian/modules/nginx-http-push –add-module=/tmp/buildd/nginx-1.4.4/debian/modules/nginx-lua –add-module=/tmp/buildd/nginx-1.4.4/debian/modules/nginx-upload-progress –add-module=/tmp/buildd/nginx-1.4.4/debian/modules/nginx-upstream-fair –add-module=/tmp/buildd/nginx-1.4.4/debian/modules/ngx_http_substitutions_filter_module
root@server1:/var/www#

モジュールを有効にするには、アップロードを追跡するために使用されるnginx.conf(http {}コンテナ内)に小さなゾーンを作成する必要があります(この例ではゾーンの名前をuploadsとします):

vi /etc/nginx/nginx.conf

| [...] http { [...] # アップロードを追跡するために名前 'uploads' の下に1MBを予約 upload_progress uploads 1m; [...] } [...] |

その後、nginxを再読み込みします:

/etc/init.d/nginx reload

2 Vhostの設定

次に、vhost設定ファイルを開き、server {}コンテナ内に次の内容を追加します(ISPConfigを使用している場合は、ウェブサイトのnginxディレクティブフィールドにこれを追加します):

| [...] client_max_body_size 100M; location = /upload.php { try_files $uri =404; include /etc/nginx/fastcgi_params; fastcgi_pass unix:/var/lib/php5-fpm/web1.sock; fastcgi_index index.php; fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name; fastcgi_intercept_errors on; ## 上記で定義されたゾーンでこのロケーションのアップロードを追跡 ## 60秒のタイムアウトで。 track_uploads uploads 60s; } location ^~ /progress { upload_progress_json_output; report_uploads uploads; } [...] |

私の場合、アップロードを処理するファイル(つまり、HTMLアップロードフォームのaction属性にあるファイル)はupload.phpと呼ばれ、ドキュメントルートにあります。ファイル名が異なる場合は、location = /upload.php {を適宜調整してください。また、ウェブサイトに対して正しいfastcgi_passオプションを使用していることを確認してください(おそらく、ここで使用しているソケットとは異なるソケットを使用するか、ソケットの代わりにTCP接続を使用しています)。

track_uploads行では、1章のupload_progressゾーンの名前(この場合はuploads)を使用することが重要です。

location ^~ /progress {}コンテナは文字通り受け取る必要があり、変更しないでください(well、upload_progressゾーンの名前がuploadsでない場合はreport_uploads行を変更する必要があります)。このロケーションは、ファイルアップロードのステータスをnginxにポーリングするために使用されます。

その後、nginxを再読み込みします(ISPConfigを使用している場合は、再読み込みを自動的に行います):

/etc/init.d/nginx reload

3 アップロードフォームの作成

次に、アップロード中に進行状況ロケーションをポーリングするJavaScriptを含むアップロードフォームが必要です。私のファイルは次のようになります - index.html、upload.htmlなどと名付けて、ドキュメントルートに置いてください:

| nginx アップロード進行状況

'; print '- 最大アップロードサイズ: ' . ini_get('upload_max_filesize'); ?>
0%
|

次に、次のupload.phpをドキュメントルートに置きます:

| "; } } ?> |

upload.phpはアップロードされたファイルをcacheというディレクトリに保存するので、ドキュメントルートにそのディレクトリを作成し、PHPが書き込めるように適切な権限を与えることを忘れないでください。

これで完了です。ブラウザでアップロードフォームのあるファイルを呼び出し、いくつかのファイルをアップロードしてみてください:

4 リンク

Share: X/Twitter LinkedIn

新しい投稿を受信箱で受け取る

スパムはありません。いつでも購読を解除できます。