jquery.app
English
EnglishDeutschFrancaisEspanol日本語Nederlands

GitHub Pages Tools

Free COOP/COEP/CORP Header Builder

Configure Cross-Origin-Opener-Policy (COOP), Cross-Origin-Embedder-Policy (COEP), and Cross-Origin-Resource-Policy (CORP) for cross-origin isolation. Presets for full isolation (SharedArrayBuffer/WASM), moderate isolation with third-party embed support, and relaxed opener-only isolation.

Loading tool...

What is COOP/COEP/CORP Header Builder?

Cross-Origin isolation is a set of HTTP headers that control how a page interacts with cross-origin windows and resources. COOP controls whether this page can be accessed by other origins via window.opener. COEP controls whether cross-origin resources (images, fonts, scripts) can be loaded. CORP controls whether this resource can be loaded by other origins. Together they enable powerful features like SharedArrayBuffer and high-resolution timers.

quickAnswer

Build Cross-Origin isolation headers for SharedArrayBuffer and opener security. COOP controls window.opener access. COEP controls cross-origin resource loading. CORP controls whether other origins can load your resources. Use the moderate preset for most sites that need isolation with third-party embed support.

limitations

  • Cross-origin isolation is a powerful restriction that can silently break third-party embeds, CDN resources, analytics, and fonts. Test thoroughly on every page type before enforcing.
  • COEP credentialless is supported in Chrome 113+, Edge 113+, and Firefox 128+. Older browsers and Safari may not support it, causing cross-origin resources to fail.
  • Some hosting platforms (including GitHub Pages) do not support setting custom COOP/COEP/CORP headers. Use a CDN or reverse proxy (Cloudflare, Netlify) in front to add them.

How to use this tool

  1. Select an isolation goal preset or choose custom to configure each header individually.
  2. Review the header values — stricter isolation enables more features but may break third-party embeds.
  3. Copy the headers and add them to your server or CDN configuration.
  4. Use the debugging checklist to identify broken resources after deployment.

What you can use it for

  • Enable SharedArrayBuffer and advanced WebAssembly features for a compute-intensive web app.
  • Isolate a page's opener relationship to prevent cross-origin attacks while still loading CDN images and third-party fonts.
  • Configure minimal isolation that prevents opener access but does not restrict embedded resource loading.

Use cases

Practical examples

example

Compute-intensive web app

A web app needs SharedArrayBuffer for real-time audio processing. Use the full isolation preset: COOP same-origin, COEP require-corp, CORP same-origin. All third-party resources must send CORP headers or be loaded with crossorigin.

example

Static site with third-party embeds

A blog uses Google Fonts, a CDN for images, and embedded YouTube videos. Use the moderate preset with COEP credentialless so third-party resources load without CORP headers while maintaining opener isolation.

Common mistakes

  • Setting COEP require-corp without ensuring all third-party resources send CORP headers — images, fonts, and scripts from CDNs will break silently.
  • Using COOP same-origin when the page needs to communicate with popups or use OAuth redirect flows — popups cannot access window.opener.
  • Forgetting that COEP credentialless is newer and not supported in all browsers — check browser compatibility before deploying.

verification

  1. Open DevTools Console and check for CORP/COEP blocking errors after deploying the headers.
  2. Use crossOriginIsolated in the console: self.crossOriginIsolated should return true if full isolation is working correctly.

FAQ

Questions about COOP/COEP/CORP Header Builder

What is the difference between COEP require-corp and credentialless?

require-corp requires EVERY cross-origin resource to send a Cross-Origin-Resource-Policy header or be loaded with the crossorigin attribute. credentialless is a newer alternative that automatically strips credentials from cross-origin requests, allowing third-party resources to load without CORP headers. credentialless is more compatible with existing CDN and third-party content.

Do I need cross-origin isolation for my site?

Only if you need SharedArrayBuffer, high-resolution performance.now() (microsecond precision), or specific WebAssembly features. Most content websites, blogs, and e-commerce sites do NOT need cross-origin isolation. Start with the relaxed preset and increase isolation only if your web app requires the features it enables.

Related tools

More github pages tools

Github Pages

CORS Header Generator

Generate CORS HTTP headers for any origin, method, and credential configuration. Output in raw HTTP, Nginx, Apache, Express, or Cloudflare Workers format.

Open tool

Also try

Also try

Seo

AI Crawler robots.txt Builder

Build a robots.txt policy for AI crawlers. Choose from open, selective, or strict presets and block specific AI training bots while allowing search engines.

Open tool