Content Security Policy

Content Security Policy (CSP) values are set in response headers via helmet in NestJS.

CSP values set in <meta> in the Angular index.html will be ignored as they are overwritten by Helmet in the repsonse headers

Angular service worker requests require an additional CSP of 'connect-src *' these are configured in main.ts as below.

nest-api/src/main.ts

app.use(helmet.contentSecurityPolicy({
      useDefaults: true,
      directives: { /* Override CSP Defaults */
        ...
        connectSrc: [ '*' ],
        ...
      },
    })
  )

Service worker requests are treated differently and must be accomodated to not cause browser errors. See this blog article for more information:

Qubyte Codes - Content-Security-Policy and service workersqubyte.codes