Anzeige des Upload-Fortschritts mit nginx auf Debian

Anzeige des Upload-Fortschritts mit nginx auf Debian

Dieses Tutorial zeigt, wie man das nginx-Upload-Fortschrittsmodul verwendet, um eine oder mehrere Dateien hochzuladen und eine Upload-Fortschrittsanzeige für den Benutzer anzuzeigen. Dies ist nützlich, wenn Benutzer große Dateien hochladen, damit sie wissen, dass im Hintergrund etwas passiert.

Ich gebe keine Garantie, dass dies bei Ihnen funktioniert!

1 Installation von nginx-extras

Das nginx-Upload-Fortschrittsmodul ist standardmäßig nicht aktiviert. Sie können

nginx -V

ausführen, um zu überprüfen, ob es aktiviert ist - Sie sollten dann etwas sehen wie –add-module=/tmp/buildd/nginx-1.4.4/debian/modules/nginx-upload-progress in der Ausgabe. Wenn es nicht aktiviert ist, installieren Sie das nginx-extras-Paket:

apt-get install nginx-extras

Führen Sie danach erneut aus

nginx -V

• das Upload-Fortschrittsmodul sollte nun in der Ausgabe erscheinen:

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#

Um das Modul zu aktivieren, müssen wir eine kleine Zone in nginx.conf (im http {} Container) erstellen, die verwendet wird, um Uploads zu verfolgen (ich nenne die Zone uploads in diesem Beispiel):

vi /etc/nginx/nginx.conf

| [...] http { [...] # reservieren Sie 1MB unter dem Namen 'uploads', um Uploads zu verfolgen upload_progress uploads 1m; [...] } [...] |

Laden Sie nginx danach neu:

/etc/init.d/nginx reload

2 Konfiguration Ihres Vhosts

Öffnen Sie nun Ihre Vhost-Konfigurationsdatei und fügen Sie Folgendes in den server {} Container ein (wenn Sie ISPConfig verwenden, fügen Sie dies in das nginx-Direktivenfeld der Website ein):

| [...] 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; ## Verfolgen Sie Uploads für diesen Standort in der oben definierten Zone ## mit einem Timeout von 60 Sekunden. track_uploads uploads 60s; } location ^~ /progress { upload_progress_json_output; report_uploads uploads; } [...] |

In meinem Fall heißt die Datei, die die Uploads verarbeitet (d.h. die Datei im action-Attribut des HTML-Upload-Formulars), upload.php und befindet sich im Dokumentenstamm. Wenn Ihre Datei anders benannt ist, passen Sie location = /upload.php { entsprechend an. Stellen Sie auch sicher, dass Sie die richtigen fastcgi_pass-Optionen für Ihre Website verwenden (Sie verwenden wahrscheinlich einen anderen Socket als den, den ich hier verwende, oder Sie verwenden TCP-Verbindungen anstelle von Sockets).

In der Zeile track_uploads ist es wichtig, dass Sie den Namen der upload_progress-Zone aus Kapitel 1 verwenden (uploads in diesem Fall).

Der location ^~ /progress {} Container muss wörtlich genommen werden, was bedeutet, dass Sie ihn nicht ändern sollten (nun, Sie sollten die report_uploads-Zeile ändern, wenn Ihre upload_progress-Zone nicht uploads heißt). Dieser Standort wird verwendet, um nginx nach dem Status der Datei-Uploads abzufragen.

Laden Sie nginx danach neu (es sei denn, Sie verwenden ISPConfig, das das Neuladen für Sie übernimmt):

/etc/init.d/nginx reload

3 Erstellen eines Upload-Formulars

Als Nächstes benötigen wir ein Upload-Formular mit etwas JavaScript, das während der Uploads die Fortschritts-Location abfragt. Meine Datei sieht so aus - benennen Sie sie index.html, upload.html usw. und legen Sie sie in Ihren Dokumentenstamm:

|

Legen Sie als Nächstes die folgende upload.php in Ihren Dokumentenstamm:

| "; } } ?> |

upload.php speichert hochgeladene Dateien in einem Verzeichnis namens cache, also vergessen Sie nicht, dieses Verzeichnis in Ihrem Dokumentenstamm zu erstellen und ihm die richtigen Berechtigungen zu geben, damit PHP darin schreiben kann.

Das war’s. Sie können jetzt die Datei mit dem Upload-Formular in Ihrem Browser aufrufen und versuchen, einige Dateien hochzuladen:

4 Links

• nginx Upload-Fortschrittsmodul: http://wiki.nginx.org/HttpUploadProgressModule
• nginx: http://nginx.org
• Debian: http://www.debian.org