Curious to see if anyone else has a problem showing unsafe images when previewing an email from the daily report.  In Chrome 129.0.6668/101 all images are broken when I click "Show Unsafe Images".  Developer extension says:

"Refused to load the image '<URL>' because it violates the following Content Security Policy directive: "img-src 'self' 'unsafe-inline' data:'"

I'm not sure if this is a setting in my specific browser or if it's a larger issue.  The explanation Chrome gives is here:

Let's break it down:

• Content Security Policy (CSP): CSP is a powerful security feature that allows website owners to control the resources (like scripts, styles, images, etc.) that a browser is allowed to load. It helps prevent cross-site scripting (XSS) attacks and other code injection vulnerabilities.
• img-src 'self' 'unsafe-inline' data:: This is the specific CSP directive that's causing the issue. It defines the allowed sources for images:
  • 'self': Only allows images from the same origin (domain, protocol, port) as the current website.
  • 'unsafe-inline': Allows images embedded directly within the HTML using inline styles (e.g., <img style="...">). This is generally considered less secure.
  • data:: Allows images loaded from data URLs (e.g., data:image/png;base64,...).
• Violation: The error message indicates that the image you're trying to load from the <URL> is not from the same origin, nor is it an inline image or a data URL. Therefore, it violates the CSP rules you've set up.

Possible Causes and Solutions:

• Missing or Incorrect CSP: You might not have a CSP set up correctly, or it might be too restrictive. You need to ensure that the CSP allows the image source you're trying to load.
  • Solution: Modify your CSP to include the domain of the image source. For example, if the image is from example.com, you could add 'example.com' to the img-src directive:

• Third-Party Images: If the image is from a different domain than your website, you need to explicitly allow it in your CSP.
  • Solution: Add the domain of the third-party image source to the img-src directive.
• CDN or External Resources: If you're using a CDN (Content Delivery Network) or other external resources for images, you need to ensure that the CSP allows the CDN's domain.
  • Solution: Add the CDN's domain to the img-src directive.
• Development Environment: In development environments, you might have a CSP that's too strict. You can temporarily disable CSP or loosen it for testing purposes. However, remember to re-enable and configure it properly for production.

Important Notes:

• Security: CSP is a crucial security feature. Avoid using 'unsafe-inline' and 'unsafe-eval' unless absolutely necessary.
• Testing: Always test your CSP thoroughly to ensure it doesn't block legitimate resources.
• Browser Support: CSP is supported by most modern browsers.

By carefully reviewing your CSP and ensuring that it allows the necessary image sources, you can resolve this error and load your images without issues.

Ed,

Xeams adds a Content-Security-Policy header in the request, preventing browsers from loading foreign images. You can disable this feature using the following steps:

• Locate server.properties file. Check https://www.xeams.com/server-properties.htm for details.
• Add the following line:
  
  use.content.security.policy.self=false
• Save
• Log out and log back in.

OK, thanks for the sharing that.  But I'm thinking that this setting should be set as it is normally and then when a user clicks the button "Show unsafe images" it should be turned of, otherwise the feature to view images is broken for anyone who uses Xeams.  Am I understanding that correctly?

It also looks like you are setting the headers to add the image sources to allow them to be displayed, but it could be that the headers are not being set correctly.  I have an email from Google with images that are located on www.gstatic.com and the Xeams response header look like this:

Content-Security-Policy: default-src 'self' 'unsafe-inline' 'unsafe-eval' h**ps://www.gstatic.com ;script-src 'self' 'unsafe-inline' 'unsafe-eval' h**p://www.google.com h**ps://www.gstatic.com h**ps://cdn.jsdelivr.net; object-src 'none';base-uri 'self';img-src 'self' 'unsafe-inline' data:

In this case the images are broken.  When I modify the response header like this:

Content-Security-Policy: default-src 'self' 'unsafe-inline' 'unsafe-eval' h**ps://www.gstatic.com

Now the images are displayed correctly.  I'm not a web developer, but I wonder if there is an error in the formatting of the response header that you are generating.

Sorry for all the posts, I found that by either removing ";img-src 'self' 'unsafe-inline" from the header and leaving everything else, the images are displayed correctly.  Or optionally just adding h**ps://www.gstatic.com to the img-src section also works.  So in summary we have the current head like this:

default-src 'self' 'unsafe-inline' 'unsafe-eval' h**ps://www.gstatic.com ;script-src 'self' 'unsafe-inline' 'unsafe-eval' h**p://www.google.com h**ps://www.gstatic.com h**ps://cdn.jsdelivr.net; object-src 'none';base-uri 'self';img-src 'self' 'unsafe-inline' data:

All images are broken.  Modifying the header like this:

default-src 'self' 'unsafe-inline' 'unsafe-eval' h**ps://www.gstatic.com ;script-src 'self' 'unsafe-inline' 'unsafe-eval' h**p://www.google.com h**ps://www.gstatic.com h**ps://cdn.jsdelivr.net; object-src 'none';base-uri 'self';img-src 'self' 'unsafe-inline' h**ps://www.gstatic.com data:

And now all the images are displayed correctly.

Can you please comment if you believe the email preview is currently working as expected?

My expectation is that if you have a button labeled "Show Unsafe Images", that it would in fact show the images and not show broken images in the preview. In previous versions this was the behavior.  I have identified the headers and the changes that I believe are needed to function as expected.  If there is no plan to implement this change, then it would be nice to know, so I can modify the server.properties file.  If you acknowledge that this is a problem that will be fixed, then I will wait for the fix.

Thanks

Ed,

You are correct. Xeams should remove this header before unsafe images are displayed. We have marked this for a future release.