1

I use Content-Security-Policy:default-src 'self' header on my web page.

Chome throws error in the console when I load this page with enabled "Grammarly" chrome extension:

Refused to load the font 'data:font/woff;base64,d09GRgABAAAAAIt0ABEAAAABQDwAAQABAAAAAAAAAAAAAAAAAAAAA…CwKGBmIIpVWLACJWGwAUVjI2KwAiNEswkKAwIrswsQAwIrsxEWAwIrWbIEKAZFUkSzCxAEAisA' because it violates the following Content Security Policy directive: "default-src 'self'". Note that 'font-src' was not explicitly set, so 'default-src' is used as a fallback.

I think it could happen with other plugins as well.

What strategy do you use?

It's a bad experience to see the page with the errors in the console. And users will not care is this the actual page problem or they "loved extension".

As I see, this header is not widely used.

Andriy Kuba
  • 8,093
  • 2
  • 29
  • 46
  • 2
    That's a problem of the extension. There's nothing you should do about this. Well, maybe you can file a bugreport on the extension support site. – wOxxOm Nov 27 '15 at 16:57

2 Answers2

5

The strategy is to keep it as is. User's rarely if ever read the console or even open up devtools. You need to keep CSP enabled so that embeds and extensions can't leak user information from your site and have it claimed as something coming from your site.

You could proactively alert the user that there is a CSP violation by looking for requests via the window.performance.getEntriesByType("resource") and looking for resources that you know you didn't make (like CSP reporting)

Kinlan
  • 16,315
  • 5
  • 56
  • 88
  • Well, but this issue is present almost in every extension that adds some functionality to the page. It looks like a browser, Chrome for example, have inconsistency in the extension (app) architecture. I add an extension, Gramarrly and grant it access "read and change all your data on the website you visit", then Chrome must not throw an exception if it add some font to the page. If it's violate something then error must be shown directly. – Andriy Kuba Nov 27 '15 at 19:49
  • @AndriyKuba, there's no contradiction. The extension still can "read and change all your data on the website you visit" but it doesn't say that there are no restrictions. It's also possible that some method exists to circumvent the restriction. – wOxxOm Dec 03 '15 at 16:26
0

Add font-src to use data:, e.g.:

<meta http-equiv="Content-Security-Policy" content="default-src 'self'; font-src 'self' data:;">

And if you use CDNs, add as needed, e.g. for fonts.gstatic.com:

<meta http-equiv="Content-Security-Policy" content="default-src 'self'; font-src 'self' data: fonts.gstatic.com;">

More examples over at https://content-security-policy.com/

opyate
  • 5,388
  • 1
  • 37
  • 64