Configuring CSP with Dynamic Yield

Content Security Policy (CSP) is a security feature that helps protect web applications from attacks like cross-site scripting (XSS). It does this by enabling developers to specify which sources of content are safe to load, reducing the risk of malicious code being executed in users' browsers. The main goal of CSP is to enhance web application security by controlling and limiting content sources.

The following table describes the CSP directive configurations required to implement Dynamic Yield on your website using the Dynamic Yield script implementation and additional recommended and optional configurations that might be needed based on your needs and usage.

Required?	Directive	Value	Used for
Mandatory	connect-src	https://*.dynamicyield.com	Data collection and serving experiences
	script-src	https://*.dynamicyield.com 'unsafe-inline' 'unsafe-eval'	Loading the Dynamic Yield scripts and executing the code defined in the Dynamic yield variations
	style-src	https://*.dynamicyield.com 'unsafe-inline'	Applying CSS code defined in the Dynamic Yield variations
	img-src	https://*.dynamicyield.com data:	Serving images uploaded to the Dynamic Yield CDN and displaying base64 encoded images
Recommended	font-src	https://fonts.googleapis.com https://fonts.gstatic.com	Google Fonts, as defined in the Dynamic Yield template library
	script-src	https://cdnjs.cloudflare.co m/ajax/libs/Swiper/4.4.6/*	Carousel functionality, used in various Dynamic Yield templates.
	style-src	https://cdnjs.cloudflare.co m/ajax/libs/Swiper/4.4.6/*
	connect-src	https://*.dy-api.com	Used when making Choose calls directly from the browser
Optional	frame-src	https://www.youtube.com/	Used in the “Youtube Video” template
	frame-src	https://player.vimeo.com/	Used in the “Vimeo Video” template
	script-src	https://cdnjs.cloudflare.co m/ajax/libs/clipboard.js/*	Used in the “Get Coupon” template

📌
Notes

When using the Dynamic Yield's EU data center for "choose" API calls, use https://*.dy-api.eu instead of https://*.dy-api.com.

Additional directive values might be needed based on your usage (different campaigns or templates).

Using external libraries and resources in your variations requires including them in your CSP directive.

Examples

Recommended configuration using the default-src directive

Content-Security-Policy: default-src self https://*.dynamicyield.com https://*.dy-api.com 
https://cdnjs.cloudflare.com/ajax/libs/Swiper/4.4.6/* 
https://fonts.googleapis.com https://fonts.gstatic.com 
'unsafe-inline' 'unsafe-eval' data:;

Recommended configuration with directive-specific configuration

Content-Security-Policy: script-src self https://*.dynamicyield.com 
https://cdnjs.cloudflare.com/ajax/libs/Swiper/4.4.6/* 
'unsafe-inline' 'unsafe-eval'; connect-src https://*.dy-api.com; style-src self 
https://*.dynamicyield.com https://cdnjs.cloudflare.com/ajax/libs/Swiper/4.4.6/* 
'unsafe-inline'; connect-src https://*.dynamicyield.com; img-src https://*.dynamicyield.com data:; 
font-src https://fonts.googleapis.com https://fonts.gstatic.com;

📌Notes

Examples

📌
Notes