v145 · Web APIs · Security Info Demo

Security Info Demo

Shows the structure of a WebRequest.SecurityInfo object — the TLS fields available when inspecting requests in a Controlled Frame.

SecurityInfo structure

state'secure' | 'insecure' | 'broken'
protocol'TLS 1.3' | 'TLS 1.2' | ...
cipherSuite'AES_128_GCM' | 'CHACHA20_POLY1305' | ...
keyExchangeGroup'X25519' | 'P-256' | ...
certificates[0].subject'example.com'
certificates[0].issuer'Let's Encrypt R3'
certificates[0].validFromDate (ISO string)
certificates[0].validToDate (ISO string)

enterprise use cases

// 1. Certificate pinning in enterprise apps
frame.request.onCompleted.addListener(async details => {
  const info = await frame.request.getSecurityInfo(details.requestId, {
    certificateInfo: 'full',
  });
  const leaf = info.certificates[0];

  // Check subject public key hash matches expected pin
  const pin = await computeSPKIHash(leaf.rawDER);
  if (!ALLOWED_PINS.has(pin)) {
    // Block the request or show a warning
    console.warn('Certificate pin mismatch for', details.url);
  }
});

// 2. Security indicator UI
if (info.state === 'broken') {
  showMixedContentWarning();
} else if (info.protocol === 'TLS 1.2') {
  showLegacyTlsWarning();
}

// 3. Compliance logging — record TLS version and cert details for audit

see also

scenario focus

Select a scenario to focus its rendered example and summary.