Skip to content
This repository was archived by the owner on Feb 25, 2025. It is now read-only.

Conversation

@ditman
Copy link
Member

@ditman ditman commented Jun 14, 2023

This PR adds a nonce JS configuration attribute so users can pass a nonce value to their flutter engine initialization code.

This nonce is used to mark all scripts/styles needed by Flutter web that are considered unsafe-inline by CSP. In this change, there are only two tags that benefit from this:

  • canvaskit.js
  • inline styles for text editing

Before this change, the most strict CSP that allows a Flutter Web app to run would look like:

script-src 'self' 'nonce-flutter-init-scripts' 'wasm-unsafe-eval' https://www.gstatic.com/flutter-canvaskit/;
font-src https://fonts.gstatic.com;
style-src 'unsafe-inline';

After this change, CSP could be tightened to:

script-src 'self' 'nonce-YOUR_NONCE_VALUE' 'wasm-unsafe-eval';
font-src https://fonts.gstatic.com;
style-src 'nonce-YOUR_NONCE_VALUE';

By initializing the Flutter web app with something like this:

<meta http-equiv="Content-Security-Policy" content="script-src 'self' 'nonce-YOUR_NONCE_VALUE' 'wasm-unsafe-eval'; font-src https://fonts.gstatic.com; style-src 'nonce-YOUR_NONCE_VALUE';">

...

<script nonce="YOUR_NONCE_VALUE">
  _flutter.loader.loadEntrypoint({
    onEntrypointLoaded: async function(engineInitializer) {
      let appRunner = await engineInitializer.initializeEngine({
        nonce: 'YOUR_NONCE_VALUE',
      });
      appRunner.runApp();
    }
  });
</script>

Issues

Fixes flutter/flutter#126977 (does not address flutter.js, that's a different story)
Helps with flutter/flutter#80221


Pre-launch Checklist

  • I read the Contributor Guide and followed the process outlined there for submitting PRs.
  • I read the Tree Hygiene wiki page, which explains my responsibilities.
  • I read and followed the Flutter Style Guide and the C++, Objective-C, Java style guides.
  • I listed at least one issue that this PR fixes in the description above.
  • I added new tests to check the change I am making or feature I am adding, or Hixie said the PR is test-exempt. See testing the engine for instructions on writing and running engine tests.
  • I updated/added relevant documentation (doc comments with ///).
  • I signed the CLA.
  • All existing and new tests are passing.

If you need help, consider asking for advice on the #hackers-new channel on Discord.

@github-actions github-actions bot added the platform-web Code specifically for the web engine label Jun 14, 2023
Copy link
Contributor

@yjbanov yjbanov left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

lgtm

@flutter-dashboard

This comment was marked as outdated.

@ditman
Copy link
Member Author

ditman commented Jun 28, 2023

It's impossible that this affects goldens, my beloved bot, go home, you're drunk!

Copy link

@jacobsimionato jacobsimionato left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks great! Thanks very much, David!!

@ditman
Copy link
Member Author

ditman commented Jun 30, 2023

(Updating branch to see if it restarts gold tests)

@ditman ditman added autosubmit Merge PR when tree becomes green via auto submit App and removed will affect goldens labels Jun 30, 2023
@auto-submit auto-submit bot merged commit 099a70e into flutter:main Jun 30, 2023
@ditman ditman deleted the web-add-nonce branch June 30, 2023 01:50
engine-flutter-autoroll added a commit to engine-flutter-autoroll/flutter that referenced this pull request Jun 30, 2023
auto-submit bot pushed a commit to flutter/flutter that referenced this pull request Jun 30, 2023
…129818)

flutter/engine@d333434...099a70e

2023-06-30 [email protected] [web] Add nonce configuration. (flutter/engine#42829)
2023-06-30 [email protected] [Impeller] Unwrap optional procs in EntityPass (flutter/engine#43352)
2023-06-30 [email protected] [Impeller] Assign missing user to TODO. (flutter/engine#43351)
2023-06-29 [email protected] Roll Skia from a1ae27969207 to 2d05e3ec6b67 (1 revision) (flutter/engine#43350)
2023-06-29 [email protected] Roll Dart SDK from ecc2440be198 to 2d98d9e27dae (1 revision) (flutter/engine#43347)
2023-06-29 [email protected] [Impeller] Check for lazy memory support. (flutter/engine#43339)
2023-06-29 [email protected] [Impeller] Remove all double empties (flutter/engine#43345)

If this roll has caused a breakage, revert this CL and stop the roller
using the controls here:
https://autoroll.skia.org/r/flutter-engine-flutter-autoroll
Please CC [email protected],[email protected],[email protected] on the revert to ensure that a human
is aware of the problem.

To file a bug in Flutter: https://github.com/flutter/flutter/issues/new/choose

To report a problem with the AutoRoller itself, please file a bug:
https://bugs.chromium.org/p/skia/issues/entry?template=Autoroller+Bug

Documentation for the AutoRoller is here:
https://skia.googlesource.com/buildbot/+doc/main/autoroll/README.md
kjlubick pushed a commit to kjlubick/engine that referenced this pull request Jul 14, 2023
This PR adds a `nonce` JS configuration attribute so users can pass a nonce value to their flutter engine initialization code.

This `nonce` is used to mark all scripts/styles needed by Flutter web that are considered `unsafe-inline` by CSP. In this change, there are only two tags that benefit from this:

* canvaskit.js
* inline styles for text editing

Before this change, the most strict CSP that allows a Flutter Web app to run would look like:

```
script-src 'self' 'nonce-flutter-init-scripts' 'wasm-unsafe-eval' https://www.gstatic.com/flutter-canvaskit/;
font-src https://fonts.gstatic.com;
style-src 'unsafe-inline';
```

After this change, CSP could be tightened to:

```
script-src 'self' 'nonce-YOUR_NONCE_VALUE' 'wasm-unsafe-eval';
font-src https://fonts.gstatic.com;
style-src 'nonce-YOUR_NONCE_VALUE';
```

By initializing the Flutter web app with something like this:

```html
<meta http-equiv="Content-Security-Policy" content="script-src 'self' 'nonce-YOUR_NONCE_VALUE' 'wasm-unsafe-eval'; font-src https://fonts.gstatic.com; style-src 'nonce-YOUR_NONCE_VALUE';">

...

<script nonce="YOUR_NONCE_VALUE">
  _flutter.loader.loadEntrypoint({
    onEntrypointLoaded: async function(engineInitializer) {
      let appRunner = await engineInitializer.initializeEngine({
        nonce: 'YOUR_NONCE_VALUE',
      });
      appRunner.runApp();
    }
  });
</script>
```

## Issues

Fixes flutter/flutter#126977 (does not address `flutter.js`, that's a [different story](flutter/flutter#128061))
Helps with flutter/flutter#80221

---

[C++, Objective-C, Java style guides]: https://github.com/flutter/engine/blob/main/CONTRIBUTING.md#style
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.

Labels

autosubmit Merge PR when tree becomes green via auto submit App platform-web Code specifically for the web engine

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Add the ability to pass a CSP nonce to flutter.js that will be used when loading additional scripts

3 participants