Embed with Content Security Policy

# 2 years ago
derloris Member	Hello! Is it possible to embed a WordArt-cloud on a website with an active Content Security Policy, which becomes more and more important nowadays? WordArt uses inline style elements, so there are some troubles, I think. Allowing 'self' and "*.wordart.com" also doesn't work well.

# 2 years ago
Alex Key Master	Hi! To the best of my knowledge "Content Security Policy" is controlled by your website administrator and he has to white list "*.wordart.com" domain to allow loading wordart scripts. Do you have any suggestions about what can be done from WordArt.com side to simplify the process?

# 2 years ago
derloris Member	I tested the CSP with whitelisting 'self' and *.wordart.com in the meta-tag of the html page, but the cloud was not shown correctly (e.g. too small and wrong hover effects). (There were no problems with other elements of other providers like frames, so the CSP itself should be fine.) I think this is because of inline styles within the wordart-scripts; see https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Security-Policy/style-src and scroll down to "examples", here they say: "As well [blocked are] styles that are applied in JavaScript by setting the style attribute directly, or by setting cssText. […] However, styles properties that are set directly on the element's style property will not be blocked, allowing users to safely manipulate styles via JavaScript". So maybe changing the code by separating script and style can help. (As an alternative way they also talk about nonces and hashes, but I'm not an CSP- (or coding) expert, so I don't know if this would fit here.) Edited 24 Jan, 2022 20:55

# 2 years ago

derloris

Member

I tested the CSP with whitelisting 'self' and *.wordart.com in the meta-tag of the html page, but the cloud was not shown correctly (e.g. too small and wrong hover effects).

(There were no problems with other elements of other providers like frames, so the CSP itself should be fine.)

I think this is because of inline styles within the wordart-scripts; see https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Security-Policy/style-src and scroll down to "examples", here they say:

"As well [blocked are] styles that are applied in JavaScript by setting the style attribute directly, or by setting cssText. […] However, styles properties that are set directly on the element's style property will not be blocked, allowing users to safely manipulate styles via JavaScript".

So maybe changing the code by separating script and style can help. smile

(As an alternative way they also talk about nonces and hashes, but I'm not an CSP- (or coding) expert, so I don't know if this would fit here.)

Edited 24 Jan, 2022 20:55

# 2 years ago
Alex Key Master	It doesn't seem that your issue is CSP related. Could you please send the URL of the webpage where you embedded your wordart to the support, so I could have a look what is wrong there?

Reply