CSP header default-src: data:

Question

I am testing CSP header implementation. The implemented header value is:

Content-Security-Policy: default-src 'self' data:; style-src 'self' 'unsafe-inline'; script-src 'self' 'unsafe-inline' 'unsafe-eval'
X-Content-Security-Policy: default-src 'self' data:; style-src 'self' 'unsafe-inline'; script-src 'self' 'unsafe-inline' 'unsafe-eval'
X-WebKit-CSP: default-src 'self' data:; style-src 'self' 'unsafe-inline'; script-src 'self' 'unsafe-inline' 'unsafe-eval'

I know that because of unsafe-inline it is not recommended configuration, but I do not understend the meaning of "data:" as URI. If it is a URI that should mean that data is a scheme (like https, ftp etc.), but I don't understand the purpose of this?

Additionally is it recommended to use also X-Content-Security-Policy and X-WebKit-CSP headers, aren't they deprecated?

Answer 1

What does data do

It allows data URIs, such as:

data:text/html;charset=utf-8;base64,PGgzPkhpPC9oMz4=

to be used as sources.

Data URIs can contain any content, they are quite widely used, as they can reduce the amount of URLs that are requested when the site loads.

Should I use it

Not if you want to limit the damage of injection and can avoid it, as it lets anyone who can inject into the page use a data URI containing any content they want.

Should all 3 headers be used

They don't need to be used for Chrome and Firefox, but as CanIUse shows, there are browsers which still need special headers.