Cara menggunakan Generator Config Nginx
- Pilih skenario: Situs statis, SPA (semua route kembali ke
index.html), Reverse proxy ke aplikasi di port tertentu, atau PHP-FPM. - Isi domain, document root atau alamat upstream, lalu pilih cara menangani
www. - Centang fitur tambahan: HTTPS dengan path Let’s Encrypt, gzip, caching aset statis, security headers, WebSockets, dan rate limiting.
- Salin config, uji dengan
nginx -t, lalu reload Nginx.
Apa yang ditambahkan setiap opsi
| Opsi | Direktif |
|---|---|
| HTTPS | Server port 80 yang melakukan redirect dengan 301, listen 443 ssl, path sertifikat Certbot, dan location ACME challenge |
| SPA | try_files $uri $uri/ /index.html; agar route sisi klien tidak mengembalikan 404 |
| Reverse proxy | proxy_pass beserta header Host, X-Real-IP, X-Forwarded-For, dan X-Forwarded-Proto |
| WebSockets | proxy_http_version 1.1 dengan header Upgrade / Connection |
| gzip | Kompresi untuk teks, JSON, JS, CSS, SVG, dan font |
| Caching statis | Cache-Control: immutable selama satu tahun untuk aset ber-hash, cache singkat untuk HTML |
| Security headers | X-Content-Type-Options, Referrer-Policy, X-Frame-Options, Permissions-Policy |
| Rate limit | limit_req_zone (di konteks http) dan limit_req dengan burst |
Mendapatkan sertifikat
Buat config dengan HTTPS dimatikan dulu, reload Nginx, lalu jalankan sudo certbot certonly --webroot -w /var/www/letsencrypt -d example.com -d www.example.com — atau cukup sudo certbot --nginx. Setelah itu nyalakan HTTPS, reload, dan cek hasilnya dengan SSL Checker, Redirect Checker, dan Security Headers Checker.
Kesalahan umum
- Titik koma yang terlewat — setiap direktif harus diakhiri dengan
;.nginx -takan menunjukkan baris yang tepat. - Pewarisan add_header —
add_headerdi dalamlocationakan menimpa semua header dari level server. Generator sudah mengulang security headers jika diperlukan. - Garis miring di akhir proxy_pass —
proxy_pass http://app/;menghapus prefix location, sedangkanproxy_pass http://app;mempertahankannya. - MIME type yang salah — font atau
.webmanifestdisajikan sebagaiapplication/octet-stream; cek dengan MIME Type Lookup.
Jalan di Docker? Gabungkan dengan Docker Compose Generator.
Juga dicari sebagai: config nginx reverse proxy, konfigurasi nginx spa, server block nginx, redirect https nginx, websocket proxy nginx, konfigurasi nginx php-fpm, redirect www nginx.
Tool yang cocok dipakai bersama Generator Config Nginx
- Generator Apache VirtualHost — Dapatkan konfigurasi Apache virtual host lengkap untuk domainmu: situs statis, WordPress, PHP-FPM, atau reverse proxy ke aplikasi Node atau Python.
- Generator Caddyfile — Caddy mengurus sertifikat HTTPS secara otomatis, jadi kamu cukup mendeskripsikan situsmu.
- Validator YAML — Tempel file Docker Compose, manifest Kubernetes, workflow GitHub Actions, atau YAML apa pun untuk menemukan error, menangkap jebakan umum, dan mendapatkan versi yang sudah terformat rapi.
- Generator YAML Kubernetes — Isi nama aplikasi, image, dan port, lalu dapatkan YAML Kubernetes siap production: Deployment dengan probe, batas resource, dan security context yang diperketat, plus Service, Ingress dengan TLS, ConfigMap, Secret, dan HorizontalPodAutoscaler yang kamu centang — dalam satu file yang siap untuk kubectl apply.
Pertanyaan yang sering diajukan
Bagaimana cara menguji config Nginx sebelum reload?
Jalankan sudo nginx -t. Perintah ini mengecek sintaks dan path file, lalu menampilkan baris dari setiap error. Lakukan reload (sudo systemctl reload nginx) hanya jika muncul tulisan “syntax is ok” dan “test is successful”.
Bagaimana cara membuat aplikasi React atau Vue tetap berfungsi saat halaman di-refresh?
Gunakan skenario SPA. Skenario ini menambahkan try_files $uri $uri/ /index.html; sehingga setiap path yang tidak dikenal dijawab dengan index.html dan router sisi klien yang mengambil alih.
Di mana limit_req_zone harus ditaruh?
limit_req_zone harus berada di konteks http (misalnya di /etc/nginx/nginx.conf atau di bagian atas file yang di-include di sana), bukan di dalam server. Generator menaruhnya di bagian atas file dengan komentar; file di sites-enabled secara default sudah di-include dalam http.
Perlukah mengaktifkan HSTS?
Aktifkan hanya jika HTTPS sudah berfungsi di domain dan semua subdomain yang kamu sertakan. Browser mengingat HSTS selama periode max-age, sehingga jika sertifikat rusak, situs bisa tidak dapat diakses. Mulailah dengan max-age yang pendek.
Bisakah saya memasang Generator Config Nginx sebagai aplikasi web dan memakainya offline?
Bisa. Generator Config Nginx adalah aplikasi web (PWA) yang bisa dipasang. Pemasangannya lewat browser kamu, bukan diunduh dari toko aplikasi. Klik Pasang aplikasi di bagian atas halaman ini di Chrome atau Edge (Windows, macOS, Linux, ChromeOS) atau di Android. Di iPhone dan iPad, gunakan Bagikan → Tambahkan ke Layar Utama, dan di Safari 17+ pada Mac, gunakan File → Tambahkan ke Dock. Setelah itu, aplikasi akan terbuka di jendelanya sendiri dengan ikonnya sendiri. Karena berjalan sepenuhnya di browser kamu, aplikasi ini tetap bisa dipakai offline. Firefox di desktop tidak bisa memasang aplikasi web. Cara memasang aplikasi.