Skip to main content
If your site sends a Content Security Policy (CSP), it has to allow RadiumOne’s origins, or the browser blocks Elements. What you add depends on what you use: Add the 3D Secure directives only on those routes, not site-wide. For the CDN script’s integrity hash, see Subresource Integrity.

​
Card fields

Card fields need no connect-src: card data and the card-binding call stay inside the RadiumOne card iframe, so your page’s policy isn’t involved.

​
3D Secure

3D Secure runs on your page rather than inside the card iframe, so it needs more: your page calls the RadiumOne API, and shows the bank’s challenge in an iframe or sends the shopper to it.

​
Iframe challenge

connect-src is the directive to check first. The SDK reads the challenge result from the API with GET /gateway/v1/3ds/status. If connect-src blocks that call, a shopper can complete the challenge at their bank and the SDK still rejects with urn:radiumone:three-ds:challenge-timeout after 5 minutes.
Banks host their challenge pages on their own domains, which can’t be listed in advance — so frame-src needs https:. That allows any HTTPS page to be framed on these routes. It doesn’t let a framed page fake a result: the SDK only accepts a completion signal sent from the API origin, and even then only as a prompt to read the status from the API.

​
Redirect challenge

The redirect challenge is a full-page form post to the bank, so it needs form-action instead of frame-src. Your 3DS return page loads the SDK and calls threeDS.resume(), so it needs script-src for the CDN and the same connect-src. See Challenge presentation.

​
Example policies

Merge these with your existing policy — they show only the sources Elements needs, plus the recommended frame-ancestors. Each directive is on its own line for readability; send the header as a single line.

​
Origins per environment

Your publishable key picks the environment: r1pk_prod_ keys use production; r1pk_test_, r1pk_mock_ keys use sandbox.

​
Roll out with report-only first

Send your new policy as Content-Security-Policy-Report-Only first. The browser reports violations without blocking anything, so a missing directive shows up in your reports instead of breaking checkout. Test card fields and a 3D Secure challenge in sandbox, then switch to the enforcing Content-Security-Policy header once the reports are clean.

​
frame-ancestors

Set frame-ancestors 'self' on your checkout page — or 'none' if it’s never framed — so another site can’t load it in a frame to trick shoppers into clicking. Elements doesn’t need your page to be frameable.

​
Referrer-Policy

Serve your 3DS return page with Referrer-Policy: no-referrer, and don’t load third-party scripts on it. The return URL carries a single-use action_ref, which can be used to look up the 3DS result, so it shouldn’t leak to other sites through the Referer header. Elsewhere, the browser default strict-origin-when-cross-origin is fine.

​
Troubleshooting

Look for a CSP violation in the browser console — it names the blocked directive and URL.

​
Next steps

Install and load

Load Elements with npm or a CDN script tag, with Subresource Integrity.

3D Secure with Elements

Add RadiumOne 3D Secure to your Elements integration.
Last modified on September 15, 2026