Content Security Policy
What to allow if your site sends a Content-Security-Policy header. No unsafe-inline or unsafe-eval is needed.
If your site has no Content Security Policy, skip this page.
The widget is built for strict policies. It uses no eval, no inline scripts of its own and no <style> tags: styles are applied through constructed stylesheets inside its Shadow DOM and the font through the FontFace API. Add these sources to your policy:
| Directive | Allow | Why |
|---|---|---|
script-src | https://cdn.lockstock.example | The loader and the widget |
script-src | 'sha256-j8zRpxva4xOWyrhRg9RnnbB5g2spW6OVH2cEK7JFhjA=' | The one-line snippet stub, unless you already allow inline scripts by nonce |
connect-src | https://api.lockstock.example | Search, chat and analytics requests |
font-src | https://cdn.lockstock.example | The default widget font. If you set a custom font URL, allow its host too |
img-src | your product image hosts | Product photos from your feed, and the logo you set for the chat header. Usually already allowed |
img-src | https://api.lockstock.example | Only if «Примерить у себя» is on for your store: the shopper's photo and the picture with the product in it are shown from the API |
The exact CDN and API hosts are shown in the dashboard next to your snippet.
Content-Security-Policy:
script-src 'self' https://cdn.lockstock.example 'sha256-j8zRpxva4xOWyrhRg9RnnbB5g2spW6OVH2cEK7JFhjA=';
connect-src 'self' https://api.lockstock.example;
font-src 'self' https://cdn.lockstock.example;
img-src 'self' https://images.your-store.example https://api.lockstock.example;Using a nonce
If your policy uses a nonce for inline scripts, put the same nonce attribute on the stub <script> instead of adding the hash. The hash only matches the stub exactly as shown on the install page.