Skip to main content

Content Security Policy (CSP)

If your website has a Content Security Policy (CSP), at least you need to have the following CSP headers. Else, the LoyJoy chat will not load. Do not set up CSP headers for specific sub domains of loyjoy.com or files under the loyjoy.com domain, as this will break upon future LoyJoy releases when file paths or sub domains change.

script-src *.loyjoy.com;
style-src 'unsafe-inline' *.loyjoy.com;
connect-src *.loyjoy.com wss://lpru5mjumh.execute-api.eu-central-1.amazonaws.com;
font-src *.loyjoy.com;
frame-src https: *.loyjoy.com;
img-src blob: data: *.loyjoy.com;
media-src blob: data: *.loyjoy.com;

Explanation of the CSP headers:

  • script-src allows the LoyJoy chat to load and execute JavaScript files from the LoyJoy domain.
  • style-src allows the LoyJoy chat to load CSS files from the LoyJoy domain. The unsafe-inline is used to inject fonts dynamically for the LoyJoy chat.
  • connect-src allows the LoyJoy chat to send data such as chat messages to the LoyJoy server. The wss://lpru5mjumh.execute-api.eu-central-1.amazonaws.com is optional and is used for a WebSocket connection in case the Live Chat module is active. If this header is not set, the LoyJoy chat will poll the LoyJoy server for new messages every few seconds, which is less efficient. Please note that no personal data (e.g. no chat messages) are sent to this endpoint, but only notifications about new messages and typing indicators.
  • font-src allows the LoyJoy chat to load fonts from the LoyJoy domain.
  • frame-src currently is needed for the Lottie module to render Lottie animations in a background iframe and the External Link module to embed YouTube videos in the chat.
  • img-src allows the LoyJoy chat to load images from the LoyJoy domain. The blob: and data: are needed for data URIs and images, which are generated dynamically and are provided as a blob URL or data URI in chat messages. If the chat should show images from other domains, those are needed here, too.
  • media-src allows the LoyJoy chat to load media files from the LoyJoy domain. The blob: and data: are needed for data URIs and media files, which are generated dynamically and are provided as a blob URL or data URI in chat messages. If the chat should show media from other domains, those are needed here, too.