title: Has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin
body: <p>I'm running my Vue app locally from <a href="http://localhost:8080" rel="nofollow noreferrer">http://localhost:8080</a> and I keep getting a slew of CORS errors, I've added the Access-Control-Allow-Origin header as seen blow but keep getting the following warning:</p>
  
  <p>' from origin '<a href="http://localhost:8080" rel="nofollow noreferrer">http://localhost:8080</a>' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.</p>
  
  <pre><code>const graphCall = () =&gt; {
  
    let tokenOptions = {
      method: 'POST',
      uri: 'https://login.microsoftonline.com/**key**/oauth2/v2.0/token',
      headers: {
        'Access-Control-Allow-Origin': 'http://localhost:8080',
        'contentType': 'application/x-www-form-urlencoded'
      },
  
      form: {
        grant_type: VUE_APP_GRANT_TYPE,
        client_secret: VUE_APP_CLIENT_SECRET,
        scope: VUE_APP_SCOPE,
        client_id: VUE_APP_CLIENT_ID
      }
  
    };
  
    return rp(tokenOptions)
      .then(data =&gt; {
  
        console.log(data)
  
  
      }).catch((err) =&gt; {
  
        console.log(err);
  
      });
  };
  
  </code></pre>
  
  <p>I've tried adding mode: 'no-cors' but just get the following - Error: Invalid value for opts.mode</p>
  
  <p>I've also tried '*' as the access control origin but to no avail.</p>
  
  <p>Is there a way through this CORS nightmare as we need to make this call to retrieve a key!</p>