Proposal: Declarative cross-origin communication in iframe and popup tags via Shared Worker

[ghost]

Context

Web developers need the ability to easily and securely communicate between different origins such as between their website and an iframe, or between their website and a new popup window, for example in the case of federated sign-in flows. However, cross-origin-policy makes those use cases very difficult to tackle with (#6364).

Proposal

In #6553, one suggested a declarative mechanism of network isolation for insecure HTML tags, which would be more in line with the HTML specification and easier to use and to reason about for web developers.

Building up on that declarative mechanism, we could very easily declare cross-origin communication flows, such as the ones generally needed by web developers, by leveraging the Shared Worker technology.

Examples

Website-Iframe Communication

For top and bottom level communication between the embedded siteB.com and the embedder siteA.com, we could declaratively make use of a shared worker from within the iframe tag.

From the main document at siteA.com:

<iframe src="https://siteB.com" allow-net="!https://siteA.com; https://siteA.com/sharedWorker.js; *">

</iframe>

Meaning here that :

1. the embedded siteB.com can not access any siteA.com resources (!https://siteA.com),
2. excepted the sharedWorker hosted on siteA.com (https://siteA.com/sharedWorker.js)
3. while having access to any other domain (*)

This way, siteB.com could pass information to siteA.com (and vice versa) via sharedWorker.js.

Website-Popup communication

For popups, we should be able to do the exact same thing, by introducing a new popup HTML tag such as, from the main document at siteA.com we would have:

<popup src="https://siteB.com" allow-net="!https://siteA.com; https://siteA.com/sharedWorker.js; *">

</popup>

[domenic]

Closing per whatwg/fetch#1209 (comment).