🚀 Feature Request: Support CSP nonces in Miniflare's live reload

[frandiox]

Describe the solution

Hi 👋

I would like to have support for CSP nonces in the Miniflare server with live reload:

When running Miniflare with liveReload: true, it injects a script to reload the browser when the code changes.
When the worker returns a Content-Security-Policy with a nonce, however, the browser cannot load the live reload script because it doesn't include the required nonce.

The nonce changes in every request so it can't be added statically. The fix would be adding the following code around here.

const nonce = response.headers.get("Content-Security-Policy")?.match(/'nonce-([^']+)'/)?.[1];
if (nonce) {
  liveReloadScript = encoder.encode(
    decoder.decode(liveReloadScript).replace('<script', `<script nonce="${nonce}"`)
  );
}

That ensures that the nonce is added to the script for every request.

After that, there's still another issue with the WS connection to the loopback server port, which might not be added to the CSP. This issue however might be harder to fix and perhaps the solution should be in userland to add connect-src: ws://localhost:* to ensure it covers the loopback server port...
Alternatively, connecting to 'self' (i.e. without specifying a port) to an obfuscated pathname and proxying that in the entry worker to the loopback server might work without changing user code 🤔

Thoughts?