Cors blocking me from GET-ing my server endpoint and redirecting - redirect

Question

I'm trying to build an Oauth2 flow. Cors keeps blocking my GET request to my own server.
localhost:3000 is the browser.
localhost:3001 is the server.
I have cors setup in NestJS below and it works for every other non-redirecting endpoint:
// main.ts
import { corsConfig } from '#common/config/index';
async function bootstrap() {
const app = await NestFactory.create(AppModule);
app.enableCors({
origin: [
/^https?:\/\/localhost:3000/,
],
methods: ['GET', 'POST'],
credentials: true,
});
await app.listen(process.env.PORT || 3001);
}
bootstrap();
When requesting to my server endpoint... these are the request.headers
{
"host": "localhost:3001",
"connection": "keep-alive",
"sec-ch-ua": "\" Not A;Brand\";v=\"99\", \"Chromium\";v=\"100\"",
"accept": "application/json, text/plain, */*",
"sec-ch-ua-mobile": "?0",
"user-agent": "Mozilla/5.0 (Windows NT 10.0; Win64; x64) SomeStuff",
"sec-ch-ua-platform": "\"Windows\"",
"origin": "http://localhost:3000",
"sec-fetch-site": "same-site",
"sec-fetch-mode": "cors",
"sec-fetch-dest": "empty",
"referer": "http://localhost:3000/",
"accept-encoding": "gzip, deflate, br",
"accept-language": "en-US,en;q=0.9,fr;q=0.8,es;q=0.7,de;q=0.6",
"cookie": "Authentication=someStuff"
}
When responding from my server, these are the response.headers
{
"cross-origin-opener-policy": "same-origin",
"cross-origin-resource-policy": "same-origin",
"x-dns-prefetch-control": "off",
"expect-ct": "max-age=0",
"x-frame-options": "SAMEORIGIN",
"strict-transport-security": "max-age=15552000; includeSubDomains",
"x-download-options": "noopen",
"x-content-type-options": "nosniff",
"origin-agent-cluster": "?1",
"x-permitted-cross-domain-policies": "none",
"referrer-policy": "no-referrer",
"x-xss-protection": "0",
"access-control-allow-origin": "http://localhost:3000",
"vary": "Origin",
"access-control-allow-credentials": "true",
"x-ratelimit-limit": "30",
"x-ratelimit-remaining": "28",
"x-ratelimit-reset": "60"
}
And this is the Cors error in my browser console
Access to XMLHttpRequest at 'https://example.com/' (redirected from
'http://localhost:3001/test') from origin 'http://localhost:3000'
has been blocked by CORS policy: No 'Access-Control-Allow-Origin'
header is present on the requested resource.
What do I need to change to allow a GET request to be redirected in the browser? Or is this not possible and it requires simply visiting the site with window.location?

Answer 1

I know this is not the ideal solution, but for my personal projects in a local environment, I used the "Moesif Origin & CORS Changer" browser extension to combat this annoying issue.
Google Chrome: https://chrome.google.com/webstore/detail/moesif-origin-cors-change/digfbfaphojjndkpccljibejjbppifbc
Firefox: https://addons.mozilla.org/en-US/firefox/addon/moesif-origin-cors-changer1/