Cross-Origin Opener Policy (COOP)

What is Cross-Origin Opener Policy (COOP)?

Cross-Origin Opener Policy (COOP) is an HTTP security header that controls how documents from one origin can interact with windows from another origin. COOP helps prevent security vulnerabilities that arise when a malicious website opens a new window or tab to a legitimate site and attempts to manipulate or read its content.

COOP works by isolating browsing contexts, preventing cross-origin windows from directly accessing each other's DOM or JavaScript environment. This is particularly important for protecting against spectre-style attacks and other cross-window security vulnerabilities.

Header Syntax

The COOP header uses the following syntax:

Cross-Origin-Opener-Policy: <value>

Where <value> can be one of:

• unsafe-none: No policy (default behavior)
• same-origin: Only allow same-origin documents to interact
• same-origin-allow-popups: Allow same-origin and popups that don't set COOP
• same-origin-plus-coep: Requires Cross-Origin Embedder Policy (COEP)

How COOP Works

When a document opens a new window (via window.open() or a link with target="_blank"), the browser checks the COOP header of both the opener and the opened document:

1. If both documents have same-origin COOP: They can interact normally
2. If one has same-origin and the other doesn't: The windows are isolated
3. If both have unsafe-none: They can interact (default behavior)

Security Benefits

Prevents window manipulation attacks:

• Stops malicious sites from modifying legitimate windows
• Prevents reading sensitive data from other windows
• Blocks attempts to hijack user sessions

Mitigates Spectre-style attacks:

• Reduces the attack surface for side-channel vulnerabilities
• Prevents cross-window data leakage
• Enhances process isolation in modern browsers

Enhances process isolation:

• Enables browsers to use separate processes for different origins
• Improves performance and security
• Reduces the impact of potential vulnerabilities

COOP Values Explained

unsafe-none (Default)

• No isolation between windows
• Cross-origin windows can interact freely
• Vulnerable to various attacks
• Not recommended for security-sensitive applications

same-origin

• Only same-origin windows can interact
• Cross-origin windows are completely isolated
• Provides maximum security
• May break legitimate cross-origin interactions

same-origin-allow-popups

• Same-origin windows can interact
• Popups that don't set COOP can also interact
• Balances security and functionality
• Allows some cross-origin interactions when needed

same-origin-plus-coep

• Requires Cross-Origin Embedder Policy (COEP)
• Enables advanced security features
• Used in conjunction with COEP for full isolation

Example Scenarios

Vulnerable scenario (no COOP):

// Malicious site opens a legitimate banking site
const bankingWindow = window.open('https://bank.com');

// Later, the malicious site can manipulate the banking window
bankingWindow.postMessage('transfer money', 'https://bank.com');

Protected scenario (with COOP):

// Legitimate site sets COOP header
Cross-Origin-Opener-Policy: same-origin

// Malicious site tries to open the legitimate site
const bankingWindow = window.open('https://bank.com');

// The malicious site cannot access the banking window
bankingWindow === null; // true in some browsers

Implementation Examples

HTTP Response Header:

Cross-Origin-Opener-Policy: same-origin

Web Server Configuration Examples:

Apache (.htaccess):

Header set Cross-Origin-Opener-Policy "same-origin"

Nginx:

add_header Cross-Origin-Opener-Policy "same-origin";

Express.js (Node.js):

app.use((req, res, next) => {
  res.setHeader('Cross-Origin-Opener-Policy', 'same-origin');
  next();
});

Best Practices

1. Start with same-origin-allow-popups for a balance of security and functionality
2. Use same-origin for security-sensitive applications where cross-origin interactions aren't needed
3. Combine with COEP for maximum isolation when needed
4. Test thoroughly as COOP can break legitimate functionality
5. Combine with other security headers:
   • Cross-Origin Resource Policy (CORP)
   • Cross-Origin Embedder Policy (COEP)
   • Content Security Policy (CSP)
   • Same-Origin Policy (SOP)

Common Use Cases

1. Online banking: Prevent window manipulation attacks
2. E-commerce platforms: Protect checkout processes
3. Social media sites: Prevent session hijacking
4. Government websites: Enhance security for sensitive data
5. Healthcare portals: Protect patient information
6. Web applications with sensitive data: Prevent cross-window data leakage

Browser Support

COOP is supported in modern browsers:

• Chrome 83+
• Firefox 79+
• Edge 83+
• Safari 15.4+

Debugging COOP Issues

Common COOP-related issues and solutions:

1. Broken window interactions:
   • Check if COOP is too restrictive
   • Consider using same-origin-allow-popups instead of same-origin
2. Popup windows not working:
   • Ensure popups don't set restrictive COOP headers
   • Use same-origin-allow-popups for the opener
3. Cross-origin communication broken:
   • Verify both windows have compatible COOP policies
   • Consider using postMessage with proper origin validation
4. Performance issues:
   • COOP can enable process isolation which may impact performance
   • Test with different COOP values to find the right balance

Advanced COOP Usage

Combining COOP with COEP:

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

Dynamic COOP based on context:

app.use((req, res, next) => {
  if (req.path.startsWith('/sensitive')) {
    res.setHeader('Cross-Origin-Opener-Policy', 'same-origin');
  } else {
    res.setHeader('Cross-Origin-Opener-Policy', 'same-origin-allow-popups');
  }
  next();
});

Related Security Concepts

• Cross-Origin Embedder Policy (COEP)
• Same-Origin Policy (SOP)
• Cross-Origin Resource Sharing (CORS)
• Content Security Policy (CSP)
• Side-Channel Attacks
• HTTP Security Headers