Helmet is displaying error when toast is displayed

Question

Has anyone encountered this message while trying to display a toast while using Helmet?

The toast still displays but, I'm not sure why the error is.

Answer 1

Your browser seems to be blocking this because data: images are not whitelisted in the content security policy. The img-src directive of your CSP looks like this:

img-src 'self' https://cdnjs.cloudflare.com

It should look something like this:

img-src 'self' https://cdnjs.cloudflare.com data:

You can use Helmet to set this policy like this:

app.use(helmet.csp({
  directives: {
    // ...
    imgSrc: ["'self'", "https://cdnjs.cloudflare.com", "data:"]
  }
}))