CSP: connect-src

The HTTP Content-Security-Policy (CSP) connect-src directive restricts the URLs which can be loaded using script interfaces. The APIs that are restricted are:

Note: connect-src 'self' does not resolve to websocket schemes in all browsers, more info in this issue.

CSP version 1
Directive type Fetch directive
default-src fallback Yes. If this directive is absent, the user agent will look for the default-src directive.

Syntax

One or more sources can be allowed for the connect-src policy:

http
Content-Security-Policy: connect-src <source>;
Content-Security-Policy: connect-src <source> <source>;

Sources

<source> can be any one of the values listed in CSP Source Values.

Note that this same set of values can be used in all fetch directives (and a number of other directives).

Examples

Violation cases

Given this CSP header:

http
Content-Security-Policy: connect-src https://example.com/

The following connections are blocked and won't load:

html
<a ping="https://not-example.com">
  <script>
    const response = fetch("https://not-example.com/");

    const xhr = new XMLHttpRequest();
    xhr.open("GET", "https://not-example.com/");
    xhr.send();

    const ws = new WebSocket("wss://not-example.com/");

    const es = new EventSource("https://not-example.com/");

    navigator.sendBeacon("https://not-example.com/", {
      /* … */
    });
  </script></a
>

Specifications

Specification
Content Security Policy Level 3
# directive-connect-src

Browser compatibility

BCD tables only load in the browser

See also