Header keamanan untuk Vue.js
medium7 titik pemeriksaan
Header keamanan adalah instruksi yang dikirim server pada setiap respons. Bila tidak ada, browser tidak bisa menegakkan proteksi yang sebenarnya dibutuhkan aplikasi.
Yang harus ada di Vue.js
- Content-Security-Policy dengan nonce per request, tanpa 'unsafe-inline' pada script-src
- Strict-Transport-Security dengan max-age minimal satu tahun dan includeSubDomains
- X-Frame-Options: DENY atau CSP frame-ancestors 'none'
- X-Content-Type-Options: nosniff pada setiap respons
- Referrer-Policy: strict-origin-when-cross-origin
- Permissions-Policy mematikan kamera, mikrofon, dan geolokasi
- Cross-Origin-Opener-Policy: same-origin
Cara memperbaiki
- 1Set header di middleware atau edge agar aset statis dan halaman error juga mendapatkannya
- 2Buat nonce CSP per request dan salurkan ke HTML lewat API header framework
- 3Jangan hanya menguji halaman depan: periksa HTML, API, dan respons 404
Konteks Vue.js
Progressive JavaScript framework for interactive interfaces.
v-html bypasses escaping. Devtools and source maps should be disabled in production builds.