Mengelola File Static dan Media di NGINX

calendar_today
schedule 3 min read

Berikut adalah artikel tentang mengelola file static dan media di NGINX dengan tone bahasa gaul:

Mengelola File Static dan Media di NGINX

Halo teman-teman! Kali ini kita bakal bahas gimana caranya mengelola file static dan media di NGINX. Buat yang belum tau, NGINX tuh web server yang keren banget, bisa nge-handle banyak request dengan cepat dan efisien. Nah, file static tuh kayak CSS, JavaScript, gambar, dan lain-lain yang gak berubah-ubah. Sedangkan file media tuh kayak video, audio, atau file upload-an user. Yuk, kita langsung aja ke intinya!

1. Konfigurasi NGINX untuk File Static

Pertama-tama, kita perlu ngasih tau NGINX di mana lokasi file static kita. Biasanya, file static disimpen di folder /static atau /assets. Nah, di NGINX, kita bisa nge-set lokasi ini dengan mudah.

code
server {
    listen 80;
    server_name example.com;

    location /static/ {
        alias /path/to/your/static/files/;
        expires 30d;
    }
}

Penjelasan:

  • location /static/: Artinya, NGINX bakal nge-handle semua request yang dimulai dengan /static/.
  • alias /path/to/your/static/files/: Ini adalah path ke folder tempat file static kita disimpen.
  • expires 30d: Ini buat ngasih tau browser buat nyimpen file static di cache selama 30 hari. Jadi, kalo ada request yang sama, browser gak perlu download ulang.

2. Konfigurasi NGINX untuk File Media

Sekarang, kita lanjut ke file media. File media biasanya disimpen di folder /media. Konfigurasinya mirip kayak file static, cuma beda di lokasi aja.

code
server {
    listen 80;
    server_name example.com;

    location /media/ {
        alias /path/to/your/media/files/;
        expires 30d;
    }
}

Penjelasan:

  • location /media/: NGINX bakal nge-handle semua request yang dimulai dengan /media/.
  • alias /path/to/your/media/files/: Ini adalah path ke folder tempat file media kita disimpen.
  • expires 30d: Sama kayak file static, biar browser nyimpen file media di cache selama 30 hari.

3. Optimasi Performa

Biar makin kenceng, kita bisa nge-optimasi performa NGINX dengan beberapa cara:

  • Gzip Compression: Buat ngecilin ukuran file yang dikirim ke browser.
  • Cache-Control: Buat ngatur gimana caranya browser nyimpen cache.

Contoh konfigurasi Gzip:

code
gzip on;
gzip_types text/plain text/css application/json application/javascript text/xml application/xml application/xml+rss text/javascript;
gzip_min_length 1000;
gzip_proxied any;
gzip_comp_level 6;
gzip_buffers 16 8k;
gzip_http_version 1.1;

Penjelasan:

  • gzip on;: Nyalain Gzip.
  • gzip_types: Tipe file yang bakal di-compress.
  • gzip_min_length: Ukuran minimal file yang bakal di-compress.
  • gzip_proxied: Kapan file bakal di-compress.
  • gzip_comp_level: Level compression (1-9).
  • gzip_buffers: Buffer yang dipake buat compression.
  • gzip_http_version: Versi HTTP yang dipake.

4. Handling File Upload

Kalo kita punya fitur upload file, kita perlu nge-set client_max_body_size biar NGINX bisa nge-handle file yang gede-gede.

code
server {
    listen 80;
    server_name example.com;

    client_max_body_size 100M;

    location /media/ {
        alias /path/to/your/media/files/;
        expires 30d;
    }
}

Penjelasan:

  • client_max_body_size 100M;: Artinya, NGINX bakal nerima file upload sampe 100MB. Kalo lebih dari itu, bakal error.

5. Security

Terakhir, jangan lupa buat nge-secure file static dan media kita. Misalnya, kita bisa nge-block akses ke file tertentu atau nge-set permission yang bener.

Contoh:

code
location /media/private/ {
    internal;
}

Penjelasan:

  • internal;: Artinya, folder /media/private/ cuma bisa diakses dari dalam server aja, gak bisa dari luar.

Nah, itu dia beberapa tips buat mengelola file static dan media di NGINX. Semoga bermanfaat ya! Kalo ada pertanyaan, tinggal komen aja di bawah. Peace out! ✌️

A

Written by Ariful

Full-stack engineer obsessed with web performance.