Content Security Policy and Impact on Personalize

What is Content Security Policy

Content Security Policy (CSP) for websites is a security mechanism that allows web administrators to define and enforce rules for how resources (such as scripts, stylesheets, images, and fonts) are loaded and executed on their websites. It helps protect against cross-site scripting (XSS) attacks and other types of code injection vulnerabilities.

CSP works by specifying an HTTP header or a meta tag in the website's HTML code, which contains a policy directive defining the allowed sources for various types of content. These sources can include hostnames, paths, or specific types of content (e.g., 'self' for the same origin, 'none' for disallowed, 'unsafe-inline' for inline scripts/styles, and 'unsafe-eval' for evaluating code dynamically).

HTML
<head>
    <meta http-equiv="Content-Security-Policy" content="default-src 'self'; script-src 'self' 'unsafe-inline' www.example.com; style-src 'self' 'unsafe-inline' fonts.googleapis.com; img-src 'self' data:; font-src 'self' fonts.gstatic.com;">
</head>

In this example:

  • default-src 'self'; sets the default policy for all resource types to only allow resources from the same origin ('self').

  • script-src 'self' 'unsafe-inline' www.example.com; allows scripts to be loaded from the same origin ('self'), allows inline scripts ('unsafe-inline'), and allows scripts from www.example.com.

  • style-src 'self' 'unsafe-inline' fonts.googleapis.com; allows stylesheets to be loaded from the same origin ('self'), allows inline styles ('unsafe-inline'), and allows stylesheets from fonts.googleapis.com.

  • img-src 'self' data:; allows images to be loaded from the same origin ('self') and allows data URLs.

  • font-src 'self' fonts.gstatic.com; allows fonts to be loaded from the same origin ('self') and allows fonts from fonts.gstatic.com.

Why is CSP important

When a user visits a website with CSP enabled, their browser will check if the requested resources comply with the defined policy. If any resources do not meet the policy's rules, the browser may block or modify their behavior, depending on the configuration.

CSP provides several benefits, including:

  1. Mitigation of XSS attacks: By restricting the sources of executable code, CSP reduces the risk of malicious code injection by only allowing trusted sources.

  2. Protection against data exfiltration: CSP can prevent unauthorized data transmissions by limiting the origins to which data can be sent.

  3. Protection against clickjacking: CSP can prevent clickjacking attacks by restricting the frame or iframe sources.

  4. Enhanced security posture: CSP helps in fortifying the overall security of web applications and websites by providing an additional layer of protection against various types of attacks.

How does it impact Personalize

If you have implemented a Content Security Policy (CSP) for your website, which specifies the allowed sources for loading your website's content, browsers will reject content from sources that are not whitelisted. In this scenario, browsers will not permit MoEngage to load content on your website. As a result, the loading of variations that you have created in MoEngage may be affected.

How to navigate CSP

To enable MoEngage to load variations on your website and generate previews for your variations, you need to whitelist MoEngage by updating the corresponding rules in your existing Content Security Policy (CSP).

Policy Directive

What To Add To The Directive?

script-src-elem or script-src

*.moengage.com

style-src

'unsafe-hashes' *.moengage.com fonts.googleapis.com

img-src

*.moengage.com moe-email-campaigns.s3.amazonaws.com

font-src

*.moengage.com fonts.googleapis.com fonts.gstatic.com;

connect-src

*.moengage.com

frame-src

*.moengage.com

media-src

*.moengage.com

Previous

Next

Was this article helpful?
0 out of 0 found this helpful

How can we improve this article?