↓ Skip to main content
BisaCloud Docs
  1. Posts/

Implementasi Content Security Policy (CSP)

·3 mins·
Devops Devops Apache Nginx
Table of Contents

Content Security Policy (CSP) adalah header HTTP yang digunakan untuk meningkatkan keamanan situs web dengan membatasi sumber daya (resource) yang boleh dimuat oleh browser. Mekanisme ini membantu mencegah serangan seperti Cross-Site Scripting (XSS), Clickjacking, dan berbagai bentuk code injection lainnya.

CSP bekerja dengan cara mengirimkan sekumpulan direktif (aturan) melalui header HTTP atau tag <meta>. Browser kemudian memvalidasi setiap resource yang dimuat. Jika ada konten yang tidak sesuai dengan aturan CSP, browser akan memblokirnya dan menampilkan error atau laporan pelanggaran.

Direktif CSP
#

Beberapa direktif yang umum digunakan antara lain:

  1. default-src Aturan default untuk berbagai resource seperti script, gambar, CSS, font, AJAX, dan lainnya. Contoh: default-src 'self' cdn.example.com;

  2. script-src Mengatur sumber yang diperbolehkan untuk JavaScript. Contoh: script-src 'self' js.example.com;

  3. connect-src Mengatur sumber untuk koneksi seperti AJAX, WebSocket, dan EventSource. Contoh: connect-src 'self';

  4. sandbox Mengaktifkan sandbox untuk iframe, sehingga membatasi kemampuan seperti menjalankan script atau membuka pop-up. Contoh: sandbox allow-forms allow-scripts;

  5. report-uri (deprecated) Menentukan endpoint untuk menerima laporan pelanggaran CSP. Digantikan oleh report-to pada CSP Level 3.

  6. child-src Menentukan sumber untuk worker, iframe, dan konten ter-embed lainnya. Contoh: child-src 'self';

  7. form-action Mengatur tujuan (action) yang diizinkan untuk form HTML.

  8. frame-ancestors Menentukan siapa saja yang boleh men-embed halaman Anda (berguna untuk mencegah clickjacking). Contoh: frame-ancestors 'none';

Nilai Sumber (Source List)
#

Beberapa nilai yang dapat digunakan dalam direktif CSP:

  • 'self': Mengizinkan resource dari domain sendiri.
  • 'none': Tidak ada sumber yang diperbolehkan.
  • *.example.com: Mengizinkan resource dari semua subdomain example.com.
  • https:: Mengizinkan resource hanya melalui protokol HTTPS.
  • 'unsafe-inline' / 'unsafe-eval': Mengizinkan script inline dan fungsi evaluasi dinamis (tidak direkomendasikan).
  • Hash / Nonce: Membatasi script inline dengan hash (sha256, sha384, sha512) atau nonce acak untuk keamanan lebih tinggi.

Strategi Deployment CSP
#

  1. Mulai dengan Report-Only Gunakan header Content-Security-Policy-Report-Only untuk menguji aturan CSP tanpa memblokir konten secara langsung.

  2. Gunakan Endpoint Pelaporan Manfaatkan report-to (atau report-uri untuk kompatibilitas lama) agar pelanggaran CSP dikirim ke server Anda untuk dianalisis.

  3. Hindari Direktif Berbahaya Jika memungkinkan, hindari penggunaan 'unsafe-inline' dan 'unsafe-eval' untuk menjaga tingkat keamanan tetap tinggi.

Contoh Kebijakan CSP
#

Berikut beberapa contoh implementasi CSP untuk berbagai jenis platform:

  1. WordPress
Content-Security-Policy: default-src 'self'; script-src 'self' 'unsafe-inline' 'unsafe-eval' https:; style-src 'self' 'unsafe-inline' https:; img-src 'self' data: https:; font-src 'self' https: data:; connect-src 'self' https:; frame-ancestors 'self'; base-uri 'self'; form-action 'self'; upgrade-insecure-requests;
  1. Laravel
Content-Security-Policy: default-src 'self'; script-src 'self' 'unsafe-inline' 'unsafe-eval'; style-src 'self' 'unsafe-inline'; img-src 'self' data: https:; font-src 'self' https:; connect-src 'self' https:; frame-ancestors 'self'; base-uri 'self'; form-action 'self'; upgrade-insecure-requests;
  1. Static Pages
Content-Security-Policy: default-src 'self'; script-src 'self'; style-src 'self' 'unsafe-inline'; img-src 'self' data: https:; font-src 'self' https:; connect-src 'self'; frame-ancestors 'none'; base-uri 'self'; form-action 'self';

Konfigurasi Server
#

Konfigurasi CSP di Apache
#

  1. Buka file konfigurasi Apache (misalnya /etc/apache2/sites-available/000-default.conf atau .htaccess).

  2. Pastikan modul mod_headers aktif:

    sudo a2enmod headers

  3. Tambahkan baris berikut ke dalam blok <VirtualHost> atau file .htaccess:

    Header set Content-Security-Policy "default-src 'self'; script-src 'self'; style-src 'self'; img-src 'self' data:;"

  4. Restart Apache:

    sudo systemctl restart apache2

Konfigurasi CSP di Nginx
#

  1. Buka file konfigurasi Nginx (misalnya /etc/nginx/sites-available/default).

  2. Tambahkan baris berikut ke dalam blok server:

    add_header Content-Security-Policy "default-src 'self'; script-src 'self'; style-src 'self'; img-src 'self' data:;" always;

  3. Periksa konfigurasi:

    sudo nginx -t

  4. Restart Nginx:

    sudo systemctl restart nginx

Catatan:

  • CSP bukan satu-satunya lapisan keamanan, jadi tetap gunakan fitur keamanan lainnya seperti HTTPS, HSTS, Secure & HttpOnly Cookies, dan sanitasi input.
  • Selalu uji aturan CSP menggunakan mode Report-Only sebelum menerapkannya di lingkungan produksi.
  • Perbarui aturan CSP secara berkala sesuai kebutuhan situs dan perubahan fitur.

Related