Avoid CORS by adding the required headers ON THE WORKER ITSELF instead of proxying to a webserver

[MtDalPizzol]

Hi, folks! I've been working on getting AdSense and Google Publisher Tag working through workers with Partytown.

I believe I actually got pretty far with this, as you can see in the console of this page.

And here's the PageSpeed score for that:

However, despite got everything working (or almost, apparently), I was only able to get here by setting up a proxy webserver that handles multiple Google domains and subdomains.

This raises a couple of questions that I'm pretty uncomfortable with:

1. Will these scripts work properly being served through the proxy webserver?
2. Won't Google deny access to the scripts by my proxy server, since they will receive millions of hits from the same IP address?

In the Google Publisher Tag docs, they are clear on that "You shouldn't serve versions of gpt.js, pubads_impl.js, or any libraries they load from your own server or load them from an unofficial source."

But it seems that the main reason for this is to avoid loading outdated scripts that could broke ad serving and lead to lost of revenue.

A little further down the line, they state this: "This also applies to service workers. If you use service workers to cache or modify responses to HTTP requests coming from your site, use a network-only strategy when handling requests for gpt.js in order to fetch an up-to-date version."

This caught my eyes, since it seems to indicate that it's possible to add response headers to a request IN THE WORKER ITSELF. But I'm guessing that, since my knowledge of workers is pretty much none.

So, I was thinking: if the ONLY REASON we need the proxy server is to add a Response Header to the script to avoid CORS issues, couldn't we do this directly in the worker, providing some sort of config option through Partytown, similar to what is done with the resolveUrl option?

If this is possible, it would eliminate the need for a proxy webserver and the request could be done using the original Google addresses, avoiding HTTP overhead, avoiding cached and outdated scripts, minimizing the risk of breaking scripts and still solving the CORS issue.

I found this thread on StackOverflow about adding headers to responses in a worker and it made me wonder...

const newResponse = fetch(event.request).then(response => {
  const newHeaders = new Headers(response.headers);
  newHeaders.append('Cache-Control', 'max-age=300');

  return new Response(response.body, {
    status: response.status,
    statusText: response.statusText,
    headers: newHeaders
  });
});

event.respondWith(newResponse);