Halaman ini diterjemahkan oleh Cloud Translation API.

Referensi cepat header keamanan

Pelajari lebih lanjut header yang dapat menjaga keamanan situs Anda dan mencari detail terpenting dengan cepat.

Eiji Kitamura

Artur Janc

Maud Nalpas

Artikel ini berisi daftar header keamanan terpenting yang dapat Anda gunakan untuk melindungi situs. Gunakan data ini untuk memahami fitur keamanan berbasis web, mempelajari cara menerapkannya di situs Anda, dan sebagai referensi saat Anda membutuhkan pengingat.

Header keamanan yang direkomendasikan untuk situs yang menangani data pengguna yang sensitif:: Kebijakan Keamanan Konten (CSP); Jenis Tepercaya
Header keamanan yang direkomendasikan untuk semua situs:: X-Content-Type-Options; X-Frame-Options; Cross-Origin Resource Policy (CORP); Cross-Origin Opener Policy (COOP); HTTP Strict Transport Security (HSTS)
Header keamanan untuk situs dengan kemampuan lanjutan:: Cross-Origin Resource Sharing (CORS); Kebijakan Penyemat Lintas Asal (COEP)

Ancaman yang diketahui di web

Sebelum membahas header keamanan, pelajari ancaman yang diketahui di web dan alasan Anda ingin menggunakan header keamanan ini.

Lindungi situs Anda dari kerentanan injeksi

Kerentanan injeksi muncul jika data tidak tepercaya yang diproses oleh aplikasi Anda dapat memengaruhi perilakunya dan, biasanya, menyebabkan eksekusi skrip yang dikontrol penyerang. Kerentanan paling umum yang disebabkan oleh bug injeksi adalah pembuatan skrip lintas situs (XSS) dalam berbagai bentuknya, termasuk XSS yang tercermin, XSS tersimpan, XSS berbasis DOM, dan varian lainnya.

Kerentanan XSS biasanya dapat memberi penyerang akses lengkap ke data pengguna yang diproses oleh aplikasi dan informasi lain yang dihosting dalam asal web yang sama.

Pertahanan tradisional terhadap injeksi mencakup penggunaan sistem template HTML otomatis, menghindari penggunaan API JavaScript berbahaya, dan memproses data pengguna secara tepat dengan menghosting upload file di domain terpisah dan membersihkan HTML yang dikontrol pengguna.

Gunakan Kebijakan Keamanan Konten (CSP) untuk mengontrol skrip mana yang dapat dijalankan oleh aplikasi Anda untuk mengurangi risiko injeksi.
Gunakan Jenis Tepercaya untuk menerapkan sanitasi data yang diteruskan ke JavaScript API berbahaya.
Gunakan X-Content-Type-Options untuk mencegah browser salah menafsirkan jenis MIME resource situs Anda, yang dapat menyebabkan eksekusi skrip.

Pisahkan situs Anda dari situs lain

Keterbukaan web memungkinkan situs berinteraksi satu sama lain dengan cara yang dapat melanggar ekspektasi keamanan aplikasi. Hal ini termasuk membuat permintaan terautentikasi secara tidak terduga atau menyematkan data dari aplikasi lain dalam dokumen penyerang, sehingga penyerang dapat mengubah atau membaca data aplikasi.

Kerentanan umum yang merusak isolasi web meliputi clickjacking, pemalsuan permintaan lintas situs (CSRF), penyertaan skrip lintas situs (XSSI), dan berbagai kebocoran lintas situs.

Gunakan X-Frame-Options untuk mencegah dokumen Anda disematkan oleh situs berbahaya.
Gunakan Cross-Origin Resource Policy (CORP) untuk mencegah resource situs Anda disertakan oleh situs lintas origin.
Gunakan Kebijakan Pembuka Lintas Asal (COOP) untuk melindungi jendela situs Anda dari interaksi oleh situs berbahaya.
Gunakan Cross-Origin Resource Sharing (CORS) untuk mengontrol akses ke resource situs Anda dari dokumen lintas asal.

Post-Spectre Web Development adalah bacaan yang bagus jika Anda tertarik dengan header ini.

Buat situs yang andal dengan aman

Spectre menempatkan data apa pun yang dimuat ke dalam grup konteks penjelajahan yang sama dan berpotensi dapat dibaca meskipun terdapat kebijakan asal yang sama. Browser membatasi fitur yang mungkin mengeksploitasi kerentanan di balik lingkungan khusus yang disebut "isolasi lintas asal". Dengan isolasi lintas asal, Anda dapat menggunakan fitur canggih seperti SharedArrayBuffer.

Gunakan Cross-Origin Embedder Policy (COEP) bersama dengan COOP untuk mengaktifkan isolasi lintas asal.

Mengenkripsi traffic ke situs Anda

Masalah enkripsi muncul ketika aplikasi tidak sepenuhnya mengenkripsi data dalam pengiriman, sehingga memungkinkan penyerang penyadapan untuk mempelajari interaksi pengguna dengan aplikasi.

Enkripsi yang tidak memadai dapat muncul dalam kasus berikut: tidak menggunakan HTTPS, konten campuran, menyetel cookie tanpa atribut Secure (atau awalan __Secure), atau logika validasi CORS longgar.

Gunakan HTTP Strict Transport Security (HSTS) untuk menayangkan konten Anda secara konsisten melalui HTTPS.

Kebijakan Keamanan Konten (CSP)

Pembuatan Skrip Lintas Situs (XSS) adalah serangan ketika kerentanan pada situs memungkinkan skrip berbahaya dimasukkan dan dijalankan.

Content-Security-Policy menyediakan lapisan tambahan untuk memitigasi serangan XSS dengan membatasi skrip yang dapat dijalankan oleh halaman.

Sebaiknya aktifkan CSP ketat menggunakan salah satu pendekatan berikut:

Jika Anda merender halaman HTML di server, gunakan CSP ketat berbasis nonce.
Jika HTML harus ditayangkan secara statis atau di-cache, misalnya jika aplikasi web satu halaman, gunakan CSP ketat berbasis hash.

Contoh penggunaan: CSP berbasis nonce

Content-Security-Policy:
  script-src 'nonce-{RANDOM1}' 'strict-dynamic' https: 'unsafe-inline';
  object-src 'none';
  base-uri 'none';

Cara menggunakan CSP

Penggunaan yang direkomendasikan

1. Menggunakan CSP ketat berbasis nonce {: #nonce-based-csp}

Jika Anda merender halaman HTML di server, gunakan CSP ketat berbasis nonce.

Buat nilai nonce skrip baru untuk setiap permintaan pada sisi server dan tetapkan header berikut:

file konfigurasi server

Content-Security-Policy:
  script-src 'nonce-{RANDOM1}' 'strict-dynamic' https: 'unsafe-inline';
  object-src 'none';
  base-uri 'none';

Dalam HTML, untuk memuat skrip, tetapkan atribut nonce untuk semua tag <script> ke string {RANDOM1} yang sama.

index.html

<script nonce="{RANDOM1}" src="https://example.com/script1.js"></script>
<script nonce="{RANDOM1}">
  // Inline scripts can be used with the <code>nonce</code> attribute.
</script>

Google Foto adalah contoh CSP ketat berbasis nonce yang baik. Gunakan DevTools untuk melihat cara penggunaannya.

2. Menggunakan CSP ketat berbasis hash {: #hash-based-csp}

Jika HTML harus ditayangkan secara statis atau di-cache, misalnya jika Anda membuat aplikasi satu halaman, gunakan CSP ketat berbasis hash.

file konfigurasi server

Content-Security-Policy:
  script-src 'sha256-{HASH1}' 'sha256-{HASH2}' 'strict-dynamic' https: 'unsafe-inline';
  object-src 'none';
  base-uri 'none';

Di HTML, Anda harus menyisipkan skrip agar dapat menerapkan kebijakan berbasis hash, karena sebagian besar browser tidak mendukung skrip eksternal hashing.

index.html

<script>
...// your script1, inlined
</script>
<script>
...// your script2, inlined
</script>

Untuk memuat skrip eksternal, baca "Memuat skrip yang bersumber secara dinamis" di bagian Opsi B: Header Respons CSP Berbasis Hash.

CSP Evaluator adalah alat yang baik untuk mengevaluasi CSP Anda, tetapi sekaligus contoh CSP ketat berbasis nonce yang baik. Gunakan DevTools untuk melihat cara penggunaannya.

Browser yang didukung

* https: adalah pengganti untuk Safari dan unsafe-inline adalah fallback untuk versi browser yang sangat lama. https: dan unsafe-inline tidak membuat kebijakan Anda kurang aman karena akan diabaikan oleh browser yang mendukung strict-dynamic. Baca selengkapnya di Menambahkan penggantian untuk mendukung Safari dan browser lama. * Safari belum mendukung strict-dynamic. Namun, CSP ketat seperti dalam contoh di atas lebih aman daripada CSP yang diizinkan (dan jauh lebih aman daripada tidak ada CSP sama sekali) untuk semua pengguna Anda. Bahkan di Safari, CSP ketat melindungi situs Anda dari beberapa jenis serangan XSS, karena keberadaan CSP melarang pola tertentu yang tidak aman.

Hal-hal lain yang perlu diperhatikan tentang CSP

Perintah frame-ancestors melindungi situs Anda dari pembajakan klik—risiko yang akan muncul jika Anda mengizinkan situs yang tidak tepercaya untuk menyematkan situs Anda. Jika menginginkan solusi yang lebih sederhana, Anda dapat menggunakan X-Frame-Options untuk memblokir pemuatan, tetapi frame-ancestors memberikan konfigurasi lanjutan untuk hanya mengizinkan origin tertentu sebagai penyemat.
Anda mungkin telah menggunakan CSP untuk memastikan bahwa semua resource situs Anda dimuat melalui HTTPS. Hal ini menjadi kurang relevan: saat ini, sebagian besar browser memblokir konten campuran.
Anda juga dapat menetapkan CSP dalam mode laporan saja.
Jika tidak dapat menetapkan CSP sebagai sisi server header, Anda juga dapat menetapkannya sebagai tag meta. Perhatikan bahwa Anda tidak dapat menggunakan mode hanya laporan untuk tag meta (meskipun hal ini dapat berubah).

Selengkapnya

Jenis Tepercaya

XSS berbasis DOM adalah serangan saat data berbahaya diteruskan ke sink yang mendukung eksekusi kode dinamis seperti eval() atau .innerHTML.

Jenis Tepercaya menyediakan alat untuk menulis, meninjau keamanan, dan memelihara aplikasi bebas dari DOM XSS. API ini dapat diaktifkan melalui CSP dan membuat kode JavaScript aman secara default dengan membatasi API web berbahaya agar hanya menerima objek khusus, yaitu Jenis Tepercaya.

Untuk membuat objek ini, Anda dapat menentukan kebijakan keamanan yang dapat digunakan untuk memastikan bahwa aturan keamanan (seperti escaping atau sanitasi) diterapkan secara konsisten sebelum data ditulis ke DOM. Kebijakan ini merupakan satu-satunya tempat dalam kode yang berpotensi memperkenalkan DOM XSS.

Contoh penggunaan

Content-Security-Policy: require-trusted-types-for 'script'

// Feature detection
if (window.trustedTypes && trustedTypes.createPolicy) {
  // Name and create a policy
  const policy = trustedTypes.createPolicy('escapePolicy', {
    createHTML: str => {
      return str.replace(/\</g, '&lt;').replace(/>/g, '&gt;');
    }
  });
}


// Assignment of raw strings is blocked by Trusted Types.
el.innerHTML = &#39;some string&#39;; // This throws an exception.

// Assignment of Trusted Types is accepted safely.
const escaped = policy.createHTML(&#39;&lt;img src=x onerror=alert(1)&gt;&#39;);
el.innerHTML = escaped;  // &#39;&amp;lt;img src=x onerror=alert(1)&amp;gt;&#39;

Cara menggunakan Jenis Tepercaya

Penggunaan yang direkomendasikan

Terapkan Jenis Tepercaya untuk sink DOM berbahaya header CSP dan Jenis Tepercaya:
```
Content-Security-Policy: require-trusted-types-for 'script'
```
Saat ini 'script' adalah satu-satunya nilai yang dapat diterima untuk perintah require-trusted-types-for.

Tentu saja, Anda dapat menggabungkan Trusted Types dengan perintah CSP lainnya:

Menggabungkan CSP berbasis nonce dari contoh di atas dengan Jenis Tepercaya:

Content-Security-Policy:
  script-src &#39;nonce-{RANDOM1}&#39; &#39;strict-dynamic&#39; https: &#39;unsafe-inline&#39;;
  object-src &#39;none&#39;;
  base-uri &#39;none&#39;;
  require-trusted-types-for &#39;script&#39;;


<side class="note"><b>Catatan: </b> Anda dapat membatasi nama kebijakan Jenis Tepercaya yang diizinkan dengan menetapkan perintah <code>trusted-types</code> tambahan (misalnya, <code>trusted-types myPolicy</code>). Namun, ini bukan persyaratan.  </aside>


  
    Menentukan kebijakan
    Kebijakan:
   // Feature detection
if (window.trustedTypes && trustedTypes.createPolicy) {
  // Name and create a policy
  const policy = trustedTypes.createPolicy('escapePolicy', {
    createHTML: str => {
      return str.replace(/\/g, '>');
    }
  });
}

    Catatan:  Anda dapat menentukan kebijakan dengan nama arbitrer kecuali jika Anda membatasi nama kebijakan Jenis Tepercaya yang diizinkan dengan menyetel perintah trusted-types. 
  
  
    Terapkan kebijakan
    Gunakan kebijakan ini saat menulis data ke DOM:
   // Assignment of raw strings are blocked by Trusted Types.
el.innerHTML = &#39;some string&#39;; // This throws an exception.</p>

<p>// Assignment of Trusted Types is accepted safely.
const escaped = policy.createHTML(&#39;<img src="x" onerror="alert(1)">&#39;);
el.innerHTML = escaped;  // &#39;&lt;img src=x onerror=alert(1)&gt;&#39;

    Dengan require-trusted-types-for 'script', menggunakan jenis tepercaya adalah
      persyaratan. Menggunakan DOM API berbahaya dengan string akan menghasilkan error.
  

Browser yang didukung

  
    
    
    
    
  
  
  
    
      
    
  
    
      
    
  
    
      
    
  
    
      
    
  
    
      
    
   

    
    
      
    
    
    
  
Selengkapnya

  Mencegah kerentanan pembuatan skrip lintas situs berbasis DOM dengan Jenis Tepercaya
  CSP: required-trusted-types-for - HTTP |
      MDN
  CSP: jenis tepercaya - HTTP |
      MDN
  Demo Jenis Tepercaya—buka DevTools Inspector dan lihat
    apa yang terjadi



X-Content-Type-Options

Saat dokumen HTML berbahaya ditayangkan dari domain Anda (misalnya, jika gambar yang diupload ke layanan foto berisi markup HTML yang valid), beberapa browser akan memperlakukannya sebagai dokumen aktif dan memungkinkannya mengeksekusi skrip dalam konteks aplikasi, sehingga menyebabkan bug pembuatan skrip lintas situs.

X-Content-Type-Options: nosniff mencegahnya dengan memberi tahu browser bahwa
jenis MIME yang ditetapkan di
header Content-Type untuk respons tertentu sudah benar. Header ini
direkomendasikan untuk semua resource Anda.

Contoh penggunaan
X-Content-Type-Options: nosniff


  
    
    Cara menggunakan X-Content-Type-Options


    
      Penggunaan yang direkomendasikan
X-Content-Type-Options: nosniff direkomendasikan untuk semua resource yang disalurkan dari
  server Anda bersama dengan header Content-Type yang benar.

Contoh header yang dikirim dengan HTML dokumen
X-Content-Type-Options: nosniff
Content-Type: text/html; charset=utf-8

Browser yang didukung

  
    
    
    
    
  
  
  
    
      
    
  
    
      
    
  
    
      
    
   

    
    
      
      

        Dukungan Browser
        
          
  
  
    
      
        
          
          
        
      
    
    
  
  64
  
  
          
  
  
    
      
        
          
          
        
      
    
    
  
  12
  
  
          
  
  
    
      
        
          
          
        
      
    
    
  
  50
  
  
          
  
  
    
      
        
          
          
        
      
    
    
  
  11
  
  
        
        
        Sumber
        
      
    
    
    
  
Selengkapnya

  X-Content-Type-Options - HTTP MDN

    
  


Opsi-Frame-X

Jika situs berbahaya dapat menyematkan situs Anda sebagai iframe, penyerang dapat
memanggil tindakan yang tidak diinginkan oleh pengguna dengan
clickjacking. Selain itu, dalam beberapa
kasus, Serangan jenis
Spectre memberikan
situs berbahaya kesempatan untuk mempelajari isi dokumen tersemat.

X-Frame-Options menunjukkan apakah browser harus diizinkan untuk merender halaman dalam <frame>, <iframe>, <embed>, atau <object>. Semua dokumen direkomendasikan untuk mengirim header ini guna menunjukkan apakah header tersebut diizinkan untuk disematkan oleh dokumen lain atau tidak.

Catatan:  Jika Anda memerlukan kontrol yang lebih terperinci seperti hanya mengizinkan origin tertentu untuk menyematkan dokumen, gunakan perintah CSP frame-ancestors.  

Contoh penggunaan
X-Frame-Options: DENY


  
    
    Cara menggunakan X-Frame-Options


    
      Penggunaan yang direkomendasikan
Semua dokumen yang tidak didesain untuk disematkan harus menggunakan header X-Frame-Options.
Anda dapat mencoba pengaruh konfigurasi berikut terhadap pemuatan iframe di demo
    ini. Ubah menu dropdown
  X-Frame-Options, lalu klik tombol Muat ulang iframe.
Melindungi situs Anda agar tidak disematkan oleh situs lain
Menolak penyematan oleh dokumen lain.

X-Frame-Options: DENY

Melindungi situs Anda agar tidak disematkan oleh situs lintas origin mana pun
Mengizinkan penyematan hanya oleh dokumen dengan origin yang sama.
X-Frame-Options: SAMEORIGIN

 Dokumen dapat disematkan secara default berarti developer web harus secara eksplisit mengirim DENY atau SAMEORIGIN agar berhenti disematkan dan melindungi diri mereka dari serangan side-channel. Tim Chrome mempertimbangkan untuk beralih guna memblokir penyematan dokumen secara default sehingga situs akan aman meskipun situs tidak menetapkan header secara eksplisit. Dalam dunia baru tersebut, dokumen harus secara eksplisit memilih untuk disematkan. 
Browser yang didukung

  
    
    
    
    
  
  
  
    
      
    
  
    
      
    
  
    
      
    
   

    
    
      
      

        Dukungan Browser
        
          
  
  
    
      
        
          
          
        
      
    
    
  
  4
  
  
          
  
  
    
      
        
          
          
        
      
    
    
  
  12
  
  
          
  
  
    
      
        
          
          
        
      
    
    
  
  4
  
  
          
  
  
    
      
        
          
          
        
      
    
    
  
  4
  
  
        
        
        Sumber
        
      
    
    
    
  
Selengkapnya

  X-Frame-Options - HTTP

    
  


Kebijakan Sumber Daya Lintas Asal (CORP)

Penyerang dapat menyematkan resource dari origin lain, misalnya dari situs Anda,
untuk mempelajari informasi tentang resource tersebut dengan mengeksploitasi kebocoran
lintas situs berbasis web.

Cross-Origin-Resource-Policy mengurangi risiko ini dengan menunjukkan kumpulan
situs yang dapat memuatnya. Header mengambil salah satu dari tiga nilai:
same-origin, same-site, dan cross-origin. Semua resource
direkomendasikan untuk mengirimkan header ini guna menunjukkan apakah resource tersebut diizinkan untuk dimuat oleh
situs lain.

Contoh penggunaan
Cross-Origin-Resource-Policy: same-origin


  
    
    Cara menggunakan CORP


    
      Penggunaan yang direkomendasikan
Sebaiknya semua resource ditayangkan dengan salah satu dari tiga header berikut.
Anda dapat mencoba pengaruh konfigurasi berikut terhadap pemuatan resource dalam lingkungan Cross-Origin-Embedder-Policy: require-corp pada demo ini. Ubah menu dropdown Cross-Origin-Resource-Policy, lalu klik tombol Reload the
iframe atau Reload the image untuk melihat efeknya.

Izinkan resource dimuat cross-origin
Sebaiknya layanan seperti CDN menerapkan cross-origin ke resource (karena biasanya dimuat oleh halaman lintas origin), kecuali jika sudah disalurkan melalui CORS yang memiliki efek serupa.

Cross-Origin-Resource-Policy: cross-origin

Batasi resource yang akan dimuat dari same-origin
same-origin harus diterapkan ke resource yang dimaksudkan untuk dimuat hanya
  oleh halaman origin yang sama. Anda harus menerapkannya ke resource yang menyertakan informasi sensitif tentang pengguna, atau respons API yang dimaksudkan agar dipanggil hanya dari asal yang sama.
Perlu diingat bahwa resource dengan header ini masih dapat dimuat secara langsung, misalnya
  dengan membuka URL di jendela browser baru. Kebijakan Resource Lintas Asal hanya melindungi resource agar tidak disematkan oleh situs lain.

Cross-Origin-Resource-Policy: same-origin

Batasi resource yang akan dimuat dari same-site
same-site direkomendasikan untuk diterapkan ke resource yang serupa dengan yang di atas,
  tetapi dimaksudkan untuk dimuat oleh subdomain lain di situs Anda.

Cross-Origin-Resource-Policy: same-site

Catatan:  Untuk mempelajari lebih lanjut perbedaan antara situs yang sama asal dan situs yang sama, lihat Memahami "situs yang sama" dan "asal yang sama". 
Browser yang didukung

  
    
    
    
    
  
  
  
    
      
    
  
    
      
    
  
    
      
    
   

    
    
      
      

        Dukungan Browser
        
          
  
  
    
      
        
          
          
        
      
    
    
  
  73
  
  
          
  
  
    
      
        
          
          
        
      
    
    
  
  79
  
  
          
  
  
    
      
        
          
          
        
      
    
    
  
  74
  
  
          
  
  
    
      
        
          
          
        
      
    
    
  
  12
  
  
        
        
        Sumber
        
      
    
    
    
  
Selengkapnya

  Pertimbangkan untuk men-deploy kebijakan resource lintas asal
  Membuat situs Anda "diisolasi lintas origin" menggunakan COOP dan COEP
  Alasan Anda memerlukan "diisolasi lintas origin" untuk fitur canggih

    
  


Kebijakan Pembuka Lintas Asal (COOP)

Situs penyerang dapat membuka situs lain di jendela pop-up untuk mempelajari
informasi tentang situs tersebut dengan memanfaatkan kebocoran
lintas situs berbasis web. Dalam beberapa kasus, hal ini juga dapat memungkinkan
eksploitasi serangan side-channel berdasarkan
Spectre.

Header Cross-Origin-Opener-Policy menyediakan cara bagi dokumen untuk mengisolasinya sendiri dari jendela lintas origin yang dibuka melalui window.open() atau link dengan target="_blank" tanpa rel="noopener". Akibatnya, setiap pembuka lintas origin dokumen tidak akan memiliki referensi ke dokumen tersebut dan tidak akan dapat berinteraksi dengannya.

Contoh penggunaan
Cross-Origin-Opener-Policy: same-origin-allow-popups


  
    
    Cara menggunakan COOP


    
      Penggunaan yang direkomendasikan
Anda dapat mencoba pengaruh konfigurasi berikut terhadap komunikasi dengan
  jendela pop-up lintas origin pada demo ini.
  Ubah menu dropdown Cross-Origin-Opener-Policy untuk dokumen dan jendela pop-up, klik tombol Open a popup, lalu klik Send a
postMessage untuk melihat apakah pesan benar-benar terkirim.
Mengisolasi dokumen dari jendela lintas asal
Jika same-origin disetel, dokumen akan diisolasi dari jendela dokumen lintas origin.

Cross-Origin-Opener-Policy: same-origin

Mengisolasi dokumen dari jendela lintas origin, tetapi mengizinkan pop-up
Menyetel same-origin-allow-popups memungkinkan dokumen mempertahankan referensi ke jendela pop-up kecuali jika menetapkan COOP dengan same-origin atau same-origin-allow-popups. Ini berarti same-origin-allow-popups masih dapat melindungi dokumen agar tidak direferensikan saat dibuka sebagai jendela pop-up, tetapi memungkinkannya berkomunikasi dengan pop-upnya sendiri.


Cross-Origin-Opener-Policy: same-origin-allow-popups

Mengizinkan dokumen direferensikan oleh jendela lintas origin
unsafe-none adalah nilai default, tetapi Anda dapat secara eksplisit menunjukkan bahwa
  dokumen ini dapat dibuka oleh jendela lintas asal dan mempertahankan akses bersama.

 unsafe-none menjadi default berarti developer web harus mengirim same-origin atau same-origin-allow-popups secara eksplisit untuk melindungi situs mereka dari serangan side-channel. 
Cross-Origin-Opener-Policy: unsafe-none

Catatan:  Fitur seperti SharedArrayBuffer atau performance.measureUserAgentSpecificMemory() dinonaktifkan secara default. Beberapa browser memungkinkan Anda menggunakannya dalam konteks "diisolasi lintas origin", yang mengharuskan Anda menetapkan header COOP dan COEP. Untuk mempelajari lebih lanjut, baca Membuat situs Anda "diisolasi lintas asal" menggunakan COOP dan COEP. 
Pola laporan tidak kompatibel dengan COOP
Anda dapat menerima laporan saat COOP mencegah interaksi lintas-aplikasi dengan
  Reporting API.
Cross-Origin-Opener-Policy: same-origin; report-to="coop"

COOP juga mendukung mode laporan saja, sehingga Anda dapat menerima laporan tanpa
  benar-benar memblokir komunikasi antara dokumen lintas-asal.
Cross-Origin-Opener-Policy-Report-Only: same-origin; report-to="coop"

Browser yang didukung

  
    
    
    
    
  
  
  
    
      
    
  
    
      
    
  
    
      
    
   

    
    
      
      

        Dukungan Browser
        
          
  
  
    
      
        
          
          
        
      
    
    
  
  83
  
  
          
  
  
    
      
        
          
          
        
      
    
    
  
  83
  
  
          
  
  
    
      
        
          
          
        
      
    
    
  
  79
  
  
          
  
  
    
      
        
          
          
        
      
    
    
  
  15.2
  
  
        
        
        Sumber
        
      
    
    
    
  
Selengkapnya

  Alasan Anda memerlukan "diisolasi lintas origin" untuk fitur canggih

    
  


Cross-Origin Resource Sharing (CORS)

Tidak seperti item lain dalam artikel ini, Cross-Origin Resource Sharing (CORS) bukanlah header, melainkan mekanisme browser yang meminta dan mengizinkan akses ke resource lintas origin.

Secara default, browser menerapkan kebijakan origin yang sama untuk mencegah halaman web mengakses resource lintas origin. Misalnya, saat
gambar lintas origin dimuat, meskipun ditampilkan di halaman web
secara visual, JavaScript di halaman tersebut tidak memiliki akses ke data gambar.
Penyedia resource dapat melonggarkan pembatasan dan mengizinkan situs lain membaca resource tersebut dengan ikut serta dalam CORS.

Contoh penggunaan
Access-Control-Allow-Origin: https://example.com
Access-Control-Allow-Credentials: true


  
    
    Cara menggunakan CORS


    
      Sebelum mempelajari cara mengonfigurasi CORS, sebaiknya pahami perbedaan antara jenis permintaan. Bergantung pada detail permintaan, permintaan akan diklasifikasikan sebagai permintaan sederhana atau permintaan preflight.
Kriteria untuk permintaan sederhana:

  Metodenya adalah GET, HEAD, atau POST.
  Header kustom hanya menyertakan Accept, Accept-Language,
    Content-Language, dan Content-Type.
  
  Content-Type adalah application/x-www-form-urlencoded,
    multipart/form-data, atau text/plain.
  

Sisanya diklasifikasikan sebagai permintaan preflight. Untuk mengetahui detail selengkapnya,
  lihat Cross-Origin Resource Sharing (CORS) - HTTP |
    MDN.
Penggunaan yang direkomendasikan
Permintaan sederhana
Jika permintaan memenuhi kriteria permintaan sederhana, browser akan mengirim
  permintaan lintas origin dengan header Origin yang menunjukkan asal
  permintaan.
Contoh header permintaan
Get / HTTP/1.1
Origin: https://example.com

Contoh header respons
Access-Control-Allow-Origin: https://example.com
Access-Control-Allow-Credentials: true


  Access-Control-Allow-Origin: https://example.com menunjukkan bahwa
    https://example.com dapat mengakses konten respons. Resource yang dimaksudkan
    agar dapat dibaca oleh situs apa pun dapat menetapkan header ini ke *, dalam hal ini
    browser hanya akan mengharuskan permintaan dibuat tanpa
      kredensial.
  
  Access-Control-Allow-Credentials: true menunjukkan bahwa permintaan yang membawa kredensial (cookie) diizinkan untuk memuat resource. Jika tidak, permintaan terautentikasi akan ditolak meskipun origin yang meminta ada di header Access-Control-Allow-Origin.

Anda dapat mencoba pengaruh permintaan sederhana terhadap pemuatan resource dalam lingkungan Cross-Origin-Embedder-Policy: require-corp pada demo ini. Klik kotak centang Cross-Origin Resource Sharing dan klik tombol Reload the image untuk melihat efeknya.

Permintaan preflight
Permintaan preflight didahului dengan permintaan OPTIONS untuk memeriksa apakah
  permintaan berikutnya diizinkan untuk dikirim.
Contoh header permintaan
OPTIONS / HTTP/1.1
Origin: https://example.com
Access-Control-Request-Method: POST
Access-Control-Request-Headers: X-PINGOTHER, Content-Type


  Access-Control-Request-Method: POST memungkinkan permintaan berikut dibuat dengan metode POST.
  Access-Control-Request-Headers: X-PINGOTHER, Content-Type memungkinkan
    pemohon menetapkan header HTTP X-PINGOTHER dan Content-Type dalam
    permintaan berikutnya.

Contoh header respons
Access-Control-Allow-Origin: https://example.com
Access-Control-Allow-Credentials: true
Access-Control-Allow-Methods: POST, GET, OPTIONS
Access-Control-Allow-Headers: X-PINGOTHER, Content-Type
Access-Control-Max-Age: 86400


  Access-Control-Allow-Methods: POST, GET, OPTIONS menunjukkan bahwa permintaan berikutnya
 dapat dibuat dengan metode POST, GET, dan OPTIONS.
  Access-Control-Allow-Headers: X-PINGOTHER, Content-Type menunjukkan bahwa permintaan
    berikutnya dapat menyertakan header X-PINGOTHER dan Content-Type.
  Access-Control-Max-Age: 86400 menunjukkan bahwa hasil permintaan preflight
    dapat disimpan dalam cache selama 86.400 detik.

Browser yang didukung

  
    
    
    
    
  
  
  
    
      
    
  
    
      
    
  
    
      
    
   

    
    
      
      

        Dukungan Browser
        
          
  
  
    
      
        
          
          
        
      
    
    
  
  4
  
  
          
  
  
    
      
        
          
          
        
      
    
    
  
  12
  
  
          
  
  
    
      
        
          
          
        
      
    
    
  
  3,5
  
  
          
  
  
    
      
        
          
          
        
      
    
    
  
  4
  
  
        
        
        Sumber
        
      
    
    
    
  
Selengkapnya

  Cross-Origin Resource Sharing (CORS)
  Cross-Origin Resource Sharing (CORS) - HTTP |
      MDN

    
  


Kebijakan Penyemat Lintas Asal (COEP)

Untuk mengurangi kemampuan serangan berbasis
Spectre guna
mencuri resource lintas origin, fitur seperti SharedArrayBuffer atau
performance.measureUserAgentSpecificMemory() dinonaktifkan secara default.

Cross-Origin-Embedder-Policy: require-corp mencegah dokumen dan pekerja memuat resource lintas origin seperti gambar, skrip, stylesheet, iframe, dan lainnya kecuali jika resource ini secara eksplisit memilih untuk dimuat melalui header CORS atau CORP. COEP dapat digabungkan dengan Cross-Origin-Opener-Policy untuk mengikutsertakan dokumen ke dalam isolasi lintas origin.

Gunakan Cross-Origin-Embedder-Policy: require-corp saat Anda ingin mengaktifkan isolasi lintas origin untuk dokumen Anda.

Contoh penggunaan
Cross-Origin-Embedder-Policy: require-corp


  
    
    Cara menggunakan COEP


    
      Contoh penggunaan
COEP mengambil satu nilai require-corp. Dengan mengirimkan header ini, Anda dapat
  memerintahkan browser untuk memblokir resource pemuatan yang tidak diikutsertakan melalui
  CORS atau CORP.


Anda dapat mencoba pengaruh konfigurasi berikut terhadap pemuatan resource pada demo
    ini. Ubah menu dropdown
  Cross-Origin-Embedder-Policy,
  menu dropdown Cross-Origin-Resource-Policy, kotak centang Hanya Laporan, dll.
  untuk melihat pengaruhnya terhadap pemuatan resource. Selain itu, buka demo endpoint pelaporan untuk melihat apakah resource yang diblokir dilaporkan.

Mengaktifkan isolasi lintas asal
Aktifkan isolasi lintas origin dengan mengirimkan
  Cross-Origin-Embedder-Policy: require-corp beserta
  Cross-Origin-Opener-Policy: same-origin.

Cross-Origin-Embedder-Policy: require-corp
Cross-Origin-Opener-Policy: same-origin

Melaporkan resource yang tidak kompatibel dengan COEP
Anda dapat menerima laporan resource terblokir yang disebabkan oleh COEP dengan Reporting API.
Cross-Origin-Embedder-Policy: require-corp; report-to="coep"

COEP juga mendukung mode laporan saja sehingga Anda dapat menerima laporan tanpa benar-benar
  memblokir resource pemuatan.
Cross-Origin-Embedder-Policy-Report-Only: require-corp; report-to="coep"

Browser yang didukung

  
    
    
    
    
  
  
  
    
      
    
  
    
      
    
  
    
      
    
   

    
    
      
      

        Dukungan Browser
        
          
  
  
    
      
        
          
          
        
      
    
    
  
  83
  
  
          
  
  
    
      
        
          
          
        
      
    
    
  
  83
  
  
          
  
  
    
      
        
          
          
        
      
    
    
  
  79
  
  
          
  
  
    
      
        
          
          
        
      
    
    
  
  15.2
  
  
        
        
        Sumber
        
      
    
    
    
  
Selengkapnya

  Membuat situs Anda "diisolasi lintas origin" menggunakan COOP dan COEP
  Alasan Anda memerlukan "diisolasi lintas origin" untuk fitur canggih
  Panduan untuk mengaktifkan isolasi lintas asal

    
  


HTTP Strict Transport Security (HSTS)

Komunikasi melalui koneksi HTTP biasa tidak dienkripsi, sehingga
data yang ditransfer dapat diakses oleh penyadap tingkat jaringan.

Header Strict-Transport-Security memberi tahu browser bahwa browser tidak boleh memuat
situs menggunakan HTTP dan menggunakan HTTPS sebagai gantinya. Setelah ditetapkan, browser akan menggunakan HTTPS, bukan HTTP, untuk mengakses domain tanpa pengalihan selama durasi yang ditentukan di header.

Contoh penggunaan
Strict-Transport-Security: max-age=31536000


  
    
    Cara menggunakan HSTS


    
      Penggunaan yang direkomendasikan
Semua situs yang bertransisi dari HTTP ke HTTPS harus merespons dengan
  header Strict-Transport-Security saat permintaan dengan HTTP diterima.

Strict-Transport-Security: max-age=31536000

Browser yang didukung

  
    
    
    
    
  
  
  
    
      
    
  
    
      
    
  
    
      
    
   

    
    
      
      

        Dukungan Browser
        
          
  
  
    
      
        
          
          
        
      
    
    
  
  4
  
  
          
  
  
    
      
        
          
          
        
      
    
    
  
  12
  
  
          
  
  
    
      
        
          
          
        
      
    
    
  
  4
  
  
          
  
  
    
      
        
          
          
        
      
    
    
  
  7
  
  
        
        
        Sumber
        
      
    
    
    
  
Selengkapnya

  Strict-Transport-Security -
      HTTP

    
  


Bacaan lebih lanjut


Pengembangan Web Pasca-Spectre