title: Fetching CORS request in service worker
body: <p>I'm writing a service worker with the purpose of monitoring a website's traffic. I capture the request and the response and send data about it to my backend</p>
  
  <p>I'm trying to avoid monitoring the CORS requests.
  My logic is something like this (dropped not relevant lines):</p>
  
  <pre class="lang-js prettyprint-override"><code>self.addEventListener("fetch", function (event) {
    event.respondWith(handleRequest(event));
  });
  
  const handleRequest = async event =&gt; {
    let response;
    let request = event.request.clone();
      if (! isCrossOrigin(event.request)) {  
        response = await fetch(event.request);
        storeData(request, response.clone());
        return response;
      } else {
        console.log(`Dropping request for ${event.request.url}`)
        return fetch(request);
      }
  };
  
  </code></pre>
  
  <p>The problem is that when I have a CORS request and I'm fetching it via the <code>fetch(request)</code>, without changing original credentials state, I'm getting:</p>
  
  <pre><code>Access to fetch at 'https://other-domain.com/test-post' from origin
  'http://localhost:3000' has been blocked by CORS policy:
  The value of the 'Access-Control-Allow-Origin' header in the response
  must not be the wildcard '*' when the request's credentials mode is 'include'.
  </code></pre>
  
  <p>I can't send the request without the credentials because my client (the one who's using my service worker) might need it.</p>
  
  <p>I can't return a value other than <code>*</code> in the header simply because I don't own the 3rd party origin server. I can't ask to change their API for my monitoring.</p>
  
  <p>My question - Is there a way to just pass on the request as if it wasn't intercepted by my service worker? </p>
  
  <p>I don't mind ignoring CORS requests since they are not critical for what I'm monitoring.</p>