Feature Request

In #3393 (PR #3443), we added a new prop nonce. This prop is currently used for injecting <style> element.

We should expand this prop to support <img> and other media elements that requires nonce to operate.

What it will change

(This CSP is not exhaustive, just to illustrate the differences.)

Today

Developer must use a URL-based source for <img> and other media elements.

<meta http-equiv="Content-Security-Policy" content="img-src https://example.com; style-src nonce-a1b2c3d" />

In Web Chat, when we render an image from the bot:

<img src="https://example.com/image.png" />

Tomorrow

Developer can use a nonce-based source for <img> and other media elements.

<meta http-equiv="Content-Security-Policy" content="img-src nonce-a1b2c3d; style-src nonce-a1b2c3d" />

In Web Chat, when we render an image from the bot, the nonce will be added:

<img nonce="a1b2c3d" src="https://example.com/image.png" />

[Enhancement]