jquery.app
Nederlands
EnglishDeutschFrancaisEspanol日本語Nederlands

Coderings-, hash- en beveiligingstools

Gratis COOP/COEP/CORP Header Builder

Configureer cross-origin isolatie-headers voor SharedArrayBuffer, WASM en beveiliging.

Tool laden...

Wat is COOP/COEP/CORP Header Builder?

Cross-Origin isolatie is een set HTTP-headers die bepalen hoe een pagina interageert met cross-origin vensters en bronnen. COOP bepaalt of deze pagina toegankelijk is voor andere origins via window.opener. COEP bepaalt of cross-origin bronnen (afbeeldingen, lettertypen, scripts) kunnen worden geladen. CORP bepaalt of deze bron door andere origins kan worden geladen. Samen maken ze krachtige functies mogelijk zoals SharedArrayBuffer en hoge-resolutie timers.

Snel antwoord

Bouw Cross-Origin isolatie-headers voor SharedArrayBuffer en opener-beveiliging. COOP regelt window.opener-toegang. COEP regelt cross-origin bronladen. CORP regelt of andere origins uw bronnen kunnen laden. Gebruik de gematigde preset voor de meeste sites die isolatie nodig hebben met ondersteuning voor third-party embeds.

Last updated: 2026-05-28

Beperkingen

  • Cross-origin isolatie is een krachtige beperking die third-party embeds, CDN-bronnen, analytics en lettertypen ongemerkt kan breken. Test grondig op elk paginatype voordat u het afdwingt.
  • COEP credentialless wordt ondersteund in Chrome 113+, Edge 113+ en Firefox 128+. Oudere browsers en Safari ondersteunen het mogelijk niet, waardoor cross-origin bronnen kunnen falen.
  • Sommige hostingplatforms (waaronder GitHub Pages) ondersteunen het instellen van aangepaste COOP/COEP/CORP-headers niet. Gebruik een CDN of reverse proxy (Cloudflare, Netlify) ervoor om ze toe te voegen.

Sources:MDN Web Docs · W3C Specifications · jquery.app on GitHub

Zo gebruik je deze tool

  1. Selecteer een isolatiedoelpreset of kies aangepast om elke header individueel te configureren.
  2. Bekijk de headerwaarden - strengere isolatie maakt meer functies mogelijk maar kan third-party embeds breken.
  3. Kopieer de headers en voeg ze toe aan uw server- of CDN-configuratie.
  4. Gebruik de debug-checklist om verbroken bronnen te identificeren na implementatie.

Waarvoor je het kunt gebruiken

  • Schakel SharedArrayBuffer en geavanceerde WebAssembly-functies in voor een rekenintensieve webapp.
  • Isoleer de opener-relatie van een pagina om cross-origin aanvallen te voorkomen terwijl CDN-afbeeldingen en third-party lettertypen nog worden geladen.
  • Configureer minimale isolatie die opener-toegang voorkomt maar het laden van ingebedde bronnen niet beperkt.

Gebruik

Praktische voorbeelden

Voorbeeld

Rekenintensieve webapp

Een webapp heeft SharedArrayBuffer nodig voor real-time audioverwerking. Gebruik de volledige isolatiepreset: COOP same-origin, COEP require-corp, CORP same-origin. Alle third-party bronnen moeten CORP-headers sturen of worden geladen met crossorigin.

Voorbeeld

Statische site met third-party embeds

Een blog gebruikt Google Fonts, een CDN voor afbeeldingen en ingebedde YouTube-video's. Gebruik de gematigde preset met COEP credentialless zodat third-party bronnen laden zonder CORP-headers terwijl opener-isolatie behouden blijft.

Veelgemaakte fouten

  • COEP require-corp instellen zonder te garanderen dat alle third-party bronnen CORP-headers sturen - afbeeldingen, lettertypen en scripts van CDN's zullen ongemerkt breken.
  • COOP same-origin gebruiken wanneer de pagina moet communiceren met popups of OAuth-redirectstromen gebruikt - popups hebben geen toegang tot window.opener.
  • Vergeten dat COEP credentialless nieuwer is en niet in alle browsers wordt ondersteund - controleer browsercompatibiliteit voordat u implementeert.

Verificatie

  1. Open het DevTools Console en controleer op CORP/COEP-blokkeringsfouten na het implementeren van de headers.
  2. Gebruik crossOriginIsolated in de console: self.crossOriginIsolated zou true moeten teruggeven als volledige isolatie correct werkt.

FAQ

Vragen over COOP/COEP/CORP Header Builder

Wat is het verschil tussen COEP require-corp en credentialless?

require-corp vereist dat ELKE cross-origin bron een Cross-Origin-Resource-Policy-header stuurt of wordt geladen met het crossorigin-attribuut. credentialless is een nieuwer alternatief dat automatisch credentials verwijdert van cross-origin verzoeken, waardoor third-party bronnen kunnen laden zonder CORP-headers. credentialless is beter compatibel met bestaande CDN- en third-party content.

Heb ik cross-origin isolatie nodig voor mijn site?

Alleen als u SharedArrayBuffer, hoge-resolutie performance.now() (microseconde precisie) of specifieke WebAssembly-functies nodig heeft. De meeste contentwebsites, blogs en e-commerce sites hebben GEEN cross-origin isolatie nodig. Begin met de soepele preset en verhoog de isolatie alleen als uw webapp de functies vereist die het mogelijk maakt.

Gerelateerde tools

Meer coderings-, hash- en beveiligingstools

Coderings-, hash- en beveiligingstools

CORS Header Generator

Genereer CORS HTTP-headers voor elke origin-, methode- en credential-configuratie.

Open tool

Coderings-, hash- en beveiligingstools

CSP Hash Generator

Genereer CSP-hashwaarden voor inline scripts en styles. Hash exacte code met SHA-256, SHA-384 of SHA-512.

Open tool

Probeer ook

Probeer ook