Chrome app CSP online web font issue (CSS stylesheet fails to load)

[danielweck]

Refused to load the stylesheet 'https://fonts.googleapis.com/css?family=Open+Sans' because it violates the following Content Security Policy directive: "style-src 'self' blob: filesystem: data: chrome-extension-resource: 'unsafe-inline'".

[danielweck]

"Your Chrome App can only refer to scripts and objects within your app, with the exception of media files (apps can refer to video and audio outside the package). Chrome extensions will let you relax the default Content Security Policy; Chrome Apps won’t."

style-src 'self' data: chrome-extension-resource: 'unsafe-inline';
font-src 'self' data: chrome-extension-resource:;

https://developer.chrome.com/apps/contentSecurityPolicy#what

[danielweck]

So, for the Chrome app there are two options:

1. exclude online fonts from the build configuration, keep only local fonts
2. download the fonts so they are shipped with the app

[rkwright]

Let's just bundle the OpenSans and the Old Standard TT font with the app. Perhaps later we can look at more complicated and/or sophisticated solutions, but for now let's keep it simple. It's also probably more secure since we won't be mucking around with external resources of unvalidated security.

[danielweck]

Fixed
c232483

[jayasharma8]

Hi guys,

I need little help. I am using nonce approach to remove unsafe-inline and unsafe-eval from header part.

I have added nonce to all the required places like this : <script type="text/javascript" nonce="${sessionScope.scriptNonce}">

when load my application in chrome, UI is not loaded properly. and it is giving multiple errors

The Content Security Policy directive 'default-src' contains 'script-src' as a source expression. Did you mean 'default-src ...; script-src...' (note the semicolon)?
login:1 Unrecognized Content-Security-Policy directive '*.googleapis.com'.

login:5 Refused to load the stylesheet 'http://localhost:7003/c/portal/css_cached?themeId=firstam_WAR_portaltheme&colorSchemeId=01' because it violates the following Content Security Policy directive: "style-src 'nonce-1qb7s4f55fxzl'".

login:5 Refused to load the stylesheet 'http://localhost:7003/html/js/calendar/skins/aqua/theme.css' because it violates the following Content Security Policy directive: "style-src 'nonce-1qb7s4f55fxzl'".

login:5 Refused to apply inline style because it violates the following Content Security Policy directive: "style-src 'nonce-1qb7s4f55fxzl'". Either the 'unsafe-inline' keyword, a hash ('sha256-ODatFrN2Ae2ClCoi7nm/wC4CjnwiCL8Z3HVffab3HBM='), or a nonce ('nonce-...') is required to enable inline execution.

login:5 Refused to execute inline script because it violates the following Content Security Policy directive: "default-src 'self' script-src 'self' 'nonce-1qb7s4f55fxzl'". Either the 'unsafe-inline' keyword, a hash ('sha256-4KHTAIDZpr+SFoqo9Hq2giHLqxk20UBgsEA0DtC6mY4='), or a nonce ('nonce-...') is required to enable inline execution. Note also that 'script-src' was not explicitly set, so 'default-src' is used as a fallback.

login:5 Refused to execute inline script because it violates the following Content Security Policy directive: "default-src 'self' script-src 'self' 'nonce-1qb7s4f55fxzl'". Either the 'unsafe-inline' keyword, a hash ('sha256-1pAsmYjfphxPu5L8he1R0jtWkwqLfmiOPMUPhq6X4VU='), or a nonce ('nonce-...') is required to enable inline execution. Note also that 'script-src' was not explicitly set, so 'default-src' is used as a fallback.

I request if anyone can help

Thanks

[danielweck]

@jayasharma8 is this related to the Chrome app, or the cloud / web reader? If the latter, I suggest you open a new issue. If the former, why are there references to http://localhost:7003 in your console logs?