Google Tag Manager fetch error

[AykutSarac]

Summary

Getting the following error at console output

The FetchEvent for "<URL>" resulted in a network error response: the promise was resolved with an error response object.

Versions

• next-pwa: latest
• next: latest

How To Reproduce

Steps to reproduce the behavior:

1. Go to 'https://jsonvisio.com/'
2. See error

Link to minimal reproduce setup repository if any. https://github.com/AykutSarac/jsonvisio.com

Screenshots

If applicable, add screenshots to help explain your problem.

Additional Context

Add any other context about the problem here.

[AykutSarac]

Replicating the issue: 1- Hard reset the page (Command + Shift + R / CTRL + F5) - at this stage it works fine 2- Refresh page or revisit page

at stage 2 is where the problem occurs. Serviceworker is causing the issue here, if you unregister Serviceworker from Dev Tools > Application it works fine until it registers back. Any idea how to fix that? @shadowwalker?

[robsongajunior]

I'm not using next-pwa, but the same error in my app with Astro Build I solved cloning the response.

E.G

       const response = await fetch(clonedRequest);

        if ((response && response.ok) && clonedRequest.destination === 'script') {
          const clonedResponse = response.clone();

          const scriptContent = await clonedResponse.text();
          const clients = await self.clients.matchAll();

          for (const client of clients) {
            client.postMessage({
              cmd: 'runScript',
              content: scriptContent
            });
          }

          // Return the original response so the fetch completes as intended
          return response;
        } else {
          console.log(`response failure, sending original`);

          // If not a script or fetch wasn't successful, return the response directly
          return response;
        }

in the line seting clonedResponse is what i add to solve the same problem