question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Investigate embedding Partytown via a cross-origin iframe

See original GitHub issue

I believe that Partytown’s isolation could be improved by embedding it via a cross-origin iframe rather than directly as a worker.

Problem

Because the worker inherits the embedding page’s origin, it can access data from that origin via APIs like self.indexedDB that are available in the WorkerGlobalScope.

Proposed solution

Instead of integrating Partytown directly into the embedding document as described in the documentation, users could instead host the service worker, the web worker, and a minimal HTML document on a separate origin:

  • document.com
    • /index.html - the embedding document
  • sandbox.com
    • /sandbox.html - the sandbox iframe
    • /web-worker.js - the web worker script
    • /service-worker.js - the service worker script

The sandbox iframe would be responsible for

  1. registering the service worker
  2. starting the web worker
  3. exposing Partytown’s API to the embedding document via postMessage

This will impose a small latency cost for the extra postMessage hop between the iframe and the embedding document, but would ensure that the web worker cannot access any resources from the embedding document that are subject to the same origin policy.

Issue Analytics

  • State:open
  • Created 2 years ago
  • Comments:7 (7 by maintainers)

github_iconTop GitHub Comments

1reaction
emilisbcommented, Dec 7, 2022

Hi @adamdbradley @steve8708 , I started working on this feature. I made a quick and hacky POC to get it work (both SW and Atomics). I moved the service worker and the web worker to a cross-origin iframe which communicates with the main thread via postMessage and then passes all messages to web worker/service worker. Now I am trying to use a MessageChannel instead, that way we would avoid an additional message hop and performance should stay more or less the same as it is now. Atomics also work with this approach as long as both the main document and the new iframe satisfy crossOriginIsolated requirements.

I can finish it and open a PR, but I have a few questions:

  1. Would you take a PR for this? Do you have any specific requirements for this feature, such as make this new communication mechanism opt-in?
  2. Why does SW sandbox currently run inside an iframe? I cannot understand how it improves the isolation.

We can discuss this on Discord if that is more convenient for you, I left a message in partytown-general channel.

0reactions
lawnseacommented, Sep 27, 2021

@steve8708, I agree that Atomics plus a sandbox iframe without the allow-same-origin permission would be simpler and faster. Unfortunately, it doesn’t look like it’s possible to use a service worker with such an iframe: w3c/ServiceWorker#1390.

One consequence of this situation to note is that the service worker implementation provides an opportunity for stronger isolation, as the SW controls network requests from the web worker. For that reason, I hope we can support the Atomics implementation with the cross-origin iframe setup as well.

Read more comments on GitHub >

github_iconTop Results From Across the Web

Trade-Offs - Partytown - Builder.io
Using Partytown to orchestrate third-party scripts vs. adding them to your ... If an iframe was created with Partytown, and the iframe is...
Read more >
Making your website "cross-origin isolated" using COOP and ...
You can enable cross-origin isolation on a document embedded within an iframe by applying allow="cross-origin-isolated" feature policy to the <iframe> tag and ...
Read more >
Don't Sink Your Website With Third Parties
CDN Finder is a convenient tool to investigate which CDNs (if any) a third-party tag is using. Loading Scripts Asynchronously #. Blocking other ......
Read more >
Inception: manipulating cross-domain iframes with JavaScript
However, using a conventional iframe does not allow the external site ... What is allowed however, is to embed a <script> tag that...
Read more >
Cross-origin communication in between iframe and it's parent ...
The contentWindow property returns the Window object generated by an iframe element (through the window object, you can access the document ...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found