Intro
Content Security Policy (CSP) is a computer security standard introduced to prevent cross-site scripting (XSS), clickjacking and other code injection attacks resulting from execution of malicious content in the trusted web page context.
If you use CSP on your website, you need to add one of the following rules to make Userlike work.
Rule with font loading
Use this CSP rule when you intend to use custom webfonts in the Website Messenger.
javascriptchild-src 'self' api.userlike.com userlike-cdn-widgets.s3-eu-west-1.amazonaws.com userlike-cdn-umm.b-cdn.net blob:; connect-src wss://umd.userlike.com umd.userlike.com api.userlike.com userlike-cdn-web.b-cdn.net www.userlike.com blob: userlike-cdn-umm.b-cdn.net userlike-cdn-widgets.s3-eu-west-1.amazonaws.com; font-src data: userlike-cdn-umm.b-cdn.net fonts.gstatic.com; frame-src 'self' api.userlike.com userlike-cdn-widgets.s3-eu-west-1.amazonaws.com userlike-cdn-umm.b-cdn.net www.youtube.com player.vimeo.com; img-src data: blob: userlike-cdn-operators.userlike.com userlike-cdn-operators.s3-eu-west-1.amazonaws.com userlike-cdn-web.b-cdn.net www.userlike.com userlike-store-media-files.s3.amazonaws.com i.ytimg.com userlike-cdn-media-files.userlike.com; media-src userlike-cdn-umm.b-cdn.net userlike-store-media-files.s3.amazonaws.com www.userlike.com blob:; object-src 'none'; script-src 'self' 'unsafe-inline' 'wasm-unsafe-eval' api.userlike.com userlike-cdn-widgets.s3-eu-west-1.amazonaws.com userlike-cdn-umm.b-cdn.net
Rule without font loading
Use this CSP rule when you intend to use system fonts in the Website Messenger.
javascriptchild-src 'self' api.userlike.com userlike-cdn-widgets.s3-eu-west-1.amazonaws.com userlike-cdn-umm.b-cdn.net blob:; connect-src wss://umd.userlike.com umd.userlike.com api.userlike.com userlike-cdn-web.b-cdn.net www.userlike.com blob: userlike-cdn-umm.b-cdn.net userlike-cdn-widgets.s3-eu-west-1.amazonaws.com; frame-src 'self' api.userlike.com userlike-cdn-widgets.s3-eu-west-1.amazonaws.com userlike-cdn-umm.b-cdn.net www.youtube.com player.vimeo.com; img-src data: blob: userlike-cdn-operators.userlike.com userlike-cdn-operators.s3-eu-west-1.amazonaws.com userlike-cdn-web.b-cdn.net www.userlike.com userlike-store-media-files.s3.amazonaws.com i.ytimg.com userlike-cdn-media-files.userlike.com; media-src userlike-cdn-umm.b-cdn.net userlike-store-media-files.s3.amazonaws.com www.userlike.com blob:; object-src 'none'; script-src 'self' 'unsafe-inline' 'wasm-unsafe-eval' api.userlike.com userlike-cdn-widgets.s3-eu-west-1.amazonaws.com userlike-cdn-umm.b-cdn.net
Using Our Widget with a Strict CSP Policy
Our widget relies on dynamically injected inline scripts and styles to function correctly. If youโre enforcing a strict Content Security Policy (CSP), we recommend using a CSP nonceโa unique, cryptographically secure token added to specific inline scripts and styles.
A CSP nonce ensures that only scripts and styles with the matching token are executed, while all others are blocked.
๐ Learn more about CSP nonces: https://content-security-policy.com/nonce/
If your site uses CSP nonces, you can still integrate our widget by using the Messenger API.
๐ For setup instructions, check out our documentation:
Example:
plain textapi.mount({ nonce: 'YOUR_NONCE' })
โ ๏ธ Note: Due to technical limitations, the voice recording and emoji picker features are not available when using a CSP nonce.
If you are integrating Userlike via our script tag, you can simply add your nonce to that using the
nonce
attribute:plain text<script async type="text/javascript" src="https://userlike-cdn-widgets...." nonce="YOUR_NONCE"></script>