Help CenterContent Security Policy, otherwise known as CSP, is an additional layer of security that can help you with detecting and mitigating various attacks, like Cross Site Scripting or Data Injection Attacks.
If you'd like to learn more about CSP itself, click here to check out the article prepared by the MDN web docs. For now, let's jump below to learn how to adjust your CSP directives so that they will fully support LiveChat.
Making changes to your Content Security Policy usually required making changes to your server's settings. If you are not a tech person, we strongly recommend sending this article to a person responsible for your server.
- CSPv3 - learn how to adjust your CSPv3 directives;
- CSPv2/1 - learn how to adjust your CSPv2/1 directives.
Modifying your Content Security Policy directives
CSPv3
1) Modifying your CSPv3 directives is relatively easy. All that you have to do is to edit the script-src directive so that it'll include the following entities: 'self', 'unsafe-inline' and 'unsafe-eval':
script-src 'self' 'unsafe-inline' 'unsafe-eval'
2) Now, all that is left is to whitelist *.livechatinc.com domain, by adding it as a list of whitelisted sources that can load content on your website. Whitelisting our domain should look like on the following example:
script-src 'self' 'unsafe-inline' 'unsafe-eval' *.livechatinc.com *.youtube.com *.google.com; media-src 'self' *.livechatinc.com *.youtube.com *.google.com; object-src 'self' *.livechatinc.com *.youtube.com *.google.com; child-src 'self' *.livechatinc.com *.youtube.com *.google.com; img-src 'self' *.livechatinc.com *.youtube.com *.google.com; style-src 'self' 'unsafe-inline' *.livechatinc.com *.youtube.com *.google.com;
And that's it! Just in case, here's the complete CSPv3 example that includes both, the included directives and whitelisted LiveChat domain:
content-security-policy: default-src 'self'; script-src 'self' 'unsafe-inline' 'unsafe-eval' *.livechatinc.com *.youtube.com *.google.com; media-src 'self' *.livechatinc.com *.youtube.com *.google.com; object-src 'self' *.livechatinc.com *.youtube.com *.google.com; child-src 'self' *.livechatinc.com *.youtube.com *.google.com; img-src 'self' *.livechatinc.com *.youtube.com *.google.com; style-src 'self' 'unsafe-inline' *.livechatinc.com *.youtube.com *.google.com;
CSPv2/1
In terms of modifying your CSPv2/1 directives, the drill is almost the same. Here you also have to make sure that our *.livechatinc.com domains will be whitelisted, but you also have to modify your style-src directives, so that they will include the following entity: 'unsafe-inline'
Here's the example of the complete CSPv2/1 that includes both, our whitelisted domain and the modification to the style-src directive:
connect-src: https://api.livechatinc.com https://cdn.livechatinc.com https://secure.livechatinc.com https://youtube.com https://google.com https://fonts.google.com child-src: https://api.livechatinc.com https://cdn.livechatinc.com https://secure.livechatinc.com https://youtube.com https://google.com https://fonts.google.com font-src: https://cdn.livechatinc.com https://secure.livechatinc.com https://fonts.google.com media-src: https://cdn.livechatinc.com https://secure.livechatinc.com https://cdn.livechat-static.com img-src: data: https://cdn.livechatinc.com https://secure.livechatinc.com https://cdn.livechat-static.com script-src: https://cdn.livechatinc.com https://secure.livechatinc.com https://cdn.livechat-static.com style-src: 'unsafe-inline'
And now you're ready to provide your customers, with the quality support that they need! If you need any additional information on this topic, don't hesitate to start a chat with us - we are available 24/7/365!