Universal: proposal: add 'nonce' attribute to transfer-state script

[peterpeterparker]

• I'm submitting a ...
  [X ] feature request

• What modules are related to this Issue?
  [X ] express-engine

• Do you want to request a feature or report a bug?

I would like to suggest a feature

• What is the current behavior?

I have a route with a dynamic param (like http://localhost:8000/route/:id).
For each :id I perform an http query on the server side, set the result in transfer-state and then on the client side get the value from transfer-state.

This will generate in the html output a script window['TRANSFER_STATE'] which gonna be dynamic respectively which gonna change according the requested data.

Therefore the problem is the following: it's not possible to define a proper Content-Security-Policy because the hash value of the script gonna change dynamically too respectively it won't be possible to add a 'sha256-..... value for the transfer-state script since it gonna change.

To solve this, I suggest to set an attribute nonce to the transfer-state script to have then the possibility to reference this value in the content security policy.

This could be solved by adding a single line in server-transfer-state.ts:

renderer.setAttribute(script, 'nonce', 'my-transfer-state');

Which then let user setting a policy like:

<meta http-equiv="Content-Security-Policy" content="script-src: 'nonce-my-transfer-state'"/>

Agree or is that a bad idea and dangerous?

• Please tell us about your environment:

• Angular version: 4.3.3

• Platform: NodeJs / Express

[PatrickJS]

nice, yeah that sounds like a good idea.
cc @vikerman

[Toxicable]

Will keep this in mind when implementing once we've decided on an API https://github.com/angular/universal/issues/791

[peterpeterparker]

cool! if I've got time this week I could then try to submit a PR to universal-starter for the time being before the API

[peterpeterparker]

PR for universal-starter created ;)

[vikerman]

Will take this into consideration when designing the API for the state transfer. Adding a fixed nonce completely defeats the CSP mechanism - And at that point CSP might as well be turned off.

[Toxicable]

obsolete via https://github.com/angular/angular/commit/cfd9ca0d6f453decc154cc640351f5af67685510

[PatrickJS]

so transfer state will use a script tag to provide json rather than js.

<--             \/ notice the type          !-->
<script type="application/json">
{
  your: 'data'
}
</script>

since the type isn't js the browser won't parse it as javascript and the framework will convert it's content into json via .textContent. Since this is a non-JavaScript type CSP won't restrict it so this is much more safe. I'll close this since the new api has been merged

[angular-automatic-lock-bot[bot]]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{_This action has been performed automatically by a bot._}