If you are using a Content Security Policy (CSP) on your website, you need to add the following directives to allow Hyvor Talk to work properly.
Here is an example of a CSP header:
script-src-elem https://talk.hyvor.com;
connect-src wss: https://*.hyvor.com;
img-src https://*.hyvor.com https://www.gravatar.com;
style-src-elem 'nonce-<random-nonce>'
See the following sections for more details.
Hyvor Talk loads embed scripts from https://talk.hyvor.com
. Therefore, you need to
add the following directive to your CSP:
script-src-elem https://talk.hyvor.com;
If you have enabled real-time features (enabled by default), you need to add the following directives to your CSP:
connect-src wss: https://*.hyvor.com
If you have not enabled real-time features, you can use this instead:
connect-src https://talk.hyvor.com
Hyvor Talk loads profile pictures and other media images from talk.hyvor.com
,
cdn.hyvor.com
, and Gravatar.
img-src https://*.hyvor.com https://www.gravatar.com
Due to the dynamic nature of the Hyvor Talk embeds, we use inline styles. Therefore, you need to use a nonce to allow inline styles. Usually, you may generate a random nonce on the server-side and add it to the CSP header.
style-src-elem 'nonce-<YOUR-NONCE>'
Then, you should add the set the same nonce as an attribute in the embeds:
<hyvor-talk-comments
website-id="YOUR_WEBSITE_ID"
page-id=""
nonce="<YOUR-NONCE>"
></hyvor-talk-comments>
If you cannot generate a nonce, you can use the following directive. But, it is less secure.
style-src 'unsafe-inline'