Konfigurasi Nginx SSI (Server Side Includes) Lengkap

Konfigurasi Nginx SSI (Server Side Includes) memungkinkan pengembang web untuk menyisipkan konten eksternal atau file modular (seperti header, footer, atau sidebar) ke dalam sebuah halaman HTML di sisi server sebelum dikirimkan ke peramban pengguna. Fitur ini sangat berguna untuk memelihara situs web statis berskala besar tanpa harus menduplikasi kode berulang kali di setiap halaman.

Untuk mengaktifkan SSI di Nginx, Anda harus mendeklarasikan direktif ssi on; di dalam blok konteks server, lokasi (location), atau http. Selain itu, Anda perlu memastikan tipe MIME yang tepat telah didefinisikan agar Nginx memproses file dengan ekstensi yang diinginkan.

Sintaks Dasar Konfigurasi Nginx SSI

Berikut adalah contoh blok konfigurasi server Nginx standar yang mengaktifkan SSI dan mengatur tipe file yang diproses:

server {
    listen 80;
    server_name contoh.com;
    root /var/www/html;

    # Mengaktifkan SSI secara global di server ini
    ssi on;

    # Opsional: Menentukan tingkat toleransi error SSI
    ssi_silent_errors off;
    ssi_types text/html text/xml application/x-server-parsed-html;

    location / {
        try_files $uri $uri/ =404;
    }

    # Konfigurasi khusus untuk file dengan ekstensi .shtml
    location ~ \.shtml$ {
        ssi on;
        ssi_types text/html;
    }
}

Parameter Penting dalam Konfigurasi Nginx SSI

Nginx menyediakan beberapa direktif khusus untuk mengontrol perilaku SSI guna mengoptimalkan kinerja server dan keamanan aplikasi web Anda.

Direktif NginxNilai DefaultFungsi dan Kegunaan
ssioffMengaktifkan (on) atau menonaktifkan (off) pemrosesan SSI pada blok konfigurasi yang dipilih.
ssi_silent_errorsoffJika disetel ke on, pesan error SSI (seperti [an error occurred while processing this directive]) tidak akan dicetak ke halaman HTML, melainkan hanya dicatat ke dalam log error Nginx.
ssi_typestext/htmlMenentukan tipe MIME tambahan yang akan diproses oleh modul SSI. Secara default hanya memproses text/html.
ssi_value_length256Menentukan panjang maksimum nilai variabel dalam perintah SSI.

Contoh Penggunaan Tag SSI pada Berkas HTML

Setelah SSI diaktifkan di sisi Nginx, Anda dapat menyisipkan file lain menggunakan sintaks komentar HTML khusus SSI. Pastikan file yang disisipkan berada di dalam direktori root web Anda.

<!--# include virtual="/includes/header.html" -->

<main>
    <h1>Selamat Datang di Situs Kami</h1>
    <p>Halaman ini menggunakan Server Side Includes untuk memuat komponen modular.</p>
</main>

<!--# include virtual="/includes/footer.html" -->

Tips Troubleshooting dan Pengamanan Nginx SSI

Penerapan SSI yang tidak tepat dapat menimbulkan celah keamanan atau penurunan performa jika tidak ditangani dengan benar. Perhatikan beberapa poin penting berikut saat mengonfigurasi SSI di lingkungan produksi:

  • Izin Berkas (File Permissions): Pastikan proses worker Nginx (biasanya beroperasi di bawah pengguna www-data atau nginx) memiliki hak akses baca (read permission) ke semua file yang akan disisipkan melalui tag include.
  • Direktori Virtual vs File Path: Gunakan parameter virtual untuk menyisipkan berdasarkan URI internal Nginx (direkomendasikan karena melewati pemrosesan lokasi Nginx), atau gunakan parameter file untuk jalur relatif berbasis sistem file fisik.
  • Cegah Remote File Inclusion (RFI): Secara standar, SSI Nginx hanya mendukung penyisipan file lokal. Jangan pernah mengizinkan parameter eksternal tak tepercaya diteruskan langsung ke dalam tag SSI untuk mencegah potensi kerentanan keamanan injeksi.
  • Dampak Performa: Pemrosesan SSI menambahkan beban CPU tambahan pada server karena Nginx harus membaca dan menggabungkan konten secara dinamis sebelum merespons permintaan. Gunakan sistem caching seperti FastCGI Cache atau Proxy Cache jika situs mengalami lalu lintas tinggi.