Square
Square publishes a dedicated CSP page for the Web Payments SDK, with separate policies for sandbox and production. It is one of the more complete payment integrations to bring under a policy - and one of the easier ones to get subtly wrong, because their examples are <meta> tags.
What Square requires
A baseline policy, with the environment domain differing between sandbox and production:
default-src 'self';
script-src 'self' https://web.squarecdn.com;
frame-src 'self' https://web.squarecdn.com;
connect-src 'self' https://web.squarecdn.com;
style-src 'self' 'unsafe-inline';
Sandbox uses https://sandbox.web.squarecdn.com in place of https://web.squarecdn.com throughout.
Square also documents a narrower payment-specific set, which adds the PCI connection endpoint and the font origins:
frame-src https://web.squarecdn.com;
connect-src https://pci-connect.squareup.com;
script-src https://web.squarecdn.com;
style-src https://web.squarecdn.com;
font-src https://square-fonts-production-f.squarecdn.com https://d1g145x70srn7h.cloudfront.net
Sandbox uses https://pci-connect.squareupsandbox.com for the connect-src endpoint. Square's documented connect-src also includes their own error-reporting origin, which the SDK uses for its telemetry - allow it or the SDK's own diagnostics are blocked.
Sending reports to Report URI
Square's examples deliver the policy as a <meta> tag. A <meta> tag policy cannot carry report-uri or report-to - the browser silently ignores both. To get violation reports you have to send the policy as an HTTP response header instead. See our Frameworks guides for the header in your stack.
Your URL comes from the Setup page:
Content-Security-Policy-Report-Only: default-src 'self'; script-src 'self' https://web.squarecdn.com; frame-src 'self' https://web.squarecdn.com; connect-src 'self' https://web.squarecdn.com https://pci-connect.squareup.com; style-src 'self' 'unsafe-inline'; report-uri https://abc123.report-uri.com/r/d/csp/reportOnly
Things to watch for
- The
<meta>tag trap above is the big one. Follow Square's examples exactly and you get a working policy that can never tell you what it blocked - and no evidence to hand an assessor. - Sandbox and production use different domains for both the CDN and the PCI endpoint. A policy tuned in sandbox will break in production, and the failure looks like the SDK simply not loading.
- Don't forget
font-src. The fonts come from a different origin to everything else, and a missingfont-srcproduces a card form that renders in a fallback font rather than an obvious error. style-src 'unsafe-inline'is required. Keep it scoped tostyle-srcand do not let it drift intoscript-src.
Official documentation
Square - Add a Content Security Policy
Start Monitoring with Report URI
Already using us for CSP? Find your report-uri value on Setup, or view your CSP reports.
New to Report URI? Create an account and grab your report-uri value from the Setup page. Working towards PCI DSS 4.0? Start with our Compliance guides.