default-src 'self'; script-src 'self'; connect-src 'self'; img-src 'self' https:; style-src 'self' 'unsafe-inline'; font-src 'self'; base-uri 'self'; form-action 'self'; child-src 'self'; frame-src 'self'; frame-ancestors 'self'
This guide covers how we manage state in the app.
See Auth Services documentation for overview of how authentication and authorization works.
As of 1.4.2-GA and 1.5.0-GA, we have introduced Content Security Policy headers for the starter.
With this there are several changes introduced:
All inline scripts have been moved to separate js files
The inline script in public/silent-callback.html
is now imported from public/silent-callback.js
.
CSP headers are now set in index.js
.
The effective default CSP header is as follows
default-src 'self'; script-src 'self'; connect-src 'self'; img-src 'self' https:; style-src 'self' 'unsafe-inline'; font-src 'self'; base-uri 'self'; form-action 'self'; child-src 'self'; frame-src 'self'; frame-ancestors 'self'
To control the values of these either modify them directly in samples/express/index.js
or use the following properties:
Directive | Property | Default Value | Notes |
---|---|---|---|
|
|
|
|
|
|
|
|
|
|
|
A nonce based on UUID v4 is also generated for each request to support inline scripts related to PayPal and Google Tag Manager. |
|
|
|
It is recommended to restrict this further based on the actually expected image domains such as |
|
|
|
A nonce based on UUID v4 is also generated for each request to support inline styles related to theme variables. |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
This is set using the same property as |
|
|
|
Support for generating for Stripe, PayPal, or GTM
GTM
script-src 'self' 'nonce-<generated-uuidv4>'
img-src 'self' https: www.googletagmanager.com
conncet-src 'self' www.google-analytics.com
child-src 'self' www.googletagmanager.com
(only needed if JS is disabled)
frame-src
will be set to the same for browser compatibility
PayPal
script-src 'self' 'nonce-<generated-uuidv4>' *.paypal.com
img-src 'self' https: data: *.paypal.com
Need to allow data (base64) images or some PayPal images will break
connect-src 'self' *.paypal.com
child-src 'self' *.paypal.com
frame-src
will be set to the same for browser compatibility
Stripe (also see Stripe’s Guide on CSP.)
script-src 'self js.stripe.com
connect-src 'self' api.stripe.com
child-src 'self' js.stripe.com hooks.stripe.com
frame-src
will be set to the same for browser compatibility