Best practice regarding Security-Relevant HTTP Headers

[magosk]

Thanks Alexandre for the detailed explanation. Based on your suggestion, Jose's and some other examples I saw I tried with the following code in IWServerControllerBaseBeforeDispatch (I ended up adding custom header code there since I had to make some exceptions based on request contents). (Note that i took away 'frame-ancestor' since I got a message that it was in conflict with X-Frame-Options which I also set).

Code:

  if CSPEnabled then
  begin
    NonceStr := 'nonce-' + aReply.Nonce;
    aReply.Headers.Values['Content-Security-Policy'] := Format(
//      'frame-ancestors ''none''; ' +
      'base-uri ''self''; ' +
      'default-src ''self'' ''%s'' ''unsafe-eval''; ' +
      'script-src ''self'' ''%s'' ''unsafe-eval'' ''unsafe-inline''; ' +
      'style-src ''self'' ''%s'' ''unsafe-inline''; ' +
      'img-src ''self'';', [NonceStr, NonceStr, NonceStr]);
  end{if};

The resulting header looks like this (from IE11 browser network capture):

Code:

Key    Value
Content-Security-Policy    frame-ancestors 'none'; base-uri 'self'; default-src 'self' 'nonce-TktBTfCDkv9C6TZKmz3WgwM6mGs' 'unsafe-eval'; script-src 'self' 'nonce-TktBTfCDkv9C6TZKmz3WgwM6mGs' 'unsafe-eval' 'unsafe-inline'; style-src 'self' 'nonce-TktBTfCDkv9C6TZKmz3WgwM6mGs' 'unsafe-inline'; img-src 'self';

But I get errors in Chrome and Firefox already on our start page (a login page). The following is from the Chrome console:

Code:

IWBackIntercept__ED5577121.js:82 Refused to apply inline style because it violates the following Content Security Policy directive: "style-src 'self' 'nonce-LIVJbVIkgn8QhRhHqbkldhAeZR4' 'unsafe-inline'". Note that 'unsafe-inline' is ignored if either a hash or nonce value is present in the source list.
Init @ IWBackIntercept__ED5577121.js:82
(anonymous) @ (index):33
(index):179 Refused to apply inline style because it violates the following Content Security Policy directive: "style-src 'self' 'nonce-LIVJbVIkgn8QhRhHqbkldhAeZR4' 'unsafe-inline'". Note that 'unsafe-inline' is ignored if either a hash or nonce value is present in the source list.
(index):185 Refused to apply inline style because it violates the following Content Security Policy directive: "style-src 'self' 'nonce-LIVJbVIkgn8QhRhHqbkldhAeZR4' 'unsafe-inline'". Note that 'unsafe-inline' is ignored if either a hash or nonce value is present in the source list.
(index):133 Refused to execute inline event handler because it violates the following Content Security Policy directive: "script-src 'self' 'nonce-LIVJbVIkgn8QhRhHqbkldhAeZR4' 'unsafe-eval' 'unsafe-inline'". Note that 'unsafe-inline' is ignored if either a hash or nonce value is present in the source list.

As I am new to this, I am guessing I am missing some basic thing here. Any feedback is appreciated.
EDIT: If I remove the nonce parts from the header it seems to run without errors in Chrome and Firefox. Is the remaining CSP header still meaningful (i.e. can it still be regarded as a security improvement)?