How can we help you?

Securing the Velaro Messaging Widget with Content Security Policy (CSP)

The Velaro Messaging widget is fully compatible with strict Content Security Policy (CSP) using a per-request nonce and the CSP Level 3 'strict-dynamic' source expression. This is the modern, recommended pattern for locking down inline scripts without maintaining an allowlist of third-party domains.

No Velaro-side configuration is required. You control everything from your own response headers and HTML.

How It Works

A CSP header containing script-src 'nonce-' 'strict-dynamic' tells the browser:

  1. Only ``

    Replace with the value from step 1. Replace SITE_ID with your Velaro Site ID.

    4. Verify in DevTools

    Open the browser console. You should see no CSP violations related to Velaro Messaging.

    What You Do NOT Need to Do

    • You do not need to nonce any other script tags Velaro injects. The widget bundle is loaded dynamically by the loader — 'strict-dynamic' covers everything downstream.
    • You do not need to allowlist cdn.velaro.com in script-src. With 'strict-dynamic', source allowlists are ignored by browsers that support it.
    • You do not need to enable a setting in your Velaro admin. There is no Velaro-side toggle. The widget behaves the same whether or not your CSP uses a nonce — your CSP is the only thing that controls enforcement.

    Why 'strict-dynamic' Is the Recommended Pattern

    'strict-dynamic' is endorsed by OWASP, Google's CSP Evaluator, and MDN as the strongest practical CSP strategy. The alternative — source allowlists like script-src https://cdn.velaro.com https://cdn.somecdn.com ... — is brittle and has historically been bypassable through JSONP endpoints, AngularJS sandbox escapes, and abusable file uploads on "trusted" CDNs.

    Nonce-based CSP with 'strict-dynamic' removes those bypass classes by requiring a fresh secret per request that only your server knows.

    Verifying Your Setup

    Use Google's CSP Evaluator to score your CSP header. A passing score with 'strict-dynamic' looks like:

    `` script-src 'nonce-...' 'strict-dynamic' ✓ Strong CSP object-src 'none' ✓ base-uri 'self' ✓ ``

    Browser Support

    Browser'strict-dynamic'
    Chrome / Edge52+
    Firefox52+
    Safari15.4+
    Older browsersFall back to the https: source expression

    This covers effectively all modern browser traffic. Older browsers degrade gracefully through the fallback expressions in the same header.

    Troubleshooting

    The widget doesn't load and the console shows Refused to load the script ....

    The nonce on the loader tag does not match the nonce in the CSP header. Both must come from the same response. Check that your server is injecting the same nonce into both the header and the HTML.

    Some Velaro features fail after the widget loads.

    The Velaro Messaging widget does not use eval() or document.write() of script tags, so under a properly configured CSP all features should work. If you see CSP violations, capture the exact violation report (document.addEventListener('securitypolicyviolation', ...)) and share it with Velaro support — we can confirm whether it's a Velaro-side fix or a CSP misconfiguration.

    My CSP report endpoint is flooded with violations.

    If your enforcing CSP doesn't include 'strict-dynamic' but your report-only one does, you may see violations for every sub-bundle the widget loads. Make sure both headers include 'strict-dynamic' together.

    Questions

    Contact your Velaro account representative or open a support ticket. For deeper technical questions you can also reach the Velaro security team through the support portal.

Share: Email

Was this article helpful?