💡 ULASAN & REFERENSI • DIPERBARUI: 25 October 2026 • REDAKSI AZWINN

SSI Directives: Panduan Lengkap Server Side Includes

SSI Directives adalah instruksi berbasis teks yang disematkan ke dalam dokumen HTML untuk diproses oleh server web sebelum dikirimkan ke peramban pengguna. Instruksi ini menggunakan mekanisme Server Side Includes (SSI), sebuah fitur bawaan server seperti Apache dan Nginx yang memungkinkan penyisipan konten eksternal, pemanggilan variabel server, dan eksekusi skrip ringan tanpa memerlukan bahasa pemrograman backend yang kompleks seperti PHP atau Python.

Penggunaan utama SSI meliputi penyisipan komponen halaman yang berulang (seperti header, footer, atau menu navigasi), menampilkan tanggal dan waktu terkini, serta menyertakan hasil dari eksekusi program luar. Directives ini ditulis dalam format komentar HTML khusus dengan awalan <!--# dan diakhiri dengan -->, sehingga tetap aman dan tidak merusak tampilan visual halaman jika dilihat secara lokal.

Daftar Perintah SSI Directives Utama

Server web mengenali beberapa perintah inti (command) dalam SSI. Setiap perintah menggunakan atribut tertentu untuk mendefinisikan perilakunya di dalam dokumen.

Perintah (Command) Atribut Umum Fungsi Utama
include file, virtual Menyisipkan konten file lain (seperti header atau footer) ke dalam dokumen saat ini.
echo var, encoding Menampilkan nilai dari variabel server yang aktif (misalnya tanggal atau alamat IP klien).
set var, value Membuat atau menetapkan nilai baru pada variabel kustom yang ditentukan pengguna.
flastmod file, virtual Menampilkan tanggal dan waktu modifikasi terakhir dari file yang ditentukan.
fsize file, virtual Menampilkan ukuran file dalam byte, kilobyte, atau megabyte.
exec cmd, cgi Menjalankan perintah cgi atau skrip sistem eksternal (memerlukan konfigurasi keamanan khusus).

Contoh Implementasi Kode SSI

Berikut adalah contoh penggunaan beberapa SSI directives dalam sebuah file HTML standar:

<!--#config timefmt="%A, %d %B %Y" -->
<p>Hari ini adalah: <!--#echo var="DATE_LOCAL" --></p>

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

<main>
    <h1>Selamat Datang di Situs Kami</h1>
    <p>Halaman ini terakhir diperbarui pada: <!--#flastmod file="index.shtml" --></p>
</main>

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

Atribut Path: file vs virtual

Saat menggunakan perintah include, flastmod, atau fsize, terdapat dua jenis atribut path yang harus dibedakan:

  • virtual: Menggunakan jalur URL relatif terhadap dokumen root server (misalnya /images/banner.jpg). Ini adalah metode yang paling sering direkomendasikan karena lebih fleksibel.
  • file: Menggunakan jalur relatif terhadap direktori tempat file saat ini berada (misalnya ../templates/nav.html). Penggunaan atribut ini dibatasi demi keamanan agar tidak keluar dari direktori yang diizinkan.

Konfigurasi Server untuk SSI

Agar server web membaca dan memproses SSI directives, ekstensi file biasanya harus diubah dari .html menjadi .shtml (Server Side HTML), atau Anda harus mengonfigurasi server untuk memparsing file .html standar (meskipun berdampak pada performa karena setiap file harus dipindai).

Konfigurasi pada Apache (.htaccess)

Tambahkan baris berikut ke dalam file .htaccess di direktori root situs Anda untuk mengaktifkan SSI:

AddType text/html .shtml
AddHandler server-parsed .shtml
Options +Includes

Konfigurasi pada Nginx

Di dalam blok server file konfigurasi Nginx, tambahkan direktif ssi:

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

    location / {
        ssi on;
        ssi_types text/html;
    }
}

Praktik Keamanan Penggunaan SSI

Walaupun berguna untuk menjaga keringkasan kode, SSI menyimpan risiko keamanan jika tidak dikelola dengan benar, terutama pada perintah exec yang dapat mengeksekusi perintah sistem operasi secara langsung. Selalu nonaktifkan perintah exec di lingkungan produksi kecuali benar-benar dibutuhkan, dan batasi akses tulis pada file yang dapat disertakan untuk mencegah kerentanan injeksi kode oleh pihak yang tidak berwenang.

🔍 Orang Lain Juga Mencari Ini